javascript原型prototype的一个你不一定知道的理解

时间:2023-01-03 15:41:26

原型和原型链的故事

相关文章: 为什么原型继承很重要

先来看看一段小代码用以引入要讲的小故事。

 function Foo() {};
var f1 = new Foo();
Foo.prototype.label = "Skylor.min"; alert(f1.label); //output: Skylor.min
alert(Foo.label); //output: undefined

Why? 为什么?

下面来聊聊JavaScript中的原型和原型链种种。

函数对象的prototype并不作用于原型链查找过程中,该原型仅用于由该函数创建的对象/实例继承的属性,而函数本身并不使用相关联的原型。

但,一旦函数他自己本身就是个object的时候,它就继承了它创建者的功能的原型。

值得注意的是:我们使用Foo.prototype设置函数Foo创建的所有对象的属性。我们不说f1.prototype设置属性为f1。这是一个非常重要的,一点要记住!

再来个例子,更清晰的解释这句话:

    function foo() {}
f1 = new foo();
f2 = new foo();
foo.prototype.x = "hello"; f1.x => "hello"
f2.x => "hello"; f1.x = "goodbye"; //setting f1.x hides foo.prototype.x f1.x => "goodbye" //hides "hello" for f1 only
f2.x => "hello" delete f1.x
f1.x => "hello"; //foo.prototype.x is visible again to f1.

国外大佬对它两的故事有更深的理解->传送门

《javascript的闭包》