JavaScript 对象创建模式

2020-04-28  本文已影响0人  BlueSkyBlue

Object构造函数模式

套路:先创建一个空的Object对象,再动态添加属性和方法。

示例:

var p = new Object()
p.name = 'Tom'
p.age = 12

p.setName = function (name) {
    this.name = name
}

p.setName('Jack')
console.log(p.name, p.age)

输出:

适用场景:起始时不确定对象内部数据。
问题:要写的语句太多。

对象字面量模式

套路:使用{}创建对象,同时指定属性和方法。

var p = {
    name: 'Tom',
    age: 12,
    setName: function (name) {
        this.name = name
    }
}

适用场景:起始时对象内部数据是确定的。
问题:如果创建多个对象,会有重复代码。

工厂模式

套路:通过工厂函数动态创建对象并返回。

返回一个对象的函数都可以称为工厂函数。

function createPerson(name, age) {
    var obj = {
        name: name,
        age: age,
        setName: function (name) {
            this.name = name
        }
    }
    return obj
}

适用场景:需要创建多个对象时。
问题:对象没有一个具体的类型,都是Object类型。

自定义构造函数模式

套路:自定义构造函数,通过new创建对象。

function Person(name, age){
    this.name = name
    this.age = age
    this.setName = function (name) {
        this.name = name
    }
}

var p1 = new Person('Tom', 12)

适用场景:需要创建多个类型确定的对象。
问题:每个对象都有相同的数据,浪费内存。
为了解决这个问题,我们可以把对象共同的部分放到原型对象上:

function Person(name, age){
    this.name = name
    this.age = age
}
Person.prototype.setName = function (name) {
    this.name = name
}
上一篇 下一篇

猜你喜欢

热点阅读