js中,Function的本质是什么?
Object的本质又是什么?
js中有几条原型链?

javascript的语言基于原型链,而实际上js的有两条原型链。开发者主要用到的是图中的红色原型链,如给Array.prototype.xxx=yyy,那么就可以[...].xxx,数组实例对象就继承了其构造函数原型对象中的数据,当然实践一般不会给修改Array这类构造函数的原型对象,最多的就是自定义构造函数,然后给自定义的构造函数定义原型对象,那么这个构造函数的所有实例对象也就都继承了原型对象中的数据。这就是图中红色原型链的所表示的。

那么Array.prototype和自定义构造函数function f(){}的prototype的原型对象是从哪里来的,是谁创造了它?

诸如Array.prototype.xxx=yyy,这实际上就是引用了Array的原型对象prototype而已,也就是它的原型对象就已经存在了,然后才让其能够被引用到。

包括Array.prototype,还是String.prototype,还是Object.prototype,还是Function.prototype,还是自定义构造函数function f(){}的prototype,它们都不是开发者创建的,而是Function构造函数在创建其他构造函数时,用Object()创建的。

可以说Function构造函数是javascript世界中的万物之主,像盘古开天辟地创建了javascript的语言世界和运行机制。而OBject的本质就是用于创建原型对象。

Function构造函数内部有一个this.prototype=new Object(),当Function造物时,就同时通过这句this.prototype=new Object(),给这个物赋予了灵魂。而Object在javascript中的本质也就在于此,作为Function手中的魂灯,赋予其创建的物体灵魂,也就是给予它原型对象,让它能够通过原型对象,能够从上面继承和吸收能量。

Function构造函数,创建了Array构造函数,同时通过new Object()给其创建了prototype对象,因此有Array.prototype。然后[1,2,3]就是由Array构造函数创建,因此[1,2,3]数组实例对象,继承了Array构造函数中的数据,同时继承了Array.prototype中的数据。

Array.prototype原型对象是由this.prototyoe=new Object()创建的,因此Array.prototype原型对象的构造函数是Object构造函数(也可以是称为对象),Array.prototype原型对象也就继承了其生父Object构造函数中的数据,也同时继承了Object.prototype原型对象的数据。

因此,你可以看到,toString()这个方法追根溯源,实际上是Object.prototype.toString,在Function创建Array的时候,Object就跟着创建了Array.prototype,它就继承了Object和Object.prototype中的数据,[1,2,3]数组对象由Array创建,因此[1,2,3]也就继承了Array、Array.prototype、Object、Object.prototype中的数据,因此最终才可以调用[1,2,3].toString()。

对于String、Boolean等构造函数,还是自定义构造函数function f(){...}也都是这样。

function f(){...},看上去是你写了这个普通的构造函数,实际上这个普通的函数是Function创建的,你写的这个f函数,由于是Function()实例化出来的(也就是函数的f的构造函数就是Function),那么普通函数f作为Function构造函数的实例对象,那么普通函数f也就会继承Function构造函数和Function.prototype中的数据。

说来诡异的是,也是Function自己创建了自己,正是在在创建自己的时候,通过this.prototype=new Object()给自己也创建了原型对象,就是图中蓝色的原型对象,这个原型对象由于是new Object实例化的,因此这个蓝色的原型对象,也就继承了Object和Object.prototype原型对象中的数据,这样说来,Object的原型对象是原型链条中的最顶层的一个对象,然后原型链往下揪分裂成了两条。

Function.prototype原型对象虽然继承了Object.prototype中的数据,但是它自己还扩展了自己专有的属性和方法,分别是name、length、call()、apply()、bind()这五个,然后由于普通函数f就是由Funciton创建出来的,因此这个普通函数也就继承了Function和Function.prototype中的数据,因此你才可以使用f.apply()还是f.bind(this),也因此才可以使用Array.apply(),这就是图中的第二条蓝色的原型链。当然这条原型链中的数据,会被Array还是String还是Boolean这类构造函数继承,但是不会被[1,2,3]这些继承,他们不处于同一个链条上。

虽然Function创建了它自己,也创建了Object,但到底它是先创建自己还是先创建Object就无从得知了。如果Function先创建了自己,那么在它创建自己的时候,还在使用this.prototype=new Object()给自己创建原型对象时,这个Object又是哪里来的,难道Object就已经先存在了?如果Object先于Function存在了,但Funciton都还没有存在,它怎么去创建Object?这到底是鸡生蛋还是蛋生鸡无从得知,这也反映了javascript语言底层机制就是混乱的。

也许这一切都很绕,但是只有理解了Function与Object,才能更清晰高屋建瓴的理解原本繁芜繁杂和混乱的javascript。

你是否理解js的Object与Function与原型链相关推荐

  1. 【深入理解JS核心技术】2. 什么是原型链?

    原型链是用于在现有对象的基础上构建新类型的对象.它类似于基于类的语言中的继承. 对象实例的原型可以通过 Obeject.getPrototypeOf(object) 或 proto 属性获得,而构造函 ...

  2. JS中prototype、__proto__以及原型链

    1.对象的三角恋关系 1.每个"构造函数"中都有一个默认的属性, 叫做prototype prototype属性保存着一个对象, 这个 对象 称之为"原型对象" ...

  3. js 中对象--对象结构(原型链基础解析)

    对于本篇对于如何自定义对象.和对象相关的属性操作不了解的话,可以查我对这两篇博客.了解这两篇可以更容易理解本篇文章 用构造函数创建了一个对象 obj对象的本身创建了两个属性  x=1   ,y=2 对 ...

  4. 聊聊js最无聊的技术点-原型链

    写在前面 js 作为一种动态语言,他的强大之处已经不用我来废话了,那么如果要学习js,你可以学习一些基础入门的简单的,也就是我们常用的一些操作数组啊.格式转化啊等,这些为什么简单呢?其实本质不是它多简 ...

  5. js系列教程13-原型、原型链、作用链、闭包全解

    全栈工程师开发手册 (作者:栾鹏) 快捷链接: js系列教程1-数组操作全解 js系列教程2-对象和属性全解 js系列教程3-字符串和正则全解 js系列教程4-函数与参数全解 js系列教程5-容器和算 ...

  6. 简单粗暴地理解js原型链–js面向对象编程

    简单粗暴地理解js原型链–js面向对象编程 作者:茄果 链接:http://www.cnblogs.com/qieguo/archive/2016/05/03/5451626.html 原型链理解起来 ...

  7. js 添加属性_轻松理解JS中的面向对象,顺便搞懂prototype和__proto__

    这篇文章主要讲一下JS中面向对象以及 __proto__,ptototype和construcator,这几个概念都是相关的,所以一起讲了. 在讲这个之前我们先来说说类,了解面向对象的朋友应该都知道, ...

  8. 简单粗暴地理解js原型链--js面向对象编程

    原型链理解起来有点绕了,网上资料也是很多,每次晚上睡不着的时候总喜欢在网上找点原型链和闭包的文章看,效果极好. 不要纠结于那一堆术语了,那除了让你脑筋拧成麻花,真的不能帮你什么.简单粗暴点看原型链吧, ...

  9. 详细理解JS的三座大山

    如图所示,JS的三座大山: 同步.异步 作用域.闭包 原型.原型链 1. 同步.异步 JavaScript执行机制,重点有两点: JavaScript是一门单线程语言 Event Loop(事件循环) ...

最新文章

  1. 智源成立面向可持续发展的人工智能智库并发布公益研究计划
  2. svn强制要求提交注释
  3. [003]容器和动态数组的使用
  4. python 文件遍历
  5. 初学必读:61条面向对象设计的经验原则
  6. [vue] DOM渲染在哪个周期中就已经完成了?
  7. dos 改某个目录下所有文件的时间_go语言入门学习笔记(2)-DOS操作及go语言变量学习...
  8. Linux下安装配置Jenkins
  9. 高性能MySQL(第二版)第三章 架构优化和索引(上)——读书笔记
  10. ubuntu 下可以尝试还不错的屏幕截图工具: flameshot
  11. java FTP获取文件夹中所有文件
  12. linux网易云打不开的问题
  13. besiege机器人_《围攻》双脚机器人制作图文教程 双脚机器人怎么制作
  14. CC1310直接操作寄存器编程
  15. win7家庭版计算机添加用户,win7家庭版怎样设置来宾用户权限
  16. 基于u-net,cv2以及cnn的中文车牌定位,矫正和端到端识别软件
  17. 最好听的男孩、女孩名字
  18. Pikachu靶场暴力破解通关
  19. Kafka之Controller(Broker的领导者)
  20. 使用Kong和Konga管理微服务和API

热门文章

  1. java 控制线程的顺序_【Java多线程系列四】控制线程执行顺序
  2. php资源文件html,nginx 同一域名下分目录配置显示php,html,资源文件
  3. 页面 动态显示cmd执行结果_把代码执行演示嵌在你的PPT中
  4. Android内部类监听和多对象监听方法
  5. 小明用计算机算出58十35,人教版三年级数学下册第三四单元测试卷.docx
  6. 数字ab写成c语言表达式,《c语言程序设计》复习题.pdf
  7. pyjion python3.6_[新闻] CPython / 微软 Pyjion / IBM Python+OMR
  8. clickhouse 副本ReplicateMergeTree实现原理
  9. VB中FSO的调用的两种方法
  10. 科大讯飞回应“同传造假”:承认转写人类同传,沟通不足造成误解