关于JavaScript 原型链的一点个人理解


Posted in Javascript onJuly 31, 2016

JavaScript借鉴了许多语言的特点;例如语法类Java、函数借鉴Scheme、原型继承借鉴自Self、正则表达式借鉴于Perl。(DC Javascript:语言精粹)。

     首先,每个JS是一门基于原型继承的面向对象的语言。里面数组是对象、函数是对象、“对象”当然还是对象。而且每个对象都有一个internal slot[[prototype]],这才是原型链连接起来的关键。诚然,我们可以为一个对象设置prototype property,但这又怎么样呢,这只是表象;后面暗藏杀机。

    好,那我可以用isPrototypeOf()来检验某个对象是不是另一个对象的原型;然而这也是基于[[prototype]]链的。

   举个例子:

//建立一个函数

    function foo () {} 

    //修改函数的prototype property  

    foo.prototype = {

         name : "foo.prototype" 
              };
     //建立一个实例 

      var a = new foo();

    //重写 a 的默认原型,本应该是foo.prototype.
       a.prototype = {
         name : "a.prototype"
      };

    下面的问题是foo.prototype是不是a的原型呢?!

    这要分开来看:一方面a.prototype确实是{ name : "a.prototype"};但是,foo.prototype.isPrototypeOf(a)结果是true.

    下面来看一看具体的关系:(使用--->表示不明显的[[prototype]]链,---表示prototype property关系)

        Function ---> Function.prototype--->Object.prototype

                          Function.prototype <--- foo---foo.prototype ------>Object.prototype 。

    另外,Number、Boolean、String等的[[protptype]]仍然是Fuction.prototype对象。Function.prototype对象为“function”,内部不含[[construct]]故而不可做构造函数用;实际上Function.prototype类似:function () {}。“function”类型除了[[prototype]]internal slot外,还有prototype属性。每个函数总是相伴有一个prototype对象:this.prototype = {constructor:this}(一个普通对象)。这个普通对象的[[prototype]]连接到Object.prototype.

   那构造函数建立的实例对象的[[prototype]]是Object.prototype吗?

          该实例的[[prototype]]是由构造函数的prototype property初始化的,注意不是函数的[[prototype]].所以如果是由Object这个函数构造的对象,那么就确实是.

  Object是函数,它的prototype是大名鼎鼎的Object.prototype(有点废话的意思),但是它的[[prototype]]指向Function.prototype.请看下面:

                                                          Object----->Function.prototype------>Object.prototype.

 如何改变这个[[prototype]]链呢?

     可以采用var a = Object.create(obj)的形式,或Object.setPrototypeOf(objA,objB)的形式。我想例子就不用举了,因为关系很简单;况且我只举得出一些蹩脚的例子。没有意义。

 最后一个问题,行为委托是基于[[prototype]]链吗?

      是的,也是这样。

Javascript 相关文章推荐
javascript 实现键盘上下左右功能的小例子
Sep 15 Javascript
jQuery对象和DOM对象之间相互转换的方法介绍
Feb 28 Javascript
jQuery插件slider实现拖动滑块选取价格范围
Apr 30 Javascript
JS实现当前页居中分页效果的方法
Jun 18 Javascript
jQuery过滤HTML标签并高亮显示关键字的方法
Aug 07 Javascript
jquery.mousewheel实现整屏翻屏效果
Aug 30 Javascript
jquery trigger实现联动的方法
Feb 29 Javascript
Bootstrap一款超好用的前端框架
Sep 25 Javascript
JavaScript 中使用 Generator的方法
Dec 29 Javascript
浅谈高大上的微信小程序中渲染html内容—技术分享
Oct 25 Javascript
JS实现计算小于非负数n的素数的数量算法示例
Feb 26 Javascript
详解js动态获取浏览器或页面等容器的宽高
Mar 13 Javascript
jquery实现界面无刷新加载登陆注册
Jul 30 #Javascript
AngularJS ng-change 指令的详解及简单实例
Jul 30 #Javascript
Javascript中级语法快速入手
Jul 30 #Javascript
AngularJS ng-blur 指令详解及简单实例
Jul 30 #Javascript
AngularJS ng-bind-template 指令详解
Jul 30 #Javascript
AngularJS ng-bind-html 指令详解及实例代码
Jul 30 #Javascript
AngularJS ng-bind 指令简单实现
Jul 30 #Javascript
You might like
简单的页面缓冲技术
2006/10/09 PHP
本地机apache配置基于域名的虚拟主机详解
2013/08/10 PHP
php数组键名技巧小结
2015/02/17 PHP
thinkphp5.1框架容器与依赖注入实例分析
2019/07/23 PHP
javascript的trim,ltrim,rtrim自定义函数
2008/09/21 Javascript
jquery的Tooltip插件 qtip使用详细说明
2010/09/08 Javascript
让AJAX不依赖后端接口实现方案
2012/12/03 Javascript
同域jQuery(跨)iframe操作DOM(实例讲解)
2013/12/19 Javascript
JS脚本defer的作用示例介绍
2014/01/02 Javascript
EasyUI的doCellTip实现鼠标放到单元格上提示单元格内容
2016/08/24 Javascript
jQuery为动态生成的select元素添加事件的方法
2016/08/29 Javascript
EasyUi 打开对话框后控件赋值及赋值后不显示的问题解决办法
2017/01/19 Javascript
jQuery.Form上传文件操作
2017/02/05 Javascript
gulp加批处理(.bat)实现ng多应用一键自动化构建
2017/02/16 Javascript
JS中关于正则的巧妙操作
2017/08/31 Javascript
jQuery插件artDialog.js使用与关闭方法示例
2017/10/09 jQuery
swiper移动端轮播插件(触碰图片之后停止轮播)
2017/12/28 Javascript
JS和Canvas实现图片的预览压缩和上传功能
2018/03/30 Javascript
jQuery实现点击自身以外区域关闭弹出层功能完整示例【改进版】
2018/07/31 jQuery
vue解决一个方法同时发送多个请求的问题
2018/09/25 Javascript
微信小程序下拉框功能的实例代码
2018/11/06 Javascript
vue里的data要用return返回的原因浅析
2019/05/28 Javascript
[47:43]完美世界DOTA2联赛PWL S3 Magama vs GXR 第二场 12.19
2020/12/24 DOTA
pycharm运行出现ImportError:No module named的解决方法
2018/10/13 Python
Matplotlib animation模块实现动态图
2021/02/25 Python
就业推荐表自我鉴定
2014/03/21 职场文书
教育专业毕业生推荐信
2014/07/10 职场文书
离婚协议书怎么写2014
2014/09/30 职场文书
电子银行业务授权委托书
2014/10/10 职场文书
房地产销售经理岗位职责
2015/02/02 职场文书
李清照的诗词赏析(20首)
2019/08/22 职场文书
浅谈MySQL next-key lock 加锁范围
2021/06/07 MySQL
Pyhton爬虫知识之正则表达式详解
2022/04/01 Python
Java 使用类型为Object的变量指向任意类型的对象
2022/04/13 Java/Android
MySQL 语句执行顺序举例解析
2022/06/05 MySQL
win10滚动条自动往上跑怎么办?win10滚动条自动往上跑的解决方法
2022/08/05 数码科技