[Effective JavaScript 笔记]第40条:避免继承标准类
ECMAScript标准库里配备了许多重要的类,如Array,function,以及Date等。扩展这些类生成子类可以方便完成很多工作,但它们的定义具有很多特殊的行为,所以很难写出行为正确的类。
Array示例
一个操作文件系统的库可能希望创建一个对象的目录,该目录继承了数组的所有行为。
function Dir(path,entries){
this.path=path;
for(var i=0,n=entries.length;i < n;i++){
this[i]=entries[i];
}
}
Dir.prototype=Object.create(Array.prototype);
运行下面这段代码,并没有得到预期的行为。
var dir=new Dir('/tmp/mysite',['index.html','script.js','style.css']);
dir.length;//0
失败的原因
length属性只对在内部被标记为“真正的”数组的特殊对象起作用。ECMAScript标准规定它是一个不可见的内部属性,称为[[Class]]。它的值只是一个简单的标签,并不是js真正有内部类系统。数组对象的[[Class]]值是"Array",函数对应的[[Class]]是"Function"。下面这个表是ECMAScript中定义的完整的[[Class]]属性值集合。

解密length
那么神奇的[[Class]]属性对length做了什么呢?事实上,length的行为只被定义在内部属性[[Class]]的值为"Array"的特殊对象中。对于这些对象,js保持length属性与该对象的索引属性的数量同步。如果给该对象添加了更多的索引属性,length属性会自动增加。如果减少了length属性,也会自动删除任何索引大于该新值的索引属性。
当我们扩展Array类时,子类的实例并不是通过new Array()或字面量[]语法创建的。所以Dir实例的[[Class]]属性值为"Object"。
使用默认的Object.prototype.toString()方法可以通过查询其接收者的内部[[Class]]属性来创建对象的通用描述。可以传递任何给定的对象来显式地调用它。
var dir=new Dir('/',[]);
Object.prototype.toString.call(dir);//"[Object Object]"
Object.prototype.toString.call([]);//"[Object Array]"
结果Dir的实例未继承数组的length属性所期望的特殊行为。
更好的实现
定义一个entries数组的实例属性。
function Dir(path,entries){
this.path=path;
this.entries=entries;
}
在原型中重新定义Array的方法,将这些相应的方法委托给entries属性来实现。
Dir.prototype.forEach=function(f,thisArg){
if(typeof thisArg==='undefined'){
thisArg=this;
}
this.entries.forEach(f,thisArg);
}
ECMAScript标准库中的大多数构造函数都有类似的问题。某些属性或方法期望具有正确的[[Class]]属性或其他特殊的内部属性,然而子类却无法提供。基于这个原因,最好避免继承以下的标准类:Array,Boolean,Date,Function,RegExp,String。
提示
继承标准类往往会由于一些特殊的内部属性(如[[Class]])而被破坏
使用属性委托优于继承标准类
[Effective JavaScript 笔记]第40条:避免继承标准类的更多相关文章
- [Effective JavaScript 笔记]第28条:不要信赖函数对象的toString方法
js函数有一个非凡的特性,即将其源代码重现为字符串的能力. (function(x){ return x+1 }).toString();//"function (x){ return x+ ...
- [Effective JavaScript 笔记] 第4条:原始类型优于封闭对象
js有5种原始值类型:布尔值.数字.字符串.null和undefined. 用typeof检测一下: typeof true; //"boolean" typeof 2; //&q ...
- [Effective JavaScript 笔记] 第5条:避免对混合类型使用==运算符
“1.0e0”=={valueOf:function(){return true;}} 是值是多少? 这两个完全不同的值使用==运算符是相等的.为什么呢?请看<[Effective JavaSc ...
- [Effective JavaScript 笔记]第27条:使用闭包而不是字符串来封装代码
函数是一种将代码作为数据结构存储的便利方式,代码之后可以被执行.这使得富有表现力的高阶函数抽象如map和forEach成为可能.它也是js异步I/O方法的核心.与此同时,也可以将代码表示为字符串的形式 ...
- [Effective JavaScript 笔记]第45条:使用hasOwnProperty方法以避免原型污染
之前的43条,44条讨论了属性的枚举,但都没有彻底地解决属性查找中原型污染的问题.看下面关于字典的一些操作 'zhangsan' in dict; dict.zhangsan; dict.zhangs ...
- [Effective JavaScript 笔记]第68条:使用promise模式清洁异步逻辑
构建异步API的一种流行的替代方式是使用promise(有时也被称为deferred或future)模式.已经在本章讨论过的异步API使用回调函数作为参数. downloadAsync('file.t ...
- [Effective JavaScript 笔记]第39条:不要重用父类的属性名
假设想给上节讲的场景图库添加收集诊断信息的功能.这对于调试和性能分析很有用. 38条示例续 给每个Actor实例一个唯一的标识数. 添加标识数 function Actor(scene,x,y){ t ...
- [Effective JavaScript 笔记]第46条:使用数组而不要使用字典来存储有序集合
对象属性无序性 js对象是一个无序属性集合. var obj={}; obj.a=10; obj.b=30; 属性a和属性b并没有谁前谁后之说.for...in循环,先输出哪个属性都有可能.获取和设置 ...
- [Effective JavaScript 笔记]第51条:在类数组对象上复用通用的数组方法
前面有几条都讲过关于Array.prototype的标准方法.这些标准方法被设计成其他对象可复用的方法,即使这些对象并没有继承Array. arguments对象 在22条中提到的函数argument ...
随机推荐
- Node基础:资源压缩之zlib
概览 做过web性能优化的同学,对性能优化大杀器gzip应该不陌生.浏览器向服务器发起资源请求,比如下载一个js文件,服务器先对资源进行压缩,再返回给浏览器,以此节省流量,加快访问速度. 浏览器通过H ...
- 模态窗口插件之Jbox
$.jBox.tip("报损数量不能大于库存数!", 'error'); $.jBox.tip("请选择要报损的产品", "warn"); ...
- 08.C# System.Nulable<T>和空引用操作符(四章4.2-4.4)
看了这3小节,发现作者讲得太详细了,把一个都在正常使用的用法说得太神密了,搞得不知是自己不懂作者的苦心,还是作者用意为之,这里给大家都简单讲下吧,太深的真心讲不下去. 1.可空类型的核心部分是Syst ...
- Bootstrap3.0学习第十七轮(JavaScript插件——模态框)
详情请查看http://aehyok.com/Blog/Detail/24.html 个人网站地址:aehyok.com QQ 技术群号:206058845,验证码为:aehyok 本文文章链接:ht ...
- jquery事件的区别
1. mouseenter 和 mouseover (mouseleave 和 mouseout) 前者鼠标进入当前元素触发,内部的子元素不会触发事件. 而后者是进入当前元素后,当前元素和内部的子元 ...
- 验证xml是否有效于.dtd文件
<html> <head> <script language="javascript"> <!-- //加载解析器对象 var xmldo ...
- iOS开发小技巧--利用苹果官方API播放视频(方法已经过时,了解一下)
- Mysql常出现的问题
1.mysql如何导入.txt文件?load data local infile 'D:\\data.txt' into table 表名 fields terminated by '\t';2.my ...
- Myeclipse报PermGen space异常的问题
最好用的方法: 1)在myeclipse中windos——>preference——>Myeclipse——>servers——>Tomcat——>JDK(Optiona ...
- SqlServer建表规范
一.数据库在建表时,一般默认字段如下,也算是标准字段吧 删除标志:DeletionStateCode 创建时间:CreateOn 创建人:CreateBy 更新时间:ModifiedOn 更新人:Mo ...