17370845950

JavaScript对象创建方式_JavaScript设计模式应用
字面量适合单个对象;2. 构造函数配合原型可批量创建并优化内存;3. ES6 class语法更清晰,推荐现代项目使用;4. 工厂函数灵活封装创建逻辑;5. 单例、建造者、工厂等设计模式依托不同创建方式实现,提升代码扩展性与维护性。

JavaScript 中创建对象的方式多种多样,不同的场景适合不同的模式。掌握这些方式不仅有助于写出更清晰的代码,还能为应用设计模式打下基础。下面介绍几种常见的对象创建方法,并结合设计模式说明其实际应用。

1. 字面量方式创建对象

这是最简单直接的方式,适用于创建单个对象。

const person = {
  name: 'Alice',
  age: 25,
  greet() {
    console.log(`Hello, I'm ${this.name}`);
  }
};
person.greet();

适用场景:配置对象、临时数据结构、不需要复用逻辑时。这种方式不适合需要创建多个类似对象的情况。

2. 构造函数方式

使用函数作为构造器,通过 new 关键字生成实例,实现对象的批量创建。

function Person(name, age) {
  this.name = name;
  this.age = age;
  this.greet = function() {
    console.log(`Hi, I'm ${this.name}`);
  };
}

const p1 = new Person('Bob', 30);
const p2 = new Person('Charlie', 35);

注意:每个实例都会重新创建 greet 函数,造成内存浪费。可通过原型链优化。

3. 原型方式(prototype)

将共享方法挂载在构造函数的 prototype 上,节省内存。

Person.prototype.greet = function() {
  console.log(`Hello from ${this.name}`);
};

现在所有 Person 实例共享同一个 greet 方法,提升性能。构造函数 + 原型组合模式是早期 JS 中创建对象的经典方式。

4. ES6 Class 语法

ES6 引入 class,让面向对象写法更清晰,本质仍是基于原型。

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  greet() {
    console.log(`I'm ${this.name}`);
  }
}

语法更接近传统语言,易于理解和维护,推荐在现代项目中使用。

5. 工厂函数模式

不依赖 new,返回一个新对象,适合需要封装创建逻辑的场景。

function createPerson(name, age) {
  return {
    name,
    age,
    greet() {
      console.log(`Hey, I'm ${this.name}`);
    }
  };
}

const p = createPerson('Dana', 28);

工厂函数避免了 this 的指向问题,灵活且易于测试,适合复杂对象构建。

6. 设计模式中的应用

对象创建方式直接影响设计模式的实现效果。

  • 单例模式:确保一个类只有一个实例。可通过闭包或模块模式实现。
  •   const Singleton = (function() {
        let instance;
        function create() {
          return { name: 'Singleton' };
        }
        return {
          getInstance() {
            if (!instance) {
              instance = create();
            }
            return instance;
          }
        };
      })();
    
      const s1 = Singleton.getInstance();
      const s2 = Singleton.getInstance(); // 同一实例
      
  • 建造者模式:分步创建复杂对象,常用于配置项较多的场景。
  •   class ComputerBuilder {
        constructor() {
          this.computer = {};
        }
        setCPU(cpu) {
          this.computer.cpu = cpu;
          return this; // 支持链式调用
        }
        setRAM(ram) {
          this.computer.ram = ram;
          return this;
        }
        build() {
          return this.computer;
        }
      }
    
      const pc = new ComputerBuilder()
        .setCPU('i7')
        .setRAM('16GB')
        .build();
      
  • 工厂模式:根据不同条件返回不同类型的对象。
  •   function createVehicle(type) {
        if (type === 'car') {
          return { wheels: 4, drive: () => console.log('Driving car') };
        } else if (type === 'bike') {
          return { wheels: 2, ride: () => console.log('Riding bike') };
        }
      }
      

基本上就这些。选择合适的对象创建方式,能让代码更具扩展性和可维护性。结合设计模式,可以更好地组织逻辑,应对复杂需求。