简单解析JavaScript中的__proto__属性


Posted in Javascript onMay 10, 2016

JavaScript是一个面向对象语音,即一切皆对象。

那么怎么生成对象?在Java的世界里,对象是由类(Class)实例出来的,通俗地说,就是将事物抽象成一个模具,用这个模具(类)生产出一个个具体的实物(对象)。

可是JS中没有类这个概念,有的是“原型”,对象是由原型衍生出来的。通俗地说,在JS的世界里,“原型”并不是一个模具,而是一个具体的实物(对象)。所有对象都是由另一个对象衍生出来的,而这个被衍生的对象就是所谓的“原型对象”。

在javascript中有三类对象,1用户创建的对象,2构造函数的对象,3原型对象

  • 用户创建的对象,一般意义上使用new语句显式构造的方法。
  • 构造函数的对象,普通的构造函数,即通过new调用生成普通对象的函数
  • 原型对象,构造函数prototype属性指向的对象。

这三个对象中每一个类都有一个属性-__proto__属性,它们指向该对象的原型,从任何对象沿用它开始遍历都可以追溯到Object.prototype。

构造函数都有prototype对象,它指向一个原型对象,通过该构造函数创建对象的时候,被创建的对象的__proto__属性将指向构造函数的prototype属性。

原型对象有一个constructor属性,该属性指向它对应的构造函数。

Talk is cheap, show me the code! 咱们来看看代码:

var obj = {};
console.log(obj);

简单解析JavaScript中的__proto__属性

咱们将__proto__展开看看:是一些默认方法。

简单解析JavaScript中的__proto__属性

你一定会发生这个__proto__对象中也有一个__proto__对象,正如我们刚才说的,每个对象都有一个__proto__属性指向它的原型对象。我们打印一下这个__proto__中的__proto__:

console.log(obj.__proto__.__proto__); //--> null

结果是null,说明已经到了顶层原型对象。obj是用大括号{}定义的,obj的原型对象自然是JS的顶层对象。

咱们再看一端代码,加强下理解:

var parent = {
  name : "parent"
};
var child = {
  name : "child",
  __proto__ : parent
};
var subChild = {
  name : "subChild",
  __proto__ : child
}
console.log(subChild);

简单解析JavaScript中的__proto__属性

  • subChild.__proto__ --> child
  • child.__proto__ --> parent
  • parent.__proto__ --> 顶层原型对象
Javascript 相关文章推荐
实例:用 JavaScript 来操作字符串(一些字符串函数)
Feb 15 Javascript
javascript 关闭IE6、IE7
Jun 01 Javascript
javascript自执行函数之伪命名空间封装法
Dec 25 Javascript
js 弹出菜单/窗口效果
Oct 30 Javascript
jQuery中prependTo()方法用法实例
Jan 08 Javascript
jQuery插件支持同一页面被多次调用
Feb 14 Javascript
基于javascript显示当前时间以及倒计时功能
Mar 18 Javascript
JS库particles.js创建超炫背景粒子插件(附源码下载)
Sep 13 Javascript
Vue 处理表单input单行文本框的实例代码
May 09 Javascript
layui使用form表单实现post请求页面跳转的方法
Sep 14 Javascript
layui.tree组件的使用以及搜索节点功能的实现
Sep 26 Javascript
jQuery实现简单QQ聊天框
Aug 27 jQuery
Web Uploader文件上传插件使用详解
May 10 #Javascript
详解原生JavaScript实现jQuery中AJAX处理的方法
May 10 #Javascript
JS上传组件FileUpload自定义模板的使用方法
May 10 #Javascript
使用jQuery处理AJAX请求的基础学习教程
May 10 #Javascript
javascript关于继承解析
May 10 #Javascript
JavaScript继承学习笔记【新手必看】
May 10 #Javascript
实例讲解使用原生JavaScript处理AJAX请求的方法
May 10 #Javascript
You might like
真正面向对象编程:PHP5.01发布
2006/10/09 PHP
MYSQL 小技巧 -- LAST_INSERT_ID
2009/11/24 PHP
php中jpgraph类库的使用介绍
2013/08/08 PHP
php日历制作代码分享
2014/01/20 PHP
CI框架装载器Loader.php源码分析
2014/11/04 PHP
PHP面向对象自动加载机制原理与用法分析
2016/10/14 PHP
PHP使用preg_split()分割特殊字符(元字符等)的方法分析
2017/02/04 PHP
因str_replace导致的注入问题总结
2019/08/08 PHP
js实现屏蔽默认快捷键调用自定义事件示例
2013/06/18 Javascript
jQuery 获取和设置select下拉框的值实现代码
2013/11/08 Javascript
JavaScript对IE操作的经典代码(推荐)
2014/03/10 Javascript
我的Node.js学习之路(三)--node.js作用、回调、同步和异步代码 以及事件循环
2014/07/06 Javascript
浅谈node.js中async异步编程
2015/10/22 Javascript
简要了解jQuery移动web开发的响应式布局设计
2015/12/04 Javascript
聊一聊Vue.js过渡效果
2016/09/07 Javascript
基于jQuery实现的幻灯图片切换
2016/12/02 Javascript
详解使用Visual Studio Code对Node.js进行断点调试
2017/09/14 Javascript
NodeJs crypto加密制作token的实现代码
2019/11/15 NodeJs
VUE子组件向父组件传值详解(含传多值及添加额外参数场景)
2020/09/01 Javascript
python转换摩斯密码示例
2014/02/16 Python
python实现中文分词FMM算法实例
2015/07/10 Python
Python程序中设置HTTP代理
2016/11/06 Python
详解Python计算机视觉 图像扭曲(仿射扭曲)
2019/03/27 Python
Python使用pyserial进行串口通信的实例
2019/07/02 Python
python opencv鼠标事件实现画框圈定目标获取坐标信息
2020/04/18 Python
使用python画出逻辑斯蒂映射(logistic map)中的分叉图案例
2020/12/11 Python
CSS3属性使网站设计增强同时不消弱可用性
2009/08/29 HTML / CSS
突破canvas语法限制 让他支持链式语法
2012/12/24 HTML / CSS
美国便宜的横幅和标志印刷在线:Best of Signs
2019/05/29 全球购物
组工干部演讲稿
2014/09/02 职场文书
祖国在我心中演讲稿450字
2014/09/05 职场文书
工商局所长四风自我剖析及整改措施
2014/10/26 职场文书
文明倡议书
2015/01/19 职场文书
2015年社区中秋节活动总结
2015/03/23 职场文书
格列佛游记读书笔记
2015/06/30 职场文书
Python使用Beautiful Soup(BS4)库解析HTML和XML
2022/06/05 Python