简单解析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 相关文章推荐
jQuery chili图片远处放大插件
Nov 30 Javascript
讨论javascript(一)工厂方式 js面象对象的定义方法
Dec 15 Javascript
密码强度检测效果实现原理与代码
Jan 04 Javascript
js关闭当前页面(窗口)的几种方式总结
Mar 05 Javascript
使用node.js 制作网站前台后台
Nov 13 Javascript
JavaScript判断变量是否为空的自定义函数分享
Jan 31 Javascript
JS实现的论坛Ajax打分效果完整实例
Oct 31 Javascript
JavaScript事件 "事件对象"的注意要点
Jan 14 Javascript
使用PHP+JavaScript将HTML页面转换为图片的实例分享
Apr 18 Javascript
纯JavaScript 实现flappy bird小游戏实例代码
Sep 27 Javascript
bootstrap中模态框、模态框的属性实例详解
Feb 17 Javascript
JS实现九宫格拼图游戏
Jun 28 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
PHP常用开发函数解析之数组篇[未完结]
2012/07/30 PHP
php字符串截取函数用法分析
2014/11/25 PHP
php强制更新图片缓存的方法
2015/02/11 PHP
php实现的redis缓存类定义与使用方法示例
2017/08/09 PHP
php链式操作的实现方式分析
2019/08/12 PHP
Yii框架 session 数据库存储操作方法示例
2019/11/18 PHP
Sample script that deletes a SQL Server database
2007/06/16 Javascript
禁用键盘上的(全局)指定键兼容iE、Chrome、火狐
2013/05/14 Javascript
js之事件冒泡和事件捕获详细介绍
2013/10/28 Javascript
Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结
2013/11/14 Javascript
浅析基于WEB前端页面的页面内容搜索的实现思路
2014/06/10 Javascript
让JavaScript的Alert弹出框失效的方法禁止弹出警告框
2014/09/03 Javascript
浅谈使用MVC模式进行JavaScript程序开发
2015/11/10 Javascript
移动端翻页插件dropload.js(支持Zepto和jQuery)
2016/07/27 Javascript
javascript判断firebug是否开启的方法
2016/11/23 Javascript
利用vue写todolist单页应用
2016/12/15 Javascript
解析ajaxFileUpload 异步上传文件简单使用
2016/12/30 Javascript
JS实现浏览器打印、打印预览示例
2017/02/28 Javascript
微信小程序左右滑动切换页面详解及实例代码
2017/02/28 Javascript
浅谈react.js 之 批量添加与删除功能
2017/04/17 Javascript
jquery+ajaxform+springboot控件实现数据更新功能
2018/01/22 jQuery
JavaScript 九种跨域方式实现原理
2019/02/11 Javascript
微信小程序实现可拖动悬浮图标(包括按钮角标的实现)
2020/12/29 Javascript
pyramid配置session的方法教程
2013/11/27 Python
windows环境下tensorflow安装过程详解
2018/03/30 Python
python redis 删除key脚本的实例
2019/02/19 Python
python 画函数曲线示例
2019/12/04 Python
计算机应用专业学生的自我评价分享
2013/11/03 职场文书
校园学雷锋活动月总结
2014/03/09 职场文书
安康杯竞赛活动总结
2014/05/05 职场文书
体育教师求职信
2014/05/24 职场文书
2014年党员教师自我剖析材料
2014/09/30 职场文书
2014年旅游局法制宣传日活动总结
2014/11/01 职场文书
初中作文评语
2014/12/25 职场文书
六年级上册《闻官军收河南河北》的教学设计
2019/11/15 职场文书
JavaScript实现贪吃蛇游戏
2021/06/16 Javascript