【JavaScript】通过一个例子认识prototype,constructor和instanceof

面试题是这样的：

var A = function() {}; A.prototype = {}; var B = {}; console.log(A.constructor);console.log(B.constructor); var a = new A(); A.prototype = {}; var b = new A(); b.constructor = A.constructor; console.log(a.constructor == A);console.log(a.constructor == b.constructor); console.log(a instanceof A); console.log(b instanceof A); 

本示例是本人在全屏浏览器状态下测试的，看不清可在新窗口打开

---

prototype 与 __proto__的区别

• prototype是函数才有的属性
• __proto__是每个对象都有的属性

注：大多数情况下，__proto__可以理解为“构造器的原型”，即__proto__ === constructor.prototype（但通过Object.create()创建的对象不适用此等式）

__proto__指向哪里？

/*1、字面量方式*/var a = {};console.log(a.__proto__);  //Object {}console.log(a.__proto__ === a.constructor.prototype); //true/*2、构造器方式*/var A = function(){};var a = new A();console.log(a.__proto__); //A {}console.log(a.__proto__ === a.constructor.prototype); //true/*3、Object.create()方式*/var a1 = {a:1}var a2 = Object.create(a1);console.log(a2.__proto__); //Object {a: 1}console.log(a.__proto__ === a.constructor.prototype); //false（此处即为图1中的例外情况）

constructor

　　constructor的值是一个函数。在JavaScript中，除了null和undefined外的类型的值、数组、函数以及对象，都有一个constructor属性，constructor属性的值是这个值、数组、函数或者对象的构造函数。如：

var a = 12, // 数字    b = 'str', // 字符串    c = false, // 布尔值    d = [1, 'd', function() { return 5; }], // 数组    e = { name: 'e' }, // 对象    f = function() { return 'function'; }; // 函数console.log('a: ', a.constructor); // Number()console.log('b: ', b.constructor); // String()console.log('c: ', c.constructor); // Boolean()console.log('d: ', d.constructor); // Array()console.log('e: ', e.constructor); // Object()console.log('f: ', f.constructor); // Function()

原型

注意：__proto__连接的是实例与构造函数的原型对象之间，而不是实例与构造函数之间。

原型链

　　在JavaScript中，原型链是实现继承的主要方式。

　　JavaScript引擎在访问对象的属性时，会先在对象本身中查找，如果没有找到，则会去原型链中查找（但不会查找自身的prototype），如果找到，则返回值，如果整个原型链中都没有找到这个属性，则返回undefined。

var person = {  name: 'human'};var person1 = {  name: 'tg',  __proto__: person};var person2 = {  __proto__: person};console.log(person1.name);  // "tg"console.log(person2.name);  // "human"console.log(person1.id);  // undefined

原型对象 与 prototype

　　构造函数有一个prototype属性，指向实例对象的原型对象。通过同一个构造函数实例化的多个对象具有相同的原型对象。经常使用原型对象来实现继承。

function Foo(){};Foo.prototype.a = 1;var f1 = new Foo;var f2 = new Foo;console.log(Foo.prototype.a);//1console.log(f1.a);//1console.log(f2.a);//1

原型 与 实例

有两种方式来确定原型和实例之间的关系：

• 使用instanceof操作符

function Person(){}var person = new Person();console.log(person instanceof Object);  // trueconsole.log(person instanceof Person);  // true

• 使用isPrototypeOf()方法。

console.log(Object.prototype.isPrototypeOf(person));  // trueconsole.log(Person.prototype.isPrototypeOf(person));  // true