前端笔记 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类型

前端笔记 2020.4.1(工厂模式,构造函数,原型模式)面向对象_第1张图片

 

使用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()

结果

 

你可能感兴趣的:(前端笔记 2020.4.1(工厂模式,构造函数,原型模式)面向对象)