简单解析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 相关文章推荐
在一个form用一个SUBMIT(或button)分别提交到两个处理表单页面的代码
Feb 15 Javascript
jQuery 获取对象 根据属性、内容匹配, 还有表单元素匹配
May 31 Javascript
jquery向.ashx文件post中文乱码问题的解决方法
Mar 28 Javascript
ASP.NET jQuery 实例6 (实现CheckBoxList成员全选或全取消)
Jan 13 Javascript
JavaScript中的迭代器和生成器详解
Oct 29 Javascript
js中 javascript:void(0) 用法详解
Aug 11 Javascript
微信小程序 数据访问实例详解
Oct 08 Javascript
js与jquery分别实现tab标签页功能的方法
Nov 18 Javascript
slideToggle+slideup实现手机端折叠菜单效果
May 25 Javascript
详解vue2.0 使用动态组件实现 Tab 标签页切换效果(vue-cli)
Aug 30 Javascript
vue 表单输入格式化中文输入法异常问题
May 30 Javascript
微信小程序实现用table显示数据库反馈的多条数据功能示例
May 07 Javascript
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
VFP与其他应用程序的集成
2006/10/09 PHP
phpstudy默认不支持64位php的解决方法
2017/02/20 PHP
JQuery 1.4 中的Ajax问题
2010/01/23 Javascript
js关闭模态窗口刷新父页面或跳转页面
2012/12/13 Javascript
jQuery easyui datagrid动态查询数据实例讲解
2013/02/26 Javascript
浅谈JavaScript中小数和大整数的精度丢失
2016/05/31 Javascript
用自定义图片代替原生checkbox实现全选,删除以及提交的方法
2016/10/18 Javascript
JS获取年月日时分秒的方法分析
2016/11/28 Javascript
AngularJS前端页面操作之用户修改密码功能示例
2017/03/27 Javascript
JavaScript检查数据中是否存在相同的元素(两种方法)
2018/10/07 Javascript
vue实现的封装全局filter并统一管理操作示例
2020/02/02 Javascript
JS面向对象编程实现的Tab选项卡案例详解
2020/03/03 Javascript
json_decode 索引为数字时自动排序问题解决方法
2020/03/28 Javascript
JavaScript 接口原理与用法实例详解
2020/05/12 Javascript
python中的文件打开与关闭操作命令介绍
2018/04/26 Python
Python使用combinations实现排列组合的方法
2018/11/13 Python
python 获取页面表格数据存放到csv中的方法
2018/12/26 Python
python requests post多层字典的方法
2018/12/27 Python
Python_查看sqlite3表结构,查询语句的示例代码
2019/07/17 Python
python求绝对值的三种方法小结
2019/12/04 Python
美国一家专业的太阳镜网上零售商:Solstice太阳镜
2016/07/25 全球购物
英国香水店:The Perfume Shop
2017/03/27 全球购物
Manuka Doctor英国官网:真正的麦卢卡蜂蜜和护肤品
2018/10/26 全球购物
Happy Plugs官网:瑞典无线耳机品牌
2020/07/16 全球购物
数据库的约束含义
2012/09/09 面试题
介绍一下linux的文件权限
2012/02/15 面试题
大学新学期计划书
2014/04/28 职场文书
活动倡议书范文
2014/05/13 职场文书
白血病募捐倡议书
2014/05/14 职场文书
根叔历年演讲稿
2014/05/20 职场文书
关于长城的导游词
2015/01/30 职场文书
业务员岗位职责
2015/02/03 职场文书
2015年政风行风工作总结
2015/04/21 职场文书
2015年法律事务部工作总结
2015/07/27 职场文书
网吧员工管理制度
2015/08/05 职场文书
Nginx代理Redis哨兵主从配置的实现
2022/07/15 Servers