我们先来看个实例:
function cat(){}
console.log(cat.pototype)
运行如上代码后,控制台上面应该出现了像这样的一个对象.
现在我们往cat的原型上添加一些属性,如下
function cat(){}
cat.prototype.run = "fast";
console.log( cat.prototype );
控制台:
此时run属性已经添加到cat的原型中了,然后我们创建一个实例,给danceCat对象添加一个dance属性,
function cat(){}
cat.prototype.run = "fast";
var danceCat= new cat();
danceCat.dance = "can dance";
console.log(danceCat)
此时我们可以看到其实danceCat
的__proto__
属性就是cat.prototype
。也就是说,当你访问一个danceCat
的一个属性,浏览器会先查看danceCat
是否有这个属性,如果有就使用。如果没有这个属性,就会从danceCat
的__proto__
属性中去找,如果有就使用。如果没有就继续从danceCat
的__proto__
的__proto__
属性继续寻找,看是否有这个属性。如果没有就继续往下找,直至找到,如果原型链上面的所有的 __proto__
都被找完了,那浏览器所有已经声明了的__proto__
上都不存在这个属性,然后得出结论,这个属性是undefined
。
所以什么是原型链呢?
JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象拥有一个原型对象,对象以其原型为模板、从原型继承方法和属性。原型对象也可能拥有原型,并从中继承方法和属性,一层一层、以此类推。这种关系常被称为原型链 (prototype chain),它解释了为何一个对象会拥有定义在其他对象中的属性和方法。
准确地说,这些属性和方法定义在Object的构造器函数(constructor functions)之上的prototype
属性上,而非对象实例本身。
在传统的 OOP 中,首先定义“类”,此后创建对象实例时,类中定义的所有属性和方法都被复制到实例中。在 JavaScript 中并不如此复制——而是在对象实例和它的构造器之间建立一个链接(它是__proto__属性,是从构造函数的prototype
属性派生的),之后通过上溯原型链,在构造器中找到这些属性和方法。
参考自 mdn 原型链