http://www.mollypages.org/misc/js.mp
1.函数对象的属性:prototype、constructor、__proto__
prototype:指向当前对象的原型对象,该原型对象是对象字面量形式创建(函数对象特有)
constructor:指向当前对象的构造函数(函数的原型对象的constructor属性较为特殊,见下面)
__proto__:指向创建当前对象的函数的原型对象(对象由谁(函数)创建,__proto__就指向谁的原型对象)
2.对象实例的属性:constructor、__proto__
3.每一个函数(含构造函数)对象的constructor属性都是Function()函数。
因为函数对象都是被Function构造函数所创建。
即:每一个函数对象的__proto__属性都是指向Function函数的原型对象:Function.prototype对象。
4.Object.prototype原型对象是顶级原型对象。
Object.prototype.__proto__为null,是原型链的终点。
5.关于函数的原型对象:
因为当一个函数对象被创建时,Function构造器产生的函数对象会运行类似的一些代码:
this.prototype = {constructor: this};
新函数对象被赋予了一个prototype属性,该属性值是一个字面量形式创建的原型对象,该对象含有一个constructor属性且其属性值为新函数本身。
即函数的原型对象的constructor属性均指向函数本身。
由this.prototype = {constructor: this};可知,函数的原型对象都是由Object函数创建的,即原型对象的__proto__属性均指向Object.prototype原型对象。
6.在原型链中,真正参与标识符查找的是对象的__proto__。
例如:
1.The prototype is only used for properties inherited by objects/instances created by that function. The function itself does not use the associated prototype (but since the function itself is an object, it inherits from the prototype of it's creator function, typically the javascript system "Function" object).
函数的prototype(原型属性)仅用于属性被这个函数创建的对象所继承的情况。这个函数本身没有使用相关的prototype。
console.clear();
function Foo(){}
var f1 = new Foo();
Foo.prototype.x = "hello";
console.log(f1.x);//hello,f1.x==>f1.__proto__(Foo.prototype).x
console.log(Foo.x);//undefined,Foo.x==>Foo.__proto__(Function.prototype).label==>Function.prototype.__proto__(Object.prototype).label==>undefined
Note, we use the Foo.prototype to set properties for all objects created by function Foo. We don't say f1.prototype to set properties for f1. This is a very important point to remember.
注意,我们使用Foo.prototype为所有被这个函数Foo创建的对象设置属性。我们不建议f1.prototype为f1设置属性。这是要记住的非常重要的一点。
2.Default prototype objects can be replaced with another user created object. While doing so, the constructor property must be set manually to replicate what the javascript runtime does behind the scence with the default prototype object.
默认的原型对象能被其他的用户创建的对象取代。在这个过程中,constructor属性必须手动设置去复制js运行时做了什么在之前默认的原型对象的情景。
console.clear();
function foo(){};
var f1 = new foo();
console.log(f1.constructor);//foo()
console.log(foo.prototype.constructor);//foo()
foo.prototype = new Object();
console.log(f1.constructor);//foo()
console.log(foo.prototype.constructor);//Object()
foo.prototype.constructor = foo;
console.log(f1.constructor);//foo()
console.log(foo.prototype.constructor);//foo()
Each prototype object itself is created (by default) with the Object() constructor, hence the prototype has as it's prototype Object.prototype. Therefore all instances regardless of the type ultimately inherit properties from Object.prototype.
每个原型对象本身默认使用Object()构造函数创建,因此原型的原型是Object.prototype.所以所有的实例不管类型最终都继承来自Object.prototype的属性。
3.All objects automatically read properties in the prototype chain as-if those properties where defined in the object itself.
所有的对象自动在原型链中读取属性,就好像这些属性是在对象自身定义的一样。
Setting the same property via the object shadows/hides the same property in the prototype for that instance.
通过对象设置与原型对象相同的属性,为单个实例隐藏了在原型中的相同属性。
console.clear();
function foo(){};
var f1 = new foo();
var f2 = new foo();
foo.prototype.x = "hello;//为foo函数创建的所有对象设置属性x
console.log(f1.x);//hello
console.log(f2.x);//hello
f1.x = "goodbye";//设置对象f1的属性x,隐藏了foo原型对象中的x属性
console.log(f1.x);//goodbye
console.log(f2.x);//hello
delete f1.x;//删除了对象f1中的属性x
console.log(f1.x);//hello//foo.prototype.x又可见了
Setting the property directly in the prototype changes it for all instances.
通过直接在原型中设置属性,为所有实例改变了属性。
foo.prototype.x = "goodbye";
console.log(f1.x);//goodbye
console.log(f2.x);//goodbye
=================================================================================
Function.__proto__ points to Function.prototype. This results in:
Function.constructor === Function
That is to say: Function is it's own constructor !
Object instanceof Object == true.
This is because:
Object.__proto__.__proto__.constructor == Object
Object.__proto__(Function.prototype).__proto__(Object.prototype).constructor==Object
Note also that unlike Object instanceof Object, Foo instanceof Foo == false.
Foo.__proto__(Function.prototype)__proto__(Object.prototype).constructor==Object
This is because: Foo does not exist as a constructor for it's own prototype chain.
Function.prototype.toString is a built-in method and is distinct from another built-in method: Object.prototype.toString
f1.toString() finds:
Object.prototype.toString
We get something like: [object ...]
Whereas:
Foo.toString() first finds & uses:
Function.prototype.toString()
We get something like: [Function foo...]
If we say:
delete Function.prototype.toString
Foo.toString()
We get something like: [object ...]
- 大小: 176.5 KB
分享到:
相关推荐
JavaScript 不包含传统的类继承模型,而是使用 prototypal 原型模型。...由于 JavaScript 是唯一一个被广泛使用的基于原型继承的语言,所以理解两种继承模式的差异是需要一定时间的,今天我们就来了解一下原型和原型链
原型和原型链整体例子从原型的创建,原型与对象的关联关系,实例与原型的关系以及原型链的形成和运用等等均做了例子的说明
终极原型链图示讲解 注1:原型对象是Object函数的实例对象,即,构造函数定义时,Object函数也创建了一个原型对象。且,构造函数的原型对象中有一个__proto__(隐式原型对象)指向Object的原型对象。 注2:Object函数...
javascript的原型与原型链的详细的解析,一篇从认识到熟悉深入的好文章!
深度探讨javascript函数的原型链和闭包
个人总结的原型链全套图解,可以辅助你对原型链的理解,拿走拿走
前端面试题,包含JavaScript的闭包,作用域,原型,原型链,上下文环境以及DOM,BOM封装函数深度克隆,以及一些常见的·JS问题,试题简单但是容易混淆,作为前端工程师必考题
我所理解的从原型到原型链
当访问一个对象的属性或方法时,如果对象本身没有定义该属性或方法,JavaScript 就会沿着原型链向上查找,直到找到该属性或方法或者到达原型链的末尾(null)为止。 原型链图是用于表示 JavaScript 中对象之间原型...
一个例子让你彻底明白原型对象和原型链 开篇 之前对js中的原型链和原型对象有所了解,每当别人问我什么是原型链和原型对象时,我总是用很官方(其实自己不懂)的解释去描述。有一句话说的好:如果你不能把一个很复杂...
04_原型链_属性问题.html
深入浅出的讲解JavaScript中最难理解的Js构造函数、原型链、Ajax三大部分
JS难点同步异步和作用域与闭包及原型和原型链详解 目录 JS三座大山同步异步同步异步区别作用域、闭包函数作用域链块作用域闭包闭包解决用var导致下标错误的问题投票机闭包两个面试题原型、原型链原型对象原型链...
vue项目中汉字转换成拼音,内含两种,一种添加到自定义指令,一种添加原型链,可以挑选自己喜欢的用
五句话帮你轻松搞定js原型链 原型链是一种机制,指的是JavaScript每个对象包括原型对象都有一个内置的[[proto]]属性指向创建它的函数对象的原型对象,即prototype属性。 作用:原型链的存在,主要是为了实现对象的...
JavaSciptDOM基本操作,JavaScipt函数基础,JavaScipt流程语句,JavaScript变量,JavaScript数据类型,JavaScript数组,JavaScript正则表达式,JavaScript字符串函数,Window对象等图解。JS高手进阶的工具图谱
【技术分享】从浅入深 Javascript 原型链与原型链污染 APT web安全 网络安全 安全 自动化
本文实例分析了Javascript原型链的原理。分享给大家供大家参考,具体如下: 一、JavaScript原型链 ECMAScript中描述了原型链的概念,并将原型链作为实现继承的主要方法。其基本思想是利用原型让一个引用类型继承另一...