美文网首页
javascript的隐式原型

javascript的隐式原型

作者: junup | 来源:发表于2017-12-08 18:05 被阅读0次

每个函数function都有一个prototype,即原型。这里再加一句话——每个对象都有一个proto,可成为隐式原型。

$('.bank-title span').click(function(){
          var index = $(this).index();
            $(this).addClass('cur').siblings('span').removeClass('cur')
            $('.bank-content ul').eq(index).fadeIn(200).siblings('ul').hide(0)
        })

这个proto是一个隐藏的属性,javascript不希望开发者用到这个属性值,有的低版本浏览器甚至不支持这个属性值。所以你在Visual Studio 2012这样很高级很智能的编辑器中,都不会有proto的智能提示,但是你不用管它,直接写出来就是了。

$('.bank-title span').click(function(){
          var index = $(this).index();
            $(this).addClass('cur').siblings('span').removeClass('cur')
            $('.bank-content ul').eq(index).fadeIn(200).siblings('ul').hide(0)
        })

上面截图看来,obj.proto和Object.prototype的属性一样!这么巧!

答案就是一样。

obj这个对象本质上是被Object函数创建的,因此obj.proto=== Object.prototype。我们可以用一个图来表示。

$('.bank-title span').click(function(){
          var index = $(this).index();
            $(this).addClass('cur').siblings('span').removeClass('cur')
            $('.bank-content ul').eq(index).fadeIn(200).siblings('ul').hide(0)
        })

即,每个对象都有一个proto属性,指向创建该对象的函数的prototype。

那么上图中的“Object prototype”也是一个对象,它的proto指向哪里?

好问题!

在说明“Object prototype”之前,先说一下自定义函数的prototype。自定义函数的prototype本质上就是和 var obj = {} 是一样的,都是被Object创建,所以它的proto指向的就是Object.prototype。

但是Object.prototype确实一个特例——它的proto指向的是null,切记切记!

$('.bank-title span').click(function(){
          var index = $(this).index();
            $(this).addClass('cur').siblings('span').removeClass('cur')
            $('.bank-content ul').eq(index).fadeIn(200).siblings('ul').hide(0)
        })

还有——函数也是一种对象,函数也有proto吗?

又一个好问题!——当然有。

函数也不是从石头缝里蹦出来的,函数也是被创建出来的。谁创建了函数呢?——Function——注意这个大写的“F”。

且看如下代码。

以上代码中,第一种方式是比较传统的函数创建方式,第二种是用new Functoin创建。

首先根本不推荐用第二种方式。

这里只是向大家演示,函数是被Function创建的。

好了,根据上面说的一句话——对象的proto指向的是创建它的函数的prototype,就会出现:Object.proto === Function.prototype。用一个图来表示。

$('.bank-title span').click(function(){
          var index = $(this).index();
            $(this).addClass('cur').siblings('span').removeClass('cur')
            $('.bank-content ul').eq(index).fadeIn(200).siblings('ul').hide(0)
        })

上图中,很明显的标出了:自定义函数Foo.proto指向Function.prototype,Object.proto指向Function.prototype,唉,怎么还有一个……Function.proto指向Function.prototype?这不成了循环引用了?

对!是一个环形结构。

其实稍微想一下就明白了。Function也是一个函数,函数是一种对象,也有proto属性。既然是函数,那么它一定是被Function创建。所以——Function是被自身创建的。所以它的proto指向了自身的Prototype。

篇幅不少了,估计也都看烦了。快结束了。

最后一个问题:Function.prototype指向的对象,它的proto是不是也指向Object.prototype?

答案是肯定的。因为Function.prototype指向的对象也是一个普通的被Object创建的对象,所以也遵循基本的规则。

OK 本节结束,是不是很乱?

乱很正常。那这一节就让它先乱着,下一节我们将请另一个老朋友来帮忙,把它理清楚。这位老朋友就是——instanceof。

相关文章

  • 4.4 JavaScript

    4.4.1. 原型链 4.4.1.1. 显式原型和隐式原型   JavaScript的原型分为显式原型(expli...

  • javascript的隐式原型

    每个函数function都有一个prototype,即原型。这里再加一句话——每个对象都有一个proto,可成为隐...

  • 显式原型与隐式原型

    显式原型与隐式原型 prototype: 显式原型 __proto__: 隐式原型 所有函数都有 prototyp...

  • js原型和闭包(4)——隐式原型

    深入理解javascript原型和闭包(4)——隐式原型 上节已经提到,每个函数function都有一个proto...

  • JavaScript之图解原型链

    根据自己手绘的简图更进一步理解JavaScript的原型链机制 原型与隐式原型 概念 原型:所有的 函数 都有一个...

  • 原型原型链,属性的扩展

    原型和原型链 原型 所有的变量都有一个隐式原型proto属性(错) 所有的对象都有一个隐式原型proto属性(对)...

  • js的原型对象&原型链&js的继承

    原型对象 & 原型链 原型对象分2种:显式原型和隐式原型。 显式原型就是我们常用的prototype属性,是函数的...

  • 有关JS中的原型

    原型的关系 每个class 都有显式原型prototype 每个实例都有隐式原型 __ proto __ 实例...

  • 从头到尾通俗理解原型链

    prototype 和 [[proto]] 什么关系? prototype:显式原型[[proto]]: 隐式原型...

  • 原型链梳理

    参考资料 汤姆大叔的javascript核心 知乎问答 定义 __proto__(隐式原型)任何对象都一个内置属性...

网友评论

      本文标题:javascript的隐式原型

      本文链接:https://www.haomeiwen.com/subject/rutyixtx.html