原型和原型链的故事

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

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

 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的闭包》

javascript原型prototype的一个你不一定知道的理解的更多相关文章

  1. javascript原型Prototype【转】

    转自:http://www.cnblogs.com/starof/p/4190404.html 在javaScript创建对象一文中提到过:用构造函数创建对象存在一个问题即同一构造函数的不同实例的相同 ...

  2. javascript原型Prototype

    在javaScript创建对象一文中提到过:用构造函数创建对象存在一个问题即同一构造函数的不同实例的相同方法是不一样的,所以我们用原型把构造函数中公共的属性和方法提取出来进行封装,达到让所有实例共享的 ...

  3. 简单粗暴地理解 JavaScript 原型链 (一个充满歪门邪理的理解方法,有助于新手哦!)

    原型链理解起来有点绕了,网上资料也是很多,每次晚上睡不着的时候总喜欢在网上找点原型链和闭包的文章看,效果极好. 不要纠结于那一堆术语了,那除了让你脑筋拧成麻花,真的不能帮你什么.简单粗暴点看原型链吧, ...

  4. javascript原型:写一个合并后数组去掉同类项的方法

    <!DOCTYPE html> <html> <head> <title>test013_Array_prototype_unique()</ti ...

  5. javascript原型prototype浅识

    C++,java是基于类的语言,主要通过类来实现继承. javascript是基于原型的语言,通过原型来实现继承. 什么是原型?每种物质,都可以追根溯源,原型就是对象的根源.继承就是追根溯源. jav ...

  6. javascript 原型(prototype 、__proto__、函数、对象)

    一.类型 1.JavaScript中分为值类型(string/boolean/null/number/undefind).引用类型(数组.对象.函数): 2.数组.函数.对象都是对象: 对象是由函数创 ...

  7. JavaScript 原型 prototype 使用经验

    初始化一个父类,并添加方法 1function Foo(){}2Foo.prototype.sayName = function(){3    return '初始原型';4}56var foo1 = ...

  8. javascript 原型详解

    引:http://www.cnblogs.com/wangfupeng1988/p/3978131.html 1.什么是javascript原型 每一个函数都有prototype属性(默认生成的)和原 ...

  9. 再谈javascript原型继承

    Javascript原型继承是一个被说烂掉了的话题,但是自己对于这个问题一直没有彻底理解,今天花了点时间又看了一遍<Javascript模式>中关于原型实现继承的几种方法,下面来一一说明下 ...

随机推荐

  1. bzoj2180: 最小直径生成树

    Description 输入一个无向图G=(V,E),W(a,b)表示边(a,b)之间的长度,求一棵生成树T,使得T的直径最小.树的直径即树的最长链,即树上距离最远的两点之间路径长度. Input 输 ...

  2. cocos creater 简单的跳跃动作。

    因为最近一段时间有打算做一个2D游戏的想法,就顺便学习了一下cocos,很惊异的它的脚本编写语言竟然支持js,正好以前对js有一定的了解,就临时拿起来了. 这是来自官方的一个实例,不过在参考过程中,发 ...

  3. linux ssh 无密码登陆

    要点:有时候ssh localhost 无法登陆本机,但各种设置都正确.重启下就好了...... 参考地址:http://bbs.csdn.net/topics/370109654 三台机器实现互相之 ...

  4. [BZOJ 1033] [ZJOI2008] 杀蚂蚁antbuster 【模拟!】

    题目链接: BZOJ - 1033 题目分析 模拟!纯粹按照题目描述模拟! 这是一道喜闻乐见的经典模拟题! 我一共写了2遍,Debug 历时2天的所有晚自习 ... 时间超过 8h ... 我真是太弱 ...

  5. angularjs学习总结(~~很详细的教程)

    1 前言 前端技术的发展是如此之快,各种优秀技术.优秀框架的出现简直让人目不暇接,紧跟时代潮流,学习掌握新知识自然是不敢怠慢. AngularJS是google在维护,其在国外已经十分火热,可是国内的 ...

  6. 使用CSS为图片添加边框的几种方法

    css的应用十分广泛,即便用在图片的效果中也是方法多样,本文下面就介绍五种为图片添加特殊效果边框的CSS写法阴影效果 通过使用带有一些padding之的背景图来添加阴影效果. HTML <img ...

  7. Strange Way to Express Integers (一般模线性方程组)

    Time Limit: 1000MS   Memory Limit: 131072K Total Submissions: 8476   Accepted: 2554 Description Elin ...

  8. weblogic启动报错之WLS_DIAGNOSTICS000000.DAT

    查看控制台日志报错信息如下: <-- 下午04时46分42秒 CST> <Notice> <Log Management> <BEA-> <The ...

  9. 福州大学 Problem 2169 shadow

    http://acm.fzu.edu.cn/problem.php?pid=2169 思路:建立一个邻接表,利用搜索中回溯把走过的路标记为1,然后把这些标记为1的值全部加起来. Problem 216 ...

  10. JavaScript 函数绑定 Function.prototype.bind

    ECMAScript Edition5 IE9+支持原生,作用为将一个对象的方法绑定到另一个对象上执行. Function.prototype.bind = Function.prototype.bi ...