讲师中心 微信公众号
AI工具推荐 视频效率加速

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

风静同学_7108

风静同学_7108

发布时间:2025-12-01 13:16:37

|

781人浏览过

|

来源于php中文网

原创

字面量适合单个对象;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 上,节省内存。

Json Repair Kit
Json Repair Kit

使用 Node.js 评估修复格式错误的 JSON,自动纠正尾随逗号、单引号、未加引号的键等常见问题,实现文件规范化。

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

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

热门AI工具

更多
Atoms
Atoms Hot

Atoms是一款AI智能体工具,第一支自动构建真实业务的 AI 团队。

音述AI
音述AI Hot

一款AI音频处理工具,主要用于音述AI是一个以“用声音述说故事”为核心的 AI 音乐创作与声音分享社区,适合需要提升相关任务效率的用户。

小橡皮AI

一款AI工具,主要用于小橡皮一键去AI味,将机器味重的内容改得更有活人感,防止因为 AI 内容被平台打上 AI 标签,以及限流,适合需要提升相关任务效率的用户。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

超级简历WonderCV

一款AI办公效率工具,主要用于免费求职简历模版下载制作,应届生职场人必备简历制作神器,适合需要提升相关任务效率的用户。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

切问学术

切问学术是一款AI论文写作工具,复旦大学NLP团队推出的AI学术智能体。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

墨刀AI
墨刀AI Hot

一款AI图像与设计工具,主要用于产品经理的专属智能体,适合需要提升相关任务效率的用户。

相关专题

更多
es6新特性
es6新特性

es6新特性有:1、块级作用域变量;2、箭头函数;3、模板字符串;4、解构赋值;5、默认参数;6、 扩展运算符;7、 类和继承;8、Promise。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

285

2023.07.17

es6新特性有哪些
es6新特性有哪些

es6的新特性有:1、块级作用域;2、箭头函数;3、解构赋值;4、默认参数;5、扩展运算符;6、模板字符串;7、类和模块;8、迭代器和生成器;9、Promise对象;10、模块化导入和导出等等。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

406

2023.08.04

JavaScript ES6新特性
JavaScript ES6新特性

ES6是JavaScript的根本性升级,引入let/const实现块级作用域、箭头函数解决this绑定问题、解构赋值与模板字符串简化数据处理、对象简写与模块化提升代码可读性与组织性。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

375

2025.12.24

go语言 面向对象
go语言 面向对象

本专题整合了go语言面向对象相关内容,阅读专题下面的文章了解更多详细内容。

6795

2025.09.05

java面向对象
java面向对象

本专题整合了java面向对象相关内容,阅读专题下面的文章了解更多详细内容。

342

2025.11.27

C++ 面向对象编程与设计模式实践
C++ 面向对象编程与设计模式实践

本专题整合了 C++ 面向对象编程的核心机制,涵盖类的定义与访问控制、构造函数与析构函数、拷贝语义与移动语义、继承与虚函数多态、抽象类与接口、运算符重载、友元函数等关键知识点,同时结合单例模式、工厂模式、观察者模式、策略模式等常用设计模式的 C++ 实现,帮助开发者写出结构清晰、易于维护的面向对象代码。

364

2026.04.09

Java 面向对象与核心编程机制
Java 面向对象与核心编程机制

系统讲解 Java 面向对象编程的核心知识体系,涵盖类的定义与封装、构造方法与 this/super 关键字、继承与方法重写、多态与向上向下转型、抽象类与接口的区别与设计原则、异常处理机制(try-catch-finally / 自定义异常)、泛型的类型参数与通配符、集合框架(List/Set/Map)的使用与遍历方式,帮助开发者全面掌握 Java 程序设计的核心机制与面向对象思维。

223

2026.04.17

treenode的用法
treenode的用法

​在计算机编程领域,TreeNode是一种常见的数据结构,通常用于构建树形结构。在不同的编程语言中,TreeNode可能有不同的实现方式和用法,通常用于表示树的节点信息。更多关于treenode相关问题详情请看本专题下面的文章。php中文网欢迎大家前来学习。

2621

2023.12.01

Gradle插件开发入门教程
Gradle插件开发入门教程

本专题介绍Gradle插件开发的基本流程,涵盖插件类编写、自定义任务注册、扩展参数设计和插件应用方法,帮助你理解插件如何组织构建逻辑,减少多个项目之间的重复配置。

60

2026.10.22

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
WebStorm 官方调试文档
WebStorm 官方调试文档

共0课时 | 0人学习

React 教程
React 教程

共58课时 | 12.3万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 6.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn