本系列作为Effective JavaScript的读书笔记。

ECMAScript标准并没有规定对JavaScript的Object类型中的属性的存储顺序。

可是在使用for..in循环对Object中的属性进行遍历的时候,确实是须要依赖于某种顺序的。

正由于ECMAScript没有对这个顺序进行明白地规范,所以每一个JavaScript运行引擎都可以依据自身的特点进行实现。那么在不同的运行环境中就不能保证for..in循环的行为一致性了。

比方,下面代码在调用report方法时的结果就是不确定的:

function report(highScores) {
var result = "";
var i = 1;
for (var name in highScores) { // unpredictable order
result += i + ". " + name + ": " +
highScores[name] + "\n";
i++;
}
return result;
}
report([{ name: "Hank", points: 1110100 },
{ name: "Steve", points: 1064500 },
{ name: "Billy", points: 1050200 }]);
// ?

假设你确实须要保证执行的结果是建立在数据的顺序上,优先使用数组类型来表示数据,而不是直接使用Object类型。同一时候。也尽量避免使用for..in循环,而使用显式的for循环:

function report(highScores) {
var result = "";
for (var i = 0, n = highScores.length; i < n; i++) {
var score = highScores[i];
result += (i + 1) + ". " +
score.name + ": " + score.points + "\n";
}
return result;
}
report([{ name: "Hank", points: 1110100 },
{ name: "Steve", points: 1064500 },
{ name: "Billy", points: 1050200 }]);
// "1. Hank: 1110100\n2. Steve: 1064500\n3. Billy: 1050200\n"

还有一个特别依赖于顺序的行为是浮点数的计算:

var ratings = {
"Good Will Hunting": 0.8,
"Mystic River": 0.7,
"21": 0.6,
"Doubt": 0.9
};

在Item 2中。谈到了浮点数的加法操作甚至不能满足交换律:

(0.1 + 0.2) + 0.3
的结果和 0.1 + (0.2 + 0.3)的结果各自是

0.600000000000001
和 0.6

所以对于浮点数的算术操作,更加不能使用随意的顺序了:

var total = 0, count = 0;
for (var key in ratings) { // unpredictable order
total += ratings[key];
count++;
}
total /= count;
total; // ?

当for..in的遍历顺序不一样时,最后得到的total结果也就不一样了。下面是两种计算顺序和其相应的结果:

(0.8 + 0.7 + 0.6 +0.9) / 4 // 0.75

(0.6 + 0.8 + 0.7 +0.9) / 4 // 0.7499999999999999

当然,对于浮点数的计算这一类问题,有一个解决方式是使用整型数来表示,比方我们将上面的浮点数首先放大10倍变成整型数据。然后计算结束之后再缩小10倍:

(8+ 7 + 6 + 9) / 4 / 10
   // 0.75

(6+ 8 + 7 + 9) / 4 / 10
   // 0.75

总结:

  1. 在使用for..in循环时。不要依赖于遍历的顺序。
  2. 当使用Object类型来保存数据时,须要保证当中的数据是无序的。
  3. 当须要表示带有顺序的集合时。使用数组类型而不是Object类型。

Effective JavaScript Item 46 优先使用数组而不是Object类型来表示有顺序的集合的更多相关文章

  1. Effective JavaScript Item 31 优先使用Object.getPrototypeOf,而不是__proto__

    本系列作为Effective JavaScript的读书笔记. 在ES5中引入了Object.getPrototypeOf作为获取对象原型对象的标准API.可是在非常多运行环境中.也提供了一个特殊的_ ...

  2. Effective JavaScript Item 51 在类数组对象上重用数组方法

    Array.prototype对象上的标准方法被设计为也能够在其他对象上重用 - 即使不是继承自Array的对象. 因此,在JavaScript中存折一些类数组对象(Array-like Object ...

  3. Effective JavaScript Item 49 对于数组遍历,优先使用for循环,而不是for..in循环

    本系列作为Effective JavaScript的读书笔记. 对于以下这段代码,能看出最后的平均数是多少吗? var scores = [98, 74, 85, 77, 93, 100, 89]; ...

  4. Effective JavaScript Item 40 避免继承标准类型

    本系列作为Effective JavaScript的读书笔记. ECMAScript标准库不大.可是提供了一些重要的类型如Array,Function和Date.在一些场合下.你或许会考虑继承当中的某 ...

  5. Effective JavaScript Item 21 使用apply方法调用函数以传入可变參数列表

    本系列作为Effective JavaScript的读书笔记. 以下是一个拥有可变參数列表的方法的典型样例: average(1, 2, 3); // 2 average(1); // 1 avera ...

  6. Effective JavaScript Item 10 避免使用with

    本系列作为Effective JavaScript的读书笔记. Item 9:避免使用withkeyword 重点: 设计withkeyword本来是为了让代码变简洁,可是却起到了相反的效果.比方: ...

  7. Effective JavaScript Item 39 绝不要重用父类型中的属性名

    本系列作为Effective JavaScript的读书笔记. 假设须要向Item 38中的Actor对象加入一个ID信息: function Actor(scene, x, y) { this.sc ...

  8. Effective JavaScript Item 22 使用arguments来创建接受可变參数列表的函数

    本系列作为Effective JavaScript的读书笔记. 在Item 21中,介绍了结合apply方法实现的可变參数列表函数average,它实际上仅仅声明了一个数组作为參数,可是利用apply ...

  9. Effective JavaScript Item 37 认识this的隐式指向

    本系列作为Effective JavaScript的读书笔记. CSV数据通常都会被某种分隔符进行分隔.所以在实现CSV Reader时,须要支持不同的分隔符.那么,非常自然的一种实现就是将分隔符作为 ...

随机推荐

  1. 代理(Proxy)模式简介

    一.代理(Proxy)模式简介 代理模式是结构型模式. 代理模式给某一个对象提供一个代理对象,并由代理对象控制对原对象的引用. 代理对象要继承于抽象主题,并控制原对象的引用 二.简单例子 抽象主题类 ...

  2. 算法笔记_192:历届试题 买不到的数目(Java)

    目录 1 问题描述 2 解决方案   1 问题描述 问题描述 小明开了一家糖果店.他别出心裁:把水果糖包成4颗一包和7颗一包的两种.糖果不能拆包卖. 小朋友来买糖的时候,他就用这两种包装来组合.当然有 ...

  3. PHP中静态方法(static)与非静态方法的使用及区别

    今天再次学习这个内容,总是糊里糊涂的,想弄明白!!! static关键字用来修饰属性.方法,称这些属性.方法为静态属性.静态方法.static关键字声明一个属性或方法是和类相关的,而不是和类的某个特定 ...

  4. 解决document.location.href下载文件时中文乱码

    1:tomcat 安装路径下 找到 conf文件下的server.xml 2:<Connector port="8080" URIEncoding="utf-8&q ...

  5. visudo精确用户赋权(sudo)

    原文BLOG:http://iminmin.blog.51cto.com/689308/455992 sudo" 是Unix/Linux平台上的一个非常有用的工具,允许为非根用户赋予一些合理 ...

  6. servlet 多线程

    servlet在服务器中只有一个实例,那么它响应请求的方式应该是多线程. 一,servlet容器如何同时处理多个请求. Servlet采用多线程来处理多个请求同时访问,Servelet容器维护了一个线 ...

  7. OpenWrt设置访客网络Guest Wi-Fi

    参考 https://wiki.openwrt.org/doc/recipes/guest-wlan-webinterface 1. 在2.4GHz Wireless Controller下, 创建访 ...

  8. Ubuntu的一些小技巧, 备忘

    Ubuntu下打开Scroll Lock键盘灯 一直以为灯坏了, 后来发现在win7下工作正常... 原来是跟系统有关系的. 在Ubuntu18.04下可以通过这个命令开关Scroll Lock灯 # ...

  9. JavaScript中的继承与原型链

    先看一个例子 function User(){} var u1 = new User(); console.log(u1.prototype);// undefined 使用对象实例无法访问到prot ...

  10. 兼容火狐,ie8的 js urlencode和urldecode

    function UrlEncode(str)//url编码{ var i,temp,p,q; var result=""; for(i=0;i<str.length;i++ ...