JavaScript中4种常见对象创建模式及优缺点解析

前言

在JavaScript开发中，创建对象是最基础的操作之一。最直观的方法是使用对象字面量直接定义，但这仅适用于创建少量、独立且无关联的对象。当需要批量生成具有相同结构和行为的对象时，就需要借助特定的设计模式来优化实现。

1、工厂模式

实现方式如下：

function fn(a,b){
    let obj = new Object()
    obj.a=a
    obj.b=b
    return obj
}

const test = fn(1,2)

该模式的主要优势在于能够有效解决批量创建相似对象的问题，避免了代码重复。

然而，其局限性在于无法解决对象类型的识别问题，即通过该方式创建的对象无法被准确判断其所属的具体类型。

2、构造函数模式

具体实现代码如下：

function Fn(a,b){
    this.a=a
    this.b=b
    this.c=function(){
          console.log(this.a)
    }
}

const test1 = new Fn(1,2)
const test2 = new Fn(1,2)
console.log(test1.c === test2.c)// false

此模式的优点是利用new关键字隐式创建对象，使得代码结构更加简洁清晰。

其缺点在于，如果在构造函数内部定义方法，每个实例都会重新创建该方法，导致内存浪费（除非该方法被声明为全局共享）。

3、原型模式

实现方案如下：

function Fn(a,b){
    Fn.prototype.a=a
    Fn.prototype.b=b
    Fn.prototype.c=function(){
          console.log(a)
    }
}

const test = new Fn(1,2)

原型模式的核心优势是，在构造函数中定义的属性和方法可以被所有对象实例共享，从而节省内存。

该模式的潜在风险是，如果原型上的属性包含引用类型（如数组或对象），这些引用值会在不同实例之间共享，导致数据污染。例如：

function Fn(){
    Fn.prototype.a=[1,2]
}

const test1 = new Fn()
const test2 = new Fn()
test1.a.push(3)
console.log(test1.b, test2.b)// [1,2,3] [1,2,3] 
const test3 = new Fn()// 原型上属性会重新赋值
console.log(test1.b, test2.b,test3.b)// [1,2] [1,2] [1,2] 

4、Object.create()方法

具体用法如下：

const obj = { a:1 , b:2 }

const test = Object.create(obj)
console.log(test.a)// 1

该方法的主要优点是允许基于一个现有对象来构造新对象，实现了对象的复用。

其缺点在于，构造过程仅执行浅克隆，如果原型对象中包含引用类型的属性，这些引用依然会被共享，从而存在数据被意外修改的风险。

其他模式

除了上述四种常见模式外，JavaScript中还存在其他用于批量创建对象的高级模式：

• 动态原型模式：仅在第一次调用构造函数时，将方法赋给原型对象的相应属性，后续实例的处理方式与构造函数模式相同。
• 寄生构造函数模式：主要目的是封装创建对象的代码，然后返回新创建的对象，调用时仍使用new操作符。
• 稳妥构造函数模式：该模式不暴露公共属性，仅包含私有变量和方法，以及用于访问私有变量的get/set方法，适用于对数据封装性要求较高的场景。

总结

至此，关于JavaScript中常见的四种对象创建方式及其优缺点的介绍已完成。如需了解更多关于JS对象创建的细节，建议查阅本站相关文章或继续浏览后续内容。感谢大家的支持！