原型对象的前世今生——function.prototype，了解一下？

2023-10-28 22:36:18

一、认识 function.prototype

在 JavaScript 中，每个函数都有一个 prototype 属性，它指向一个对象，该对象包含该函数的所有属性和方法。

function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.sayHello = function() {
  console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
};

const person1 = new Person('John', 25);
person1.sayHello(); // Hello, my name is John and I am 25 years old.

在上面的示例中，Person.prototype 是一个对象，包含 sayHello 方法。当我们使用 new 运算符创建一个 Person 对象时，该对象会继承 Person.prototype 上的所有属性和方法。因此，person1 可以访问 sayHello 方法，并能够输出 "Hello, my name is John and I am 25 years old."。

二、function.prototype 的属性和方法

function.prototype 对象包含许多有用的属性和方法，其中包括：

constructor ：指向该原型的构造函数。
hasOwnProperty ：用于检查对象是否包含指定属性。
isPrototypeOf ：用于检查一个对象是否为另一个对象的原型。
propertyIsEnumerable ：用于检查对象的属性是否可枚举。
toLocaleString ：将对象转换为字符串。
toString ：将对象转换为字符串。
valueOf ：将对象转换为基本值。

三、function.prototype 的用法

function.prototype 可以用于多种目的，其中包括：

添加方法到所有对象 ：我们可以使用 function.prototype.methodName = function() { ... } 的方式向所有对象添加新方法。例如，我们可以向所有对象添加一个 log 方法，如下所示：

Function.prototype.log = function() {
  console.log(this);
};

const person1 = new Person('John', 25);
person1.log(); // { name: 'John', age: 25 }

创建新的构造函数 ：我们可以使用 new Function(arg1, arg2, ..., body) 的方式创建一个新的构造函数。例如，我们可以创建一个 Animal 构造函数，如下所示：

const Animal = new Function('name', 'age', `
  this.name = name;
  this.age = age;
`);

const animal1 = new Animal('Dog', 5);
animal1.log(); // { name: 'Dog', age: 5 }