zoukankan      html  css  js  c++  java
  • 前端笔记 2020.4.1(工厂模式,构造函数,原型模式)面向对象

    工厂模式:(不知道对象的类型)

    //工厂模式
    function createPerson(name,age,job){
        var o={
            name:name,
            age:age,
            job:job,
            sayName(){
                console.log(`我是${this.name}`)
            }
        }
        return o;
    }
    let p1=createPerson("小明",25,"前端开发")
    console.log(p1)
    p1.sayName()

    结果p1

    构造函数模式:(知道对象的类型)

    //构造函数模式
    function Person(name,age,job){
        this.name=name
        this.age=age
        this.job=job
        this.sayName=function(){
            console.log(`我是${this.name}`)
        }
    }
    let p2=new Person("小明",25,"前端开发")
    console.log(p2)
    p2.sayName()

    结果p2

    p2的constructor就是当前类型

    p1和p2都数据Object类型,但只有p2属于Person类型

    使用call或apply改变this指向:(p3是使用Person创建的个Object类型的对象)

    let p3={}
    Person.call(p3,"小红",26,"测试")
    console.log(p3)
    p3.sayName()

    结果

    原型模式:(相同的属性或方法可以提取出来)

    //使用原型模式
    function Person2(name,age,job){
        this.name=name
        this.age=age
        this.job=job
    }
    //相同的属性或方法可以提取出来
    Person2.prototype.sayName=function(){
        console.log(`我是${this.name}`)
    }
    let p4=new Person2("张三",27,"后端开发")
    console.log(p4)
    p4.sayName()

    结果

  • 相关阅读:
    Codeforces Round #564 (Div. 1)
    Codeforces Round #569 (Div. 1)
    SDOI2019R2游记
    BZOJ 3555: [Ctsc2014]企鹅QQ
    SDOI2019R1游记
    计数的一些东西
    多项式的各种操作
    BZOJ 5424: 烧桥计划
    Codeforces Round #545 (Div. 1)
    概率期望学习笔记
  • 原文地址:https://www.cnblogs.com/wuhairui/p/12616790.html
Copyright © 2011-2022 走看看