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
}