简单解析JavaScript中的__proto__属性

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);

咱们将__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);

  • subChild.__proto__ --> child
  • child.__proto__ --> parent
  • parent.__proto__ --> 顶层原型对象
赞 (0)

相关推荐

  • js中继承的几种用法总结(apply,call,prototype)

    一,js中对象继承 js中有三种继承方式 1.js原型(prototype)实现继承 复制代码 代码如下: <SPAN style="BACKGROUND-COLOR: #ffffff"><SPAN style="FONT-SIZE: 18px"><html>  <body>  <script type="text/javascript">      function Person(na

  • JavaScript isPrototypeOf和hasOwnProperty使用区别

    1.isPrototypeOf isPrototypeOf是用来判断指定对象object1是否存在于另一个对象object2的原型链中,是则返回true,否则返回false. 格式如下: object1.isPrototypeOf(object2); object1是一个对象的实例: object2是另一个将要检查其原型链的对象. 原型链可以用来在同一个对象类型的不同实例之间共享功能. 如果 object2 的原型链中包含object1,那么 isPrototypeOf 方法返回 true. 如

  • Javascript中Array.prototype.map()详解

    在我们日常开发中,操作和转换数组是一件很常见的操作,下面我们来看一个实例: 复制代码 代码如下: var desColors = [],     srcColors = [         {r: 255, g: 255, b: 255 }, // White         {r: 128, g: 128, b: 128 }, // Gray         {r: 0,   g: 0,   b: 0   }  // Black     ]; for (var i = 0, ilen = sr

  • JavaScript prototype 使用介绍

    JavaScript prototype 使用介绍

    用过JavaScript的同学们肯定都对prototype如雷贯耳,但是这究竟是个什么东西却让初学者莫衷一是,只知道函数都会有一个prototype属性,可以为其添加函数供实例访问,其它的就不清楚了,最近看了一些 JavaScript高级程序设计,终于揭开了其神秘面纱. 每个函数都有一个prototype属性,这个属性是指向一个对象的引用,这个对象称为原型对象,原型对象包含函数实例共享的方法和属性,也就是说将函数用作构造函数调用(使用new操作符调用)的时候,新创建的对象会从原型对象上继承属性和

  • 不错的一篇关于javascript-prototype继承

    1.最基本的用法 把ClassA的一个实例赋值给ClassB, ClassB就继承了ClassA的所有属性. 代码入下: function ClassA() { this.a='a'; } function ClassB() { this.b='b'; } ClassB.prototype=new ClassA(); var objB=new ClassB(); for(var p in objB)document.write(p+" "); [Ctrl+A 全选 注:如需引入外部Js

  • JS面向对象、prototype、call()、apply()

    一. 起因 那天用到prototype.js于是打开看看,才看几行就满头雾水,原因是对js的面向对象不是很熟悉,于是百度+google了一把,最后终于算小有收获,写此纪念一下^_^. prototype.js代码片段 复制代码 代码如下: var Class = { create: function() { return function() { this.initialize.apply(this , arguments); } } } // Class使用方法如下 var A = Class

  • 数据排序谁最快(javascript中的Array.prototype.sort PK 快速排序)

    但是让我感到意外的是,下面有个网友回复说,javascript中的Array本身的sort方法才是最快的,比快速排序算法都快,当时看到了很是郁闷,因为当时花了好长时间在排序算法上,居然忘记了Array本身的sort方法 不过javascript中内置的sort方法真的比快速排序算法还快吗? 哈哈,测试一下不就知道了 先说一下我测试的环境 1,我的测试环境是IE6.0和firefox2.0 2,每种算法有很多种不同的实现方法,下面测试中我选择上面网友实现的快速排序算法,只是把内嵌函数搬到了外面 3

  • JS 面向对象之神奇的prototype

    JavaScript中对象的prototype属性,可以返回对象类型原型的引用.这是一个相当拗口的解释,要理解它,先要正确理解对象类型(Type)以及原型(prototype)的概念. 1 什么是prototype JavaScript中对象的prototype属性,可以返回对象类型原型的引用.这是一个相当拗口的解释,要理解它,先要正确理解对象类型(Type)以及原型(prototype)的概念. 前面我们说,对象的类(Class)和对象实例(Instance)之间是一种"创建"关系,

  • js中prototype用法详细介绍

    prototype 是在 IE 4 及其以后版本引入的一个针对于某一类的对象的方法,而且特殊的地方便在于:它是一个给类的对象添加方法的方法!这一点可能听起来会有点乱,别急,下面我便通过实例对这一特殊的方法作已下讲解: 首先,我们要先了解一下类的概念,JavaScript 本身是一种面向对象的语言,它所涉及的元素根据其属性的不同都依附于某一个特定的类.我们所常见的类包括:数组变量(Array).逻辑变量(Boolean).日期变量(Date).结构变量(Function).数值变量(Number)

  • JQuery,Extjs,YUI,Prototype,Dojo 等JS框架的区别和应用场景简述

    所以Javascript已经成为了web开发最最基本的要求之一了. 而在现实的敏捷开发中,我们通常会选择一个JS框架来取代繁琐的Native Javascript的编写.你会发现这样会节省很多的时间,写的代码也很清晰便捷.(当然在学生时代的是有也质疑过,用框架会对原生态的 Javascript理解不深入,其实这是多虑了的.在对框架的深入的同时,对原生的js也会理解的更透彻一些.成为一个精明的开发者,两者是相依相偎的.而最好的状态就是想Qzone前端一样,完全按照自己的需求开发出一套JS,CSS框

  • js中的hasOwnProperty和isPrototypeOf方法使用实例

    hasOwnProperty:是用来判断一个对象是否有你给出名称的属性或对象.不过需要注意的是,此方法无法检查该对象的原型链中是否具有该属性,该属性必须是对象本身的一个成员. isPrototypeOf:是用来判断要检查其原型链的对象是否存在于指定对象实例中,是则返回true,否则返回false. 复制代码 代码如下: function siteAdmin(nickName,siteName){ this.nickName=nickName; this.siteName=siteName;}si

  • JavaScript中的prototype使用说明

    JavaScript中的prototype使用说明

    1.prototype 在JavaScript中并没有类的概念,但JavaScript中的确可以实现重载,多态,继承.这些实现其实方法都可以用JavaScript中的引用和变量作用域结合prototype来解释. 2.简单的例子 复制代码 代码如下: var Blog = function( name, url ){ this.name = name; this.url = url; }; Blog.prototype.jumpurl = ''; Blog.prototype.jump = fu

随机推荐