明辨 JS 中 prototype 与 __proto__
背景:在 Javascript 的原型链章节中,提到了两个重要的属性,分别是 prototype 和 __proto__ ,虽然学了很久但一直无法清晰的分辨这两个属性的区别。
定义:当函数被用作构造函数(通过 new 调用)时,prototype 对象会成为新创建对象的原型(即新对象的 __proto__ 会指向构造函数的 prototype )
实例:
function Person(name){// 这是一个构造函数,说白了终究还是一个函数this.name = name;
}// 通过构造函数创建新的实例对象
var muxi = new Person("muxi");console.log(muxi.__proto__ === Person.prototype) // true
说明:以上例子中,通过 new 关键字基于 Person 这个构造函数创建了一个名为 muxi 的实例,根据上面的定义可知,Person.prototype 就是 muxi 的原型,muxi.__proto__ 就指向 Person.prototype ,即 muxi.__proto__ === Person.prototype 。
知识点补充:
1 prototype 是函数的属性,用于设置实例的原型,而 __proto__ 是对象的属性,指向创建它的构造函数的;
2 在上面的实例中,Person 类同时具备 prototype 与 __proto__ 属性,而 muxi 这个实例只具有 __proto__ 属性;(Person 的 prototype 属性是作为构造函数时创建的对象的原型,而 Person 的 __proto__ 指向函数本身的原型 (所有函数都是 Function 的实例,等价于 Person.__proto__ === Function.prototype ))
Person.__proto__ === Function.prototype // true // 等价于 Person.__proto__ === window.Object.Function.prototype