原型以及原型链

js中的原型和原型链浏览器

 

        当咱们使用构造函数时,每次实例化构造函数的时候,也就是用new改变函数中this的指向时,在函数中咱们有一些属性不可以彻底使用时,这些不使用的属性也会被建立出来,这样就会在咱们的计算机中无形的增长计算机的内存,因此有了咱们更加优化的节省计算机内存的方法,也就是原型。函数

每一个函数在建立的时候都会自带一个原型对象。好比:工具

 

 

var Fn = function () {    
    this.age = 18;    
    this.name = "jack";
}
Fn.prototype.name = "jim";
Object.prototype.name = "miss";
var f = new Fn();
var f1 = new Fn();
alert(f1.name);
alert(f.name);
post

 

这个时候f和f1会继承构造函数Fn中prototype属性中的name值;在构造函数中的值也同样。测试

当咱们在构造函数中也添加优化

 

this.name="tim"; this

这个时候咱们输出f1.name和f.name咱们获得会是tim,这个一结果是根据原型中的原型链而引起而来。说的通俗一点呢也就是咱们在查找一个值时,那么这个时候咱们就会从原型链的底层开始查找(也就是构造函数的属性中先),当自身不知足时就会沿着原型链往上查找,最终查找不到知足这个条件会获得一个undefined;    spa

解析:.net

 

1.你们不明白为何是将this写做是原型链中的底层,这里解释一下,在咱们的原型链中构造函数实例化的对象若是要调用构造函数中的原型会使用 f1.name这样去获得这个值,当咱们调用这个被构造函数实例化对象的时,其实这个对象的原型是构造函数的prototype原型属性,而构造函数又是咱们原型链中最底层的一个小的原型链,因此称为原型链的底层当自身知足这个条件时就会使用这个值,prototype

 

        下面就说一下原型链;原型链在原型中是很关键的,咱们在原型链中的不正确操做会直接影响原型值的得到。

 

        上述例子中的f,f1是被Fn构造函数实例化的对象,咱们的对象都有一个原型对象(__proto__),而这个__proto__指向的是建立这个对象的构造函数的原型属性(prototype)

        注意下面的介绍,才好看原型链的图

  1. constructor是构造函数prototype(原型属性中的属性),他指的是构造函数自己。

  2. __proto__指的是对象的原型对象,可是__proto__是一个非标准属性。

  3. prototype是构造函数的原型属性;也就是咱们常说的原型

  4. 咱们在设置prototype时只能给构造函数设置,对象上是不能够设置的,若是咱们想用对象
    来得到构造函数中的prototype中的值只能经过非标准属性(__proto__)来得到,可是不建议使用,只建议在测试中使用__proto__属性

        这是一个很是复杂的原型链,其中在原型链中最饱受争议的就是Object建立了Function,仍是Function建立了Object,咱们若是沿着原型链展开Function和Object会发现他们是无群无尽的。

        一张完整的原型链图来方便你们理解。

       原本打算给你们再添一张原型链的图方便你们理解的,但是添加不上去,若是你们有兴趣的话能够去下面这个网址中浏览http://blog.csdn.net/wcm369574584/article/details/51018363

 

 

 

 

 

       经过以上的介绍咱们能够获得如下结论:

  1. 每一个对象有一个constructor属性,指的是这个对象的构造函数。

  2. 当对象没有constructor这个属性时他经过__proto__来继承构造函数中的constructor的属性。

  3. 每一个函数都有prototype(原型属性);每一个对象有一个__proto__(原型对象)

  4. 函数都继承于Function函数,对象都继承于Object对象,

  5. 函数Function也是对象Object,Object也有本身的构造函数Function,因此Function和Object是互相创造的,
    这在原型中是一个没法解释的特例、就好像先有鸡仍是先有蛋。
     固然咱们查看原型链最好的方法就是在页面中查看,虽然数据比较庞大,稍微懂原型的人仍是能够看出来的。

     下面给你们介绍一下如何在网页中查看原型链,本身平时喜欢用谷歌浏览器,因此给你们介绍一下在谷歌中如何查看原型链,首先在本身的编译器中输入如上面的例子,打开调试工具

    点击+而后输入在原型链中的对象,好比f1,Fn获得的就是各自的原型链了

 

相关文章
相关标签/搜索