JavaScript对象创建方式_JavaScript设计模式应用-js教程-PHP中文网

JavaScript对象创建方式_JavaScript设计模式应用

夜晨

发布： 2025-12-01 13:16:37

原创

735人浏览过

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

javascript对象创建方式_javascript设计模式应用

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

1. 字面量方式创建对象

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

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

登录后复制

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

2. 构造函数方式

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

立即学习“Java免费学习笔记（深入）”；

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 中创建对象的经典方式。

爱克网络企业网站建设系统 No.090730

系统特点：功能简洁实用。目前互联网上最简洁的企业网站建设系统！原创程序代码。非网络一般下载后修改的代码。更安全。速度快！界面模版分离。原创的分离思路，完全不同于其他方式，不一样的简单感受！搜索引擎优化。做了基础的seo优化。对搜索引擎更友好系统功能关于我们：介绍企业介绍类信息，可自由添加多个介绍栏目！资讯中心：公司或行业资讯类内容展示。可自由添加多个资讯内容！产品展示：支持类别设置，可添加产品图片

查看详情

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') };
    }
  }

登录后复制

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

以上就是JavaScript对象创建方式_JavaScript设计模式应用的详细内容，更多请关注php中文网其它相关文章！