JavaScript 创建对象有哪些方式?

129 阅读2分钟

JavaScript 创建对象有哪些方式?

1. 对象字面量

使用{}直接定义对象,‌这是最简单和最直接的方式。‌

const obj = {}; // 创建一个空对象

2. Object 构造函数

创建自定义对象可以创建 Object 的一个新实例,再添加属性和方法,如下所示:

let person = new Object();

// 添加属性
person.name = "Lucy";

// 添加方法
person.sayName = function() {
  console.log(this.name)
}

3. Object.create()

Object.create()方法创建一个新的对象,使用现有的对象作为新创建对象的原型。

let person = {
  name: "Lucy",
  sayName() {
    console.log(this.name)
  }
}

let person1 = Object.create(person);
console.log(person1.name); // "Lucy"

4. 类(ES6)

class Person {
  constructor(name) {
    this.name = name;
  }
	// 定义方法
  sayName() {
    console.log(this.name)
  }
}

const person1 = new Person("Lucy");
person1.sayName(); // "Lucy"

5. 工厂模式

function createPerson(name) {
  let o = new Object();
  o.name = name;
  o.sayName = function() {
    console.log(this.name);
  };
  return o;
}

let person1 = createPerson("Lucy");
let person2 = createPerson("Joe");

函数 createPerson()接收 1 个参数 name, 根据这个参数创建了一个包含 Person 信息的对象,可以用不同的参数多次调用这个函数,每次都会返回包含 1 个属性和 1 个方法的对象。在 createPerson() 中可以根据实际需求给 Person 对象添加更多属性和方法。

工厂模式虽然解决了创建多个相似对象的问题,但却没有解决对象识别的问题(即怎样知道一个对象的类型)。

6. 构造函数模式

通过定义一个函数来创建对象,‌这个函数通常以new关键字调用,‌并且可以接受参数来初始化对象的属性。‌

function Person(name, age) { 
    this.name = name; this.age = age; 
} 
const person1 = new Person("张三", 30); // 使用构造函数创建对象
  • 优点:可以确保实例被标识为特定类型,相比于工厂函数,这是一个很大的好处。
  • 缺点:如果构造函数中包含的方法,则会重复创建,造成内存的浪费(只适合放属性不适合方法)

7. 原型模式

将共同的方法放到原型当中可以避免重新创建相同功能的方法,减少了内存的使用

function Person() {};

// 将属性和方法添加到 prototype 属性上
Person.prototype.name = "Lucy";
Person.prototype.sayName = function() {
  console.log(this.name)
}

let person1 = new Person();
person1.sayName(); // "Lucy"

let person2 = new Person();
person2.sayName(); // "Lucy"

7. 组合模式

是原型模式和构造函数模式的结合。将属性放在构造函数,方法放在原型上。

function Person(name, age) { 
    this.name = name 
    this.age = age 
} 
Person.prototype.getInfo = function() {
    console.log(this.name, this.age) 
} 
const p1 = new Person(name, age)