深入理解 JavaScript 原型机制
2023-10-02 21:18:49
认识原型对象
JavaScript 中的每个对象都有一个原型对象。原型对象是一个特殊的对象,它包含着该对象的所有属性和方法。当我们访问一个对象的属性或方法时,JavaScript 引擎会首先在该对象中查找,如果找不到,就会沿着原型链向上查找,直到找到该属性或方法为止。
原型链是一个由对象和原型对象组成的链条,它从一个对象开始,一直延伸到原型对象。原型对象是原型链的最后一个对象,它通常是 Object 对象。
创建原型对象
我们可以使用 Object.create() 方法来创建原型对象。例如,我们可以创建一个 Cat 对象的原型对象如下:
const Cat = {
name: 'Cat',
age: 0,
meow: function() {
console.log('喵喵喵');
}
};
这个原型对象包含了 Cat 对象的所有属性和方法。
使用原型对象创建对象
我们可以使用原型对象来创建 Cat 对象。例如,我们可以创建一个名为 c1 的 Cat 对象如下:
const c1 = Object.create(Cat);
这个 c1 对象继承了 Cat 原型对象的所有属性和方法。我们可以通过以下方式访问 c1 对象的属性和方法:
console.log(c1.name); // Cat
console.log(c1.age); // 0
c1.meow(); // 喵喵喵
修改原型对象
我们可以修改原型对象来修改所有继承该原型对象的对象。例如,我们可以修改 Cat 原型对象的 age 属性如下:
Cat.age = 1;
这个修改会影响到所有继承 Cat 原型对象的对象。例如,c1 对象的 age 属性也会变成 1。
console.log(c1.age); // 1
原型链
原型链是 JavaScript 中一个非常重要的概念。它允许对象共享属性和方法,从而实现代码的复用和扩展。原型链从一个对象开始,一直延伸到原型对象。原型对象是原型链的最后一个对象,它通常是 Object 对象。
我们可以使用 Object.getPrototypeOf() 方法来获取一个对象的原型对象。例如,我们可以获取 c1 对象的原型对象如下:
const proto = Object.getPrototypeOf(c1);
console.log(proto); // { name: 'Cat', age: 1, meow: function() { ... } }
这个 proto 对象就是 c1 对象的原型对象。它包含了 Cat 对象的所有属性和方法。
总结
原型是 JavaScript 中一个非常重要的概念。它允许对象共享属性和方法,从而实现代码的复用和扩展。原型链从一个对象开始,一直延伸到原型对象。原型对象是原型链的最后一个对象,它通常是 Object 对象。
我们可以使用 Object.create() 方法来创建原型对象。我们可以使用原型对象来创建对象。我们可以修改原型对象来修改所有继承该原型对象的对象。我们可以使用 Object.getPrototypeOf() 方法来获取一个对象的原型对象。