`
oojdon
  • 浏览: 39563 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

JavaScript的原型思考

 
阅读更多

原型:对象的共性描述?回归哲学?


所有对象存在一个到达它原型的链接,原型是寄生在函数上的,当函数被new,则建立对象到原型的链接。对象和构造它的函数没有关系,和构造函数有关系的是原型。


如果函数不被new,则原型无用,或者没有原型,只有当函数被放到new的场景,函数则被挂上了一个原型,这个原型包含一个到这个函数的链接,这个原型也是对象,由Object构造出来,那么这个原型对象的原型就是Object.prototype的值。这个原型应该有两个属性:


1,constructor,指向这个原型所在的构造函数

2,_proto_,指向创建这个对象的构造函数的prototype值,即Object.prototype


所以原型出现在构造对象的场景,参与这个场景的有构造逻辑对象(函数),被构造空白对象(对象原生胚胎),对新生儿对象设置共性的对象(原型),三个角色合理造物。


造物过程是:


1,在某个构造函数F上用new运算符,new F();告诉引擎类F要造物了

2,引擎用Object构造一个对象放到F.prototype上,并把这个对象设置一个属性constructor指向这个F

3,引擎又用Object构造一个对象,把这个对象的_proto_属性指向F.prototype,再把这个对象作为this去调用F,执行F中的构造逻辑。


这个过程,其实Object也在构造对象,所以这个过程在Object造对象时也适用,最终由F构造出来的对象在执行F之前,它的_proto_已经指向Object.prototype了,Object.prototype上的属性和方法可被所有对象访问,执行F之后,F中做的所有事情都是把数据写到了对象之上,而写不到原型上。


重点或者问题:


1,Object.prototype本身也是对象,谁创建了它?

应该是引擎?还是Object?,我觉得是引擎,引擎搞了一个对象,设置一个constructor指向Object,_proto为空,然后再这个对象上放置toString,valueOf等属性。


如果我们不思考JavaScript的继承,那么一切都非常简单,任何一个函数携带的原型对象都是一个空对象,这个空对象由Object函数创建。


 写道
详解如下:

new Object()出来的对象A

Object.prototype = [引擎创建的对象] constructor 指向Object, _proto_为空,被引擎设置toString,valueOf等属性。
A对象的_proto_指向Object.prototype


new String出来的对象B

String.prototype = [由Object构造出来的对象] constructor 指向String, _proto_指向Object.prototype。
B对象的_proto_指向String.prototype


任何一个函数F
new F出来的对象X
F.原型是由Object创建出来的对象,这个对象的constructor指向F,_proto指向Object.protype

 



可以看出顶端是Object.prototype,其他全部平行

要改变这个结构只能在F.prototype这里替换为为其他对象,而不是Object构造出来的对象,这样就可形成一条条长长的原型链条,这就是继承。


2,函数本身也是对象,函数的_proto_指向谁?

按照上面的推理,函数的_proto_应该指向创建函数对象的那个构造函数的原型,晕了吗?

即Function函数的原型,Function函数本身也是对象,它的_proto_呢,这里它指向了自己的prototype。


如下图:



<script type="text/javascript">

    alert(Object.prototype.__proto__ == null);  //true
    alert(typeof Object.prototype.toString);//function
    alert(Object.prototype.constructor == Object);//true
    alert(Object.__proto__ == Function.prototype);//true
    alert(Function.prototype.__proto__ == Object.prototype);//true
    alert(Function.__proto__ == Function.prototype);//true

</script>

 


总结:

在JavaScript中创建对象或者继承,只要瞄准函数携带的那个对象做手脚即可,改变它就可以改变原始的继承结构,但是那个对象虽然纯洁但是它指向了它寄生的函数,所以改变它之后需要修改constructor让它指回来。

函数本身也是对象,它由prototype这个链接到达携带的用于创建对象的原型和_proto_链接到达自己的原型。

  • 大小: 407.6 KB
分享到:
评论

相关推荐

    js软件界面原型设计.ppt

    js软件界面原型设计 第2章 软件界面原型设计 思考: 软件原型设计的重要性; 如何设计Web应用程序原型 ...界面原型在需求阶段是与用户交流的工具;...Web应用的界面原型需要使用Html、JavaScript设计一个完整的网站

    javascript 设计模式与开发实践

    1、需要对原型链和闭包有一定的基础 2、案例比较经典并且通熟易懂,讲解特别清晰 3、知识点的归纳总结也比较突出重点,方便二次学习以及做笔记 字体清晰不模糊,看起来舒服。 算法导论 第三版 中文版 清晰 PDF,...

    javaScript函数式编程

    9.2.1 修改核心原型175 9.2.2 类层次结构176 9.2.3 改变层级结构179 9.2.4 用Mixin扁平化层级结构180 9.2.5 通过Mixin扩展新的语义185 9.2.6 通过Mixin混合出新的类型187 9.2.7 方法是低级别操作188 9.3.call(...

    JonasJavascript2021:完整JavaScript课程2021

    现代OOP:类,构造函数,原型继承,封装等。 异步JavaScript:事件循环,承诺,异步/等待,AJAX调用和API 2020年及以后的现代工具:NPM,Parcel,Babel和ES6模块 如何像开发人员一样思考和工作:问题解决,研究,...

    关于JavaScript中原型继承中的一点思考

    JS中原型的概念不想多说,这里只是探讨一下修改父类原型属性与覆盖父类原型中属性的区别,防止以后出问题

    js-cheatsheet:javascript入门指南

    Javascript是“具有无阻塞事件循环的高级单线程,垃圾回收,解释(或及时编译),基于原型的多范式动态语言” 多元范式是什么意思? 它是一种基于一些基本的定义原则来思考软件构造的方式。 示例:函数式编程,...

    JavaScript高级教程

    第 1 章 JavaScript 是什么...............................................1 3 1.1 历史简述..............................................1 1.2 JavaScript 实现................................................

    Javascript实现图片导航

    可以使用jquery去实现,但容易陷入怎么做的思维中,如果自己手写的话,就可以先思考做什么,然后再思考怎么做。(当然这里做什么指原型已确定的)我们要做一个图片导航,一屏显示5张图片,用户能点“上一张”/“下...

    prototype-speed-test

    原型速度测试进行原型制作,还是不进行原型制作原型vs闭包是面向对象Javascript的一个非常有趣的外观。 我将自己描述为一个中级JavaScript开发人员,并且一直在尝试使用这种可爱的语言来学习尽可能多的东西。 我很快...

    thinkful-deployment-ui:思考网

    #Thinkful 部署 UI - 前端原型版本 1 使用说明来自: ###Install with Bower 您还可以使用 Bower 安装和管理 Bootstrap 的 Less、CSS、JavaScript 和字体: $ bower install bootstrap ###编译 CSS 和 ...

    csf:组件故事格式是基于JavaScript ES6模块的UI组件示例的开放标准

    有用于开发,测试,设计和原型制作的面向组件的新工具。 这些工具用于创建和使用组件和组件示例(也称为故事)。 但是每种工具都有其专有的格式,因为还没有一种简单的,与平台无关的方式来表达组件示例。“故事”...

    【卷一/共两卷】AJAX实战pdf高清版90M

    第一部分 重新思考Web应用 第1章 一种新的Web设计方法 1.1 为什么需要Ajax富客户端? 1.1.1 比较用户体验 1.1.2 网络延迟 1.1.3 异步交互 1.1.4 独占或瞬态的使用模式 1.1.5 忘掉Web 1.2 Aiax的四个基本原则 1.2.1 ...

    老生常谈 关于JavaScript的类的继承

    今天又重新思考了一下,感觉这是一个思维探索演进的结果。 继承,即复用。 如果抛开继承的固有思想,让b复用a的成员,最简单粗暴的做法, b=a; 那么,问题来了: 对b的任何改动,就是对a的改动(同一个object嘛)。 好吧...

    最新Python3.5零基础+高级+完整项目(28周全)培训视频学习资料

    JavaScript面向对象及原型 Dom选择器以及内容文本操作 Dom样式操作 Dom属性及创建标签 Dom提交表单及其他 Dom事件操作 Dom事件操作补充 Dom绑定时间的另外一种方式 JavaScript 词法分析解析 前端学习方法分享 ...

    Function[removed]从书中

    JavaScript 对象,即使减去原型机制,也是关联数据建模的理想工具,其中命名值可以被构造为形成更高级别的数据模型,以统一的方式访问。 使用函数式编程模拟 SQL 行为非常容易。 它还有助于轻松编写数据转换作业。...

    ionic-social-network:在 Ionic 框架中实现的科学社交网络原型

    一款帮助人们像科学家一样思考时事的移动应用程序。 定义现代科学话语的问题 我们传统的讲座和问题集系统给今天的大多数大学毕业生留下了一种“实证主义”的科学话语和教育方法,它将科学传播定位为从专家到外行的...

    I99IZ

    直到我们的手变脏我们才意识到的事情开始思考之前在列出一些可能的方法之前,了解使用了多少原型(对点1到3的使用进行加权)以及未使用的原型将非常有用。 拥有清除#6的资源也很重要因此,第一个问题是: 鉴于我们...

    CookieStand:三文鱼饼干项目-实验06-DeltaV-第2周

    通过js渲染表,构造函数和原型 作者:让·麦克马洪(Jean McMahon) 链接和资源*提交公关 您用作参考的任何链接思考和评论请考虑在此处包括日常日记和提交问题的答案,这也是反思使用和学习的工具和资源的好地方 ...

    谷歌师兄的leetcode刷题笔记-online_game:在线游戏。包括音乐

    Javascript 游戏! 书名: Beat兄弟 作者: Michael Vello Sartin-Tarm(感谢 Christopher Aberger 帮助创作) 描述:一个与音频同步的 2D-3D 组合游戏! 正在进行中.. 这是 ~ 0.05 版。 运动:方向键移动和跳跃! #...

    js中对象与对象创建方法的各种方法

    对应到js,闭包,原型,函数,对象等是需要花费大功夫思考、理解的。 这一次我们来说一说在JavaScript中经常会用到的一个复杂基本类型,对象,先从对象的属性讲起,再讲对象的创建方法,基本涵盖了创建对象的各种...

Global site tag (gtag.js) - Google Analytics