JavaScript原型和原型链的理解

原型

原型对象 prototype 属性
我们创建的每一个函数都有一个 prototype 属性，这个属性是一个指针，指向一个对象。这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法，简单来说，该函数实例化的所有对象的__proto__的属性指向这个对象，它是该函数所有实例化对象的原型
隐式原型:
每一个对象中都有一个属性叫_ proto_它指向了创建这个对象的构造器的原型对象。
constructor 属性
当函数创建，prototype 属性指向一个原型对象时，在默认情况下，这个原型对象将会获得一个 constructor 属性，这个属性是一个指针，指向 prototype 所在的函数对象。

原型链

原型链:是一一个对象属性的查找机制，arr1.toString0,
先在自己私有属性中找，如果找不到就沿着_ proto_ 去原型对象中找，如果还找不到，继续沿着_ proto_ 去它的原型对象中的原型对象中找，直到找到Object的原型对象(Object原型对象中的_ proto_指向了null)，如果还找不到，结果就是und。
可以对比作用域链
作用域链:是一个EC中数据的查找机制，先在自己EC中找数据，没有就去父函数所对应的上下文中找，如果还找不到，就去父函数的父函数的EC中找，直到找到EC(G), 如果还找不到，就报错。

isPrototypeOf()
虽然我们在脚本中没有办法访问到[[Prototype]]属性，但是我们可以通过 isPrototypeOf 方法来确定对象之间是否存在这种关系。

isPrototypeOf() 方法用于测试一个对象是否存在于另一个对象的原型链上。

console.log(Person.prototype.isPrototypeOf(student)); // true

练习题

fn.portotype 改变函数对象

Fn.portotype = new Fn创建了新的原型对象



本题涉及到this指向 var变量声明提升 ，运算符优先级，原型等知识点

Foo.getName();     
//查看Foo的静态属性自调用，自然就是2
//-------------------------------------第二题-------------------------------------
getName(); 
//提升后的代码变量声明的getName，将之前函数声明的getName覆盖，结果是4
//-------------------------------------第三题-------------------------------------   
Foo().getName(); 
//提升后代码，根据下图优先级点“.”优先级等于函数自调用的优先级，从左至右执行--这里为什么说优先级，为一会铺垫
//Foo()执行里面函数时会将getName重新赋值，它先找var变量声明getName，
//Foo作用域内没有，此时会向外找，此时是getName()即为this.getName()也就是window.getName()
//为4,然后将它重新赋值为1，所以执行1
//-------------------------------------第四题-------------------------------------
getName(); 
//此时的getName在上一步已经覆盖赋值，所以执行结果为1
//-------------------------------------第五题-------------------------------------
new Foo.getName();  
//根据下图 new... 小于 点“.” 所以先执行点“.”
//再看new...(...)等于函数自调用优先级  结果也是2
//-------------------------------------第六题-------------------------------------
new Foo().getName(); 
//根据下图 new...(...)优先级与点“.”、函数自调用优先级相同所以从左至右执行 ((new Foo()).getName)()
//new Foo()实例化了构造函数Foo 返回this为自身的这个构造函数，然而自身并没有getName这个属性
//此时会找原型prototype，从而输出3----------------此时考察原型，实例，构造函数的关系
//-------------------------------------第七题-------------------------------------
new new Foo().getName();
//根据下图 new... 小于new...(...)小于点“.”小于函数自调用，所以先执行上题的结果后，输出仍然是3