理解原型对象与其实例之间是一对多的关系,对于实现正确的对象行为很重要。
常见的错误是不小心将每个实例的数据存储到了其原型中。

示例

一个实现了树型数据结构的类可能将子节点存储在数组中。

实例状态在原型中(错误)

将存储子节点的数组放置在原型对象中将会导致实现被完全破坏。

function Tree(x){
this.value=x;
}
Tree.prototype={
children:[],
addChild:function(x){
this.children.push(x);
}
}

如果我们使用这个类构造一棵树,代码如下

var left=new Tree(2);
left.addChild(1);
left.addChild(3); var right=new Tree(6);
right.addChild(5);
right.addChild(7); var main=new Tree(4);
main.addChild(left);
main.addChild(right); main.children;//[1,3,5,7,left,right]

我们预想的main.children应该是只包括left,right两个Tree的实例的,为什么包括这些了呢?
看一下下面这张图就明白了

这里面原有的实例都要可以访问和操作原型中children,然后都是对这个数组进行了添加,导致对应实例的children数据出现错误。

实例状态在实例对象中(正确)

实现Tree类的正确方式是为每个实例创建一个单独的children数组。

function Tree(x){
this.value=x;
this.children=[];
}
Tree.prototype={
addChild:function(){
this.children.push(x);
}
}

同样的我们看一张上面代码的图示

分析

共享有状态的数据可能会导致错误。通常在一个类的多个实例之间共享方法是安全的,因为方法通常是无状态的,这不同于通过this来引用实例状态。(因为方法调用的语法确保了this被绑定到实例对象,即使该方法是从原型中继承来的,共享方法仍然可以访问实例状态)一般情况下,任何不可变的数据可以被存储在原型中从而被安全地共享。有状态的数据原则上也可以存储在原型中,只要你真正想共享它。在原型中最常见的数据是方法,而每个实例的状态都存储在实例对象中。

提示

  • 共享可变数据可能会出现问题,因为原型是被其所有的实例共享的

  • 将可变的实例状态存储在实例对象中

[Effective JavaScript 笔记]第36条:只将实例状态存储在实例对象中的更多相关文章

  1. [Effective JavaScript 笔记] 第4条:原始类型优于封闭对象

    js有5种原始值类型:布尔值.数字.字符串.null和undefined. 用typeof检测一下: typeof true; //"boolean" typeof 2; //&q ...

  2. [Effective JavaScript 笔记] 第5条:避免对混合类型使用==运算符

    “1.0e0”=={valueOf:function(){return true;}} 是值是多少? 这两个完全不同的值使用==运算符是相等的.为什么呢?请看<[Effective JavaSc ...

  3. [Effective JavaScript 笔记]第27条:使用闭包而不是字符串来封装代码

    函数是一种将代码作为数据结构存储的便利方式,代码之后可以被执行.这使得富有表现力的高阶函数抽象如map和forEach成为可能.它也是js异步I/O方法的核心.与此同时,也可以将代码表示为字符串的形式 ...

  4. [Effective JavaScript 笔记]第28条:不要信赖函数对象的toString方法

    js函数有一个非凡的特性,即将其源代码重现为字符串的能力. (function(x){ return x+1 }).toString();//"function (x){ return x+ ...

  5. [Effective JavaScript 笔记]第65条:不要在计算时阻塞事件队列

    第61条解释了异步API怎样帮助我们防止一段程序阻塞应用程序的事件队列.使用下面代码,可以很容易使一个应用程序陷入泥潭. while(true){} 而且它并不需要一个无限循环来写一个缓慢的程序.代码 ...

  6. [Effective JavaScript 笔记]第46条:使用数组而不要使用字典来存储有序集合

    对象属性无序性 js对象是一个无序属性集合. var obj={}; obj.a=10; obj.b=30; 属性a和属性b并没有谁前谁后之说.for...in循环,先输出哪个属性都有可能.获取和设置 ...

  7. [Effective JavaScript 笔记]第55条:接收关键字参数的选项对象

    53节建议保持参数顺序的一致约定对于帮助程序员记住每个参数在函数调用中的意义很重要.参数较少这个主意不错,但如果参数过多后,就出现麻烦了,记忆和理解起来都不太容易. 参数蔓延 如下面这些代码: var ...

  8. [Effective JavaScript 笔记]第20条:使用call方法自定义接收者来调用方法

    不好的实践 函数或方法的接收者(即绑定到特殊关键字this的值)是由调用者的语法决定的.方法调用语法将方法被查找的对象绑定到this变量,(可参阅之前文章<理解函数调用.方法调用及构造函数调用之 ...

  9. [Effective JavaScript 笔记]第23条:永远不要修改arguments对象

    arguments对象并不是标准的Array类型的实例.arguments对象不能直接调用Array方法. arguments对象的救星call方法 使得arguments可以品尝到数组方法的美味,知 ...

随机推荐

  1. 原生JS、CSS实现的转盘效果(目前仅支持webkit)

    这是一个原生JS.CSS实现的转盘效果(题目在这:http://www.cnblogs.com/arfeizhang/p/turntable.html),花了半个小时左右,准备睡觉,所以先贴一段代码, ...

  2. 开源搜索引擎Iveely 0.7.0发布,不一样,那就让他不一样!

    2012年08月05日,Iveely Search Engine 0.1.0发布,今天,怀着对于未来的追求,终于,0.7.0如期和大家见面了,7个版本,历时2年4个月,感谢大家的支持,感谢我不离不弃的 ...

  3. IE10访问apache 2.4会奇慢的解决办法

    Windows版的apache 2.4. IE10访问apache 2.4会特别慢.有时Apache挂起了.只好重新开apache,但是重开后,也会好景不长,刚处理几个请求,就又变得奇慢了.Firef ...

  4. cookie的操作

    比如这样如果一个网站上有两个域名的时候,我们需要考虑,两个域名下的cookie. 我们所说的跨域只的就是lesport.com和le.com js的cookie是不能跨域的,为了防止过大. js增加删 ...

  5. OWIN-WebAPI-Windows Service

    tks: https://github.com/danesparza/OWIN-WebAPI-Service add 2015 0717:http://kb.cnblogs.com/page/5092 ...

  6. [C#]二维码(QR Code)生成与解析

    写在前面 经常在大街上听到扫码送什么什么,如果真闲着没事,从头扫到位,估计书包都装满了各种东西.各种扫各种送,太泛滥了.项目中从没接触过二维码的东东,最近要使用,就扒了扒网络,发现关于解析二维码的类库 ...

  7. MongoDB 客户端 MongoVue

    直接上图片,图片是按顺序来的 软件下载地址(Windows下的MongoDB客户端MongoVUE 这是最后一个全功能的不收费的版本): http://pan.baidu.com/s/1skYIEq5

  8. ipvsadm参数详解(常用命令)

    [root@localhost ipvsadm]# ipvsadm -h ipvsadm v1.24 2005/12/10 (compiled with popt and IPVS v1.2.1) U ...

  9. Beta版本的贡献率

    陈志灏:负责ACTIVITY部分的编写,与服务器间数据交换,贡献率百分比:%30 尤志明:负责服务器PHP编写,以及一些JAVA编程方面的编译问题的解决,贡献率百分比:%40 周子淇:负责layout ...

  10. Ibatis学习总结4--SQL Map XML 映射文件扩展

    SQL Map XML 映射文件除了上文提到的属性还有一些其他重要的属性,下文将详细介绍这些属性. 缓存 Mapped Statement 结果集 通过在查询 statement 中指定 cacheM ...