简单解析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 相关文章推荐
解决 FireFox 下[使用event很麻烦] 的问题.
Aug 22 Javascript
AutoSave/自动存储功能实现
Mar 24 Javascript
javascript与有限状态机详解
May 08 Javascript
form.submit()不能提交表单的原因分析
Oct 23 Javascript
基于jQuery ligerUI实现分页样式
Sep 18 Javascript
微信小程序 textarea 组件详解及简单实例
Jan 10 Javascript
原生js实现对Ajax的封装(仿jquery)
Jan 22 Javascript
vue 添加vux的代码讲解
Nov 30 Javascript
BootStrap中的模态框(modal,弹出层)功能示例代码
Nov 02 Javascript
浅析JavaScript异步代码优化
Mar 18 Javascript
elementUI select组件使用及注意事项详解
May 29 Javascript
JavaScript如何利用Promise控制并发请求个数
May 14 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
无线电广播与收音机发展的历史回眸
2021/03/02 无线电
Thinkphp使用mongodb数据库实现多条件查询方法
2014/06/26 PHP
php调用shell的方法
2014/11/05 PHP
php数组使用规则分析
2015/02/27 PHP
PHP stream_context_create()函数的使用示例
2015/05/12 PHP
PHP基本语法实例总结
2016/09/09 PHP
解决php-fpm.service not found问题的办法
2017/06/06 PHP
基于jquery的滚动鼠标放大缩小图片效果
2011/10/27 Javascript
Javascript Ajax异步读取RSS文档具体实现
2013/12/12 Javascript
javascript实现校验文件上传控件实例
2015/04/20 Javascript
jquery实现不包含当前项的选择器实例
2015/06/25 Javascript
jquery实现select选择框内容左右移动代码分享
2015/11/21 Javascript
学习Bootstrap滚动监听 附调用方法
2016/07/02 Javascript
JS动态加载脚本并执行回调操作
2016/08/24 Javascript
详解JS-- 浮点数运算处理
2016/11/28 Javascript
Node.js学习入门
2017/01/03 Javascript
详解nodejs微信公众号开发——5.素材管理接口
2017/04/11 NodeJs
jquery replace方法去空格
2017/05/08 jQuery
vue实现自定义日期组件功能的实例代码
2018/11/06 Javascript
JS模拟浏览器实现全局搜索功能
2019/09/11 Javascript
在vue中使用echars实现上浮与下钻效果
2019/11/08 Javascript
一文读懂vue动态属性数据绑定(v-bind指令)
2020/07/20 Javascript
NodeJS配置CORS实现过程详解
2020/12/02 NodeJs
python mysqldb连接数据库
2009/03/16 Python
python中__call__内置函数用法实例
2015/06/04 Python
Python正则表达式完全指南
2017/05/25 Python
celery4+django2定时任务的实现代码
2018/12/23 Python
使用Python的Turtle库绘制森林的实例
2019/12/18 Python
python如何导出微信公众号文章方法详解
2020/08/31 Python
屈臣氏菲律宾官网:Watsons菲律宾
2020/06/30 全球购物
开业庆典邀请函
2014/01/08 职场文书
护理专业自荐信范文
2014/02/26 职场文书
会计专业导师推荐信
2014/03/08 职场文书
2014年纪委工作总结
2014/12/05 职场文书
关爱留守儿童捐款倡议书
2015/04/27 职场文书
关于应聘教师的自荐信
2016/01/28 职场文书