JavaScript创建对象的七种方式("JavaScript中创建对象的7种方法详解")

原创

ithorizon 7个月前 (10-20) 阅读数 51 #后端开发

JavaScript中创建对象的7种方法详解

一、工厂模式

工厂模式是创建对象的一种基本方案，通过一个函数来创建对象，并将对象的属性和方法封装在这个函数中。


function createObject(name, age) {
    var obj = new Object();
    obj.name = name;
    obj.age = age;
    obj.sayName = function() {
        console.log(this.name);
    };
    return obj;
}
var person1 = createObject('张三', 25);
person1.sayName(); // 输出：张三

二、构造函数模式

构造函数模式是工厂模式的提升版，通过构造函数创建对象，并使用new关键字来调用构造函数。


function Person(name, age) {
    this.name = name;
    this.age = age;
    this.sayName = function() {
        console.log(this.name);
    };
}
var person2 = new Person('李四', 30);
person2.sayName(); // 输出：李四

三、原型模式

原型模式利用原型链的特性，通过原型对象来共享属性和方法。


function Person() {}
Person.prototype.name = '王五';
Person.prototype.age = 35;
Person.prototype.sayName = function() {
    console.log(this.name);
};
var person3 = new Person();
person3.sayName(); // 输出：王五

四、组合使用构造函数和原型模式

将构造函数和原型模式结合使用，可以发挥二者的优点，既可以保持对象的私有属性，又可以共享方法。


function Person(name, age) {
    this.name = name;
    this.age = age;
}
Person.prototype.sayName = function() {
    console.log(this.name);
};
var person4 = new Person('赵六', 40);
person4.sayName(); // 输出：赵六

五、动态原型模式

动态原型模式将原型的初始化放在构造函数的内部，通过判断原型对象是否具有某个属性或方法来决定是否初始化。


function Person(name, age) {
    this.name = name;
    this.age = age;
    if (typeof this.sayName !== 'function') {
        Person.prototype.sayName = function() {
            console.log(this.name);
        };
    }
}
var person5 = new Person('孙七', 45);
person5.sayName(); // 输出：孙七

六、寄生构造函数模式

寄生构造函数模式是工厂模式的提升版，通过创建一个函数来封装创建对象的逻辑，并在函数内部创建对象。


function createObject(name, age) {
    var obj = new Object();
    obj.name = name;
    obj.age = age;
    obj.sayName = function() {
        console.log(this.name);
    };
    return obj;
}
function Person(name, age) {
    var obj = createObject(name, age);
    return obj;
}
var person6 = new Person('周八', 50);
person6.sayName(); // 输出：周八

七、寄生组合继承模式

寄生组合继承模式结合了构造函数模式和原型模式，解决了组合继承模式中子对象无法继承父对象原型链上方法的缺点。


function Parent(name) {
    this.name = name;
}
Parent.prototype.sayName = function() {
    console.log(this.name);
};
function Child(name, age) {
    Parent.call(this, name);
    this.age = age;
}
Child.prototype = new Parent();
Child.prototype.constructor = Child;
var person7 = new Child('吴九', 55);
person7.sayName(); // 输出：吴九