JavaScript面向对象编程：原型添加函数与构造函数内声明函数的差异及优势

安全阿岳

2026-5-25

嘿，这个问题问到点子上了！在JavaScript的面向对象编程里，把方法挂到原型上和在构造函数里直接定义方法，确实有不少关键的差异和优劣，咱们慢慢拆解，顺便先提一句你给的示例里的小坑——箭头函数不能用来做构造函数，而且原型上用箭头函数会搞乱this指向，我先把示例修正成能正常跑的版本，再讲核心差异：

先修正示例代码（避免踩坑）

原型挂载方法的正确写法

// 用普通函数做构造函数，箭头函数不能被new调用！
function Person(name) {
  this.name = name;
}
// 原型上用普通函数，保证this指向实例
Person.prototype.greet = function() {
  console.log(`my name is ${this.name}!`);
};

const James = new Person('James');
James.greet(); // 输出 "my name is James!"

构造函数内定义方法的正确写法

function Person(name) {
  this.name = name;
  // 这里用普通函数或箭头函数都能指向实例，但内存问题依然存在
  this.greet = function() {
    console.log(`my name is ${this.name}!`);
  };
}

const James = new Person('James');
James.greet(); // 输出 "my name is James!"

核心差异与优势对比

1. 内存占用：原型方式完胜

原型挂载：所有Person实例共享同一份greet方法，不管你创建10个还是1000个实例，这个方法在内存里只存在一份，所有实例通过原型链访问它。
构造函数内定义：每个实例都会生成一个全新的greet函数副本。比如创建1000个Person实例，就有1000个独立的greet函数，大型应用里会造成不必要的内存浪费。

2. 可维护性：原型方式更灵活

原型挂载：如果要修改方法逻辑，直接改Person.prototype.greet就行，所有已创建的实例都会自动用上新逻辑——因为它们都是通过原型链访问的。比如：
```
Person.prototype.greet = function() {
  console.log(`Hello, I'm ${this.name}!`); // 所有实例调用greet都会输出新内容
};
```
构造函数内定义：修改构造函数里的方法只会影响之后创建的实例，已经存在的实例的greet方法不会变。要是想改已有实例的方法，得一个个遍历修改，麻烦得很。

3. 继承兼容性：原型方式更贴合JS设计

原型挂载：完美适配JS的原型继承模式。当你创建子类继承Person时，子类可以轻松继承原型上的方法，还能重写方法而不影响父类实例，甚至用父类逻辑：

function Student(name, grade) {
  Person.call(this, name);
  this.grade = grade;
}
// 继承父类原型
Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor = Student;

// 重写greet，同时调用父类方法
Student.prototype.greet = function() {
  Person.prototype.greet.call(this);
  console.log(`I'm in grade ${this.grade}`);
};

构造函数内定义：子类无法通过原型链继承这些方法，必须在子类构造函数里手动调用父类构造函数，继承逻辑变得繁琐，而且子类实例依然会有独立的方法副本，内存问题照旧。

4. this指向与枚举性细节

this指向：原型上的方法用普通函数时，this会自动指向调用它的实例；但如果用箭头函数，this会绑定到定义时的词法作用域（比如浏览器里的window），导致this.name取不到值。构造函数内的方法不管用普通函数还是箭头函数，this都指向当前实例，但箭头函数依然解决不了内存问题。
枚举性：原型挂载的方法默认是不可枚举的（用Object.keys(James)看不到greet），和JS内置对象的行为一致（比如Array.prototype.push也不可枚举）；构造函数内定义的方法是可枚举的，遍历实例属性时可能会把方法也列出来，需要额外过滤。

总结

除非你有特殊需求（比如方法需要访问构造函数内的私有变量，或者要绑定固定的this），否则优先选择把方法挂载到原型上——它更高效、更符合JS的设计理念，也更利于代码的维护和继承。

内容的提问来源于stack exchange，提问作者Casa Lim