当前位置：首页 > JavaScript

js实现prototype扩展js

2026-01-31 12:48:00JavaScript

在 JavaScript 中扩展原型（prototype）是一种常见的增强内置对象功能的方法。以下是实现原型扩展的几种方式：

扩展内置对象的原型

通过修改内置对象（如 Array、String、Object）的原型，可以为所有实例添加自定义方法。例如，为 Array 添加一个 sum 方法：

Array.prototype.sum = function() {
  return this.reduce((acc, curr) => acc + curr, 0);
};
const arr = [1, 2, 3];
console.log(arr.sum()); // 输出: 6

扩展自定义构造函数的原型

对于自定义构造函数，可以通过原型扩展实现方法共享：

function Person(name) {
  this.name = name;
}
Person.prototype.greet = function() {
  return `Hello, ${this.name}!`;
};
const person = new Person('Alice');
console.log(person.greet()); // 输出: Hello, Alice!

使用 `Object.assign` 批量扩展原型

可以一次性为原型添加多个方法：

Object.assign(Array.prototype, {
  first() {
    return this[0];
  },
  last() {
    return this[this.length - 1];
  }
});
const arr = [1, 2, 3];
console.log(arr.first()); // 输出: 1
console.log(arr.last());  // 输出: 3

避免原型污染的最佳实践

检查方法是否存在：扩展前检查原型是否已存在同名方法。

if (!Array.prototype.sum) {
  Array.prototype.sum = function() { /* 实现 */ };
}

使用符号（Symbol）作为键：避免命名冲突。

const sumKey = Symbol('sum');
Array.prototype[sumKey] = function() { /* 实现 */ };

使用 ES6 类语法扩展

通过继承内置类扩展功能：

class CustomArray extends Array {
  sum() {
    return this.reduce((acc, curr) => acc + curr, 0);
  }
}
const arr = new CustomArray(1, 2, 3);
console.log(arr.sum()); // 输出: 6