1.实例:‘对象(实例)’有属性__proto__,指向该对象(实例)的‘构造函数的原型对象’。
2.方法:‘构造函数’除了有属性__proto__,所有构造函数方法的__proto__指向Function.prototype,Function.prototype的__proto__指向Function.prototype,Function.prototype的__proto__指向Object.prototype,Object.prototype的__proto__指向null。
还有属性prototype,构造函数方法的prototype指向该'构造方法的原型对象',构造方法的原型对象又指向Function.prototype,然后__proto__..走上述。


作者:doris
链接:https://www.zhihu.com/question/34183746/answer/58155878
来源:知乎
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。 首先,要明确几个点:
1.在JS里,万物皆对象。方法(Function)是对象,方法的原型(Function.prototype)是对象。因此,它们都会具有对象共有的特点。
即:对象具有属性__proto__,可称为隐式原型,一个对象的隐式原型指向构造该对象的构造函数的原型,这也保证了实例能够访问在构造函数原型中定义的属性和方法。 2.方法(Function)
方法这个特殊的对象,除了和其他对象一样有上述_proto_属性之外,还有自己特有的属性——原型属性(prototype),这个属性是一个指针,指向一个对象,这个对象的用途就是包含所有实例共享的属性和方法(我们把这个对象叫做原型对象)。原型对象也有一个属性,叫做constructor,这个属性包含了一个指针,指回原构造函数。 好啦,知道了这两个基本点,我们来看看上面这副图。
1.构造函数Foo()
构造函数的原型属性Foo.prototype指向了原型对象,在原型对象里有共有的方法,所有构造函数声明的实例(这里是f1,f2)都可以共享这个方法。 2.原型对象Foo.prototype
Foo.prototype保存着实例共享的方法,有一个指针constructor指回构造函数。 3.实例
f1和f2是Foo这个对象的两个实例,这两个对象也有属性__proto__,指向构造函数的原型对象,这样子就可以像上面1所说的访问原型对象的所有方法啦。 另外:
构造函数Foo()除了是方法,也是对象啊,它也有__proto__属性,指向谁呢?
指向它的构造函数的原型对象呗。函数的构造函数不就是Function嘛,因此这里的__proto__指向了Function.prototype。
其实除了Foo(),Function(), Object()也是一样的道理。 原型对象也是对象啊,它的__proto__属性,又指向谁呢?
同理,指向它的构造函数的原型对象呗。这里是Object.prototype. 最后,Object.prototype的__proto__属性指向null。 总结:
1.对象有属性__proto__,指向该对象的构造函数的原型对象。
2.方法除了有属性__proto__,还有属性prototype,prototype指向该方法的原型对象。

调试代码


<html>
<head>
<title></title>
</head>
<script type="text/javascript"> //对应上面的图,我们只用到了实例---》构造函数---》构造函数的原型---》Object.prototype---》null //原型链:a1对象(实例对象)还让A.prototype对象(原型对象)之间的连接,叫做原型链
//2个对象。之间有一个链接 _proto_ //a1下是没有num1(A中没有this.num1=20),会继续通过a1._proto_找num1。
//a1下有num1(A中没有this.num1=20),不再会继续通过a1._proto_找num1,
//即使A.prototype.num1 = 10; alert(a1.num1);依然是20 //....
//原型链最外层:Object.prototype
function A(){
//this.num1=20 }
//A.prototype.num1 = 10;
/*Function.prototype.num1 = 30;*/不对
Object.prototype.num1 = 40;
/*A.prototype.num1 = 60*/
A.prototype.fun = function() {
alert(this.num1)//原型中的this和构造方法的this是同一个,指向实例a1
};
var a1=new A();
a1.fun();
alert(a1.num1);
</script>
<body> </body>
</html>

增加:数组的原型链Array._proto_=Function.prototype数组的原型Array.prototype=[]


总结

JavaScript中有内置(build-in)构造器/对象共计12(ES5中新加了JSON),这里列举了可访问的8个构造器。

剩下如Global不能直接访问,Arguments仅在函数调用时由JS引擎创建,Math,JSON是以对象形式存在的,无需new。

prototype

Object.prototype--》Object {}
console.log(typeof Object.prototype) // object String.prototype--》String {length: 0, [[PrimitiveValue]]: ""}
console.log(typeof String.prototype) // object Number.prototype--》Number {[[PrimitiveValue]]: 0}
console.log(typeof Number.prototype) // object Boolean.prototype--》Boolean {[[PrimitiveValue]]: false}
console.log(typeof Boolean.prototype) // object Error.prototype--》 D…r.aV {name: "Error", message: ""}
console.log(typeof Error.prototype) // object Date.prototype--》 Invalid Date
console.log(typeof Date.prototype) // object RegExp.prototype --》 /(?:)/
console.log(typeof RegExp.prototype) // object Array.prototype --》 [] //!!最重要的是 Array.prototype --》 []
console.log(typeof Array.prototype) // object Function.prototype--》function(){} //!!所有构造器函数的__proto__都指向这个,它是一个空函数(Empty function)
console.log(typeof Function.prototype) // function Math.prototype-->undefined
JSON.prototype-->undefined
Global不能直接访问

http://www.cnblogs.com/snandy/archive/2012/09/01/2664134.html#3412281

JavaScript系列:再巩固-原型链的更多相关文章

  1. JavaScript之继承(原型链)

    JavaScript之继承(原型链) 我们知道继承是oo语言中不可缺少的一部分,对于JavaScript也是如此.一般的继承有两种方式:其一,接口继承,只继承方法的签名:其二,实现继承,继承实际的方法 ...

  2. javascript类继承系列二(原型链)

    原型链是采用最主要的继承方式,原理:每一个类(构造器,js中的function)都有一个原型属性(prototype)指向一个原型对象,原型对象有一个构造器(constructor),它又指回到fun ...

  3. javascript中继承(一)-----原型链继承的个人理解

    [寒暄]好久没有更新博客了,说来话长,因为我下定决心要从一个后台程序员转为Front End,其间走过了一段漫长而艰辛的时光,今天跟大家分享下自己对javascript中原型链继承的理解. 总的说来, ...

  4. javascript 创建对象及对象原型链属性介绍

    我们知道javascript里定义一个普通对象的方法,如: let obj = {}; obj.num = 1; obj.string = 'string'; obj.func = function( ...

  5. JavaScript高级内容:原型链、继承、执行上下文、作用域链、闭包

    了解这些问题,我先一步步来看,先从基础说起,然后引出这些概念. 本文只用实例验证结果,并做简要说明,给大家增加些印象,因为单独一项拿出来都需要大篇幅讲解. 1.值类型 & 引用类型 funct ...

  6. Javascript之继承(原型链方式)

    1.原型链 原型链是JavaScript中继承的主要方法. 每个构造函数都拥有一个原型对象,原型对象都包含一个指向构造函数的指针(constructor),实例都包含一个指向原型对象的内部指针(__p ...

  7. javascript 重难点(原型链 this) 理解总有一个过程,不要急,循序渐进!

    开始补充: 1. 将函数定义作为对象的属性,称之为对象方法.2. this的指向是由它所在函数调用的上下文决定的(语境),而不是由它所在函数定义的上下文决定的.3. 因为当一个函数作为函数而不是方法来 ...

  8. javascript精髓篇之原型链维护和继承.

    一.两个原型 很多人都知道javascript是原型继承,每个构造函数都有一个prototype成员,通过它就可以把javascript的继承演义的美轮美奂了. 其实啊,光靠这一个属性是无法完成jav ...

  9. javascript 面向对象 new 关键字 原型链 构造函数

    JavaScript面向对象JavaScript 语言使用构造函数(constructor)作为对象的模板.所谓"构造函数",就是专门用来生成实例对象的函数.它就是对象的模板,描述 ...

随机推荐

  1. HDU2050离散数学折线分割平面

    折线分割平面 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Subm ...

  2. MVC文件夹

    应用程序信息: Properties 引用应用程序文件夹: App_Data 文件夹 Content 文件夹 Controllers 文件夹 Models 文件夹 Scripts 文件夹 Views ...

  3. vm 负责虚拟机出现“”适配器 的mac地址在保留地址范围内‘’

    我自己在windows中文件中,直接将一个虚拟机进行复制了一份,后用vm打开, 选择我已经移到,结果会出现了一下的情况, 导致了我无法ping 通,故我看到一下提示: 原来是我两台虚拟机的MaC ,即 ...

  4. Integer取值范围和NumberFormatException的解决

    项目有个查询当地新闻的接口,从GEO文件中取得code,后台查询. 下午测试的时候查询日本:3920000000,结果报java.lang.NumberFormatException,数字格式化异常, ...

  5. 最新php环境搭建

    参考文章:http://jingyan.baidu.com/article/29697b912f6539ab20de3cf8.html

  6. 以多个实例方式打开Notepad++

    Right-click any Notepad++ shortcut. Select Properties. Move to the Shortcut tab. In the end of the T ...

  7. Java中如何使封装自己的类,建立并使用自己的类库?

    转自:http://blog.csdn.net/luoweifu/article/details/7281494 随着自己的编程经历的积累会发现往往自己在一些项目中写的类在别的项目中也会有多次用到.你 ...

  8. 实现Activity刷新(转)

    目前刷新Acitivity,只想到几种方法.仅供参考,如果您有更好的方法,请赐教. 程序界面: 点击refresh view可以刷新界面,点击write content可以在EditText中自动写入 ...

  9. PUSHA/PUSHAD

    http://124.16.151.186/docs/optimization/VTune(TM) User's Guide/mergedProjects/analyzer_ec/mergedProj ...

  10. 使用NGUINGUI的相关介绍

    1.3  使用NGUI 要使用NGUI,需要首先为游戏项目导入NGUI插件资源,然后再创建UI Root对象,在这以后才可以添加各种UI控件,下面本节会详解介绍这些知识本文选自NGUI从入门到实战! ...