JavaScript 中怎么通过构造函数实现多个相似对象的创建-js教程-PHP中文网

构造函数通过首字母大写的函数配合new关键字创建多个独立对象，属性和方法通过this或prototype定义，class是其语法糖。

javascript 中怎么通过构造函数实现多个相似对象的创建

用构造函数创建多个相似对象，核心是定义一个函数作为“模板”，再用 new 关键字调用它，每次调用都会生成一个独立的、具有相同结构的新对象。

构造函数的基本写法

构造函数本质是一个普通函数，只是约定首字母大写，并配合 new 使用。函数内部用 this 绑定属性和方法，这些会成为新对象的自有成员。

函数名首字母大写（如 Person），便于区分普通函数
函数体内通过 this.name = name 等方式设置实例属性
必须用 new Person(...) 调用，否则 this 指向全局对象（非严格模式下）或 undefined（严格模式下）

创建多个实例对象

每调用一次 new 构造函数()，就生成一个全新对象，彼此独立，互不影响。

function Car(brand, color) {
  this.brand = brand;
  this.color = color;
  this.start = function() {
    console.log(this.brand + ' 启动了');
  };
}

const car1 = new Car('Toyota', 'blue');
const car2 = new Car('Honda', 'red');

console.log(car1.brand); // 'Toyota'
console.log(car2.brand); // 'Honda'
car1.start(); // 'Toyota 启动了'
car2.start(); // 'Honda 启动了'

注意：上面例子中 start 方法在每个实例上都重复创建，内存不高效——实际开发中推荐把方法挂到原型上（见下一点）。

Gradle 9.8.0

下载

优化：方法放到 prototype 上

为避免每次新建实例都重复创建相同方法，可将共用方法定义在构造函数的 prototype 属性上。所有实例自动共享该方法，节省内存，且支持后续扩展。

Car.prototype.drive = function() { ... } —— 所有 Car 实例都能调用 drive
实例访问属性时优先找自身，找不到则沿 __proto__ 链向上查找原型
修改原型上的方法，所有已有实例立即生效

function Car(brand, color) {
  this.brand = brand;
  this.color = color;
}
Car.prototype.drive = function() {
  console.log(this.brand + ' 正在行驶');
};

const car1 = new Car('BMW', 'black');
const car2 = new Car('Audi', 'white');
car1.drive(); // 'BMW 正在行驶'
car2.drive(); // 'Audi 正在行驶'

现代替代方案：class 语法（本质仍是构造函数）

ES6 的 class 是构造函数的语法糖，更清晰易读，底层仍基于原型机制。

class Animal {
  constructor(name, type) {
    this.name = name;
    this.type = type;
  }
  speak() {
    console.log(this.name + ' 发出声音');
  }
}

const dog = new Animal('旺财', 'dog');
const cat = new Animal('咪咪', 'cat');

编译后等价于带 prototype 方法的构造函数，语义更明确，推荐新项目使用。