Javascript中八种遍历方法的执行速度深度对比

var array = ["囚徒","过客","领袖"];//职场3种人
var o = {0:"linda",1:"style",2:"nick",length:3};

(function(){//循环置于闭包之内
 for(var i=0,length=array.length;i<length;i++){//缓存数组长度
 console.log(array[i]);//内部方法若有可能相互影响,也要置于闭包之内
 }
})();

 do while
(function() {
 var i = 0,
 len = array.length;
 do {
 if (i == 2) {
 break; // 循环被终止, 此处如果是continue就会造成循环无法退出
 };
 console.log('array['+ i +']:' + array[i]);
 i++;//此句建议放置循环while头部
 } while(i<len);
})();

array.forEach(function(item){
 if(item=="囚徒")
 return;//这里只能使用return跳过当前元素处理
 console.log(item);
});

for(var item in array){
 console.log(item);
}//0 1 2
for(var item in o){
 console.log(item);
}//0 1 2 length

for(var item in array){
 console.log(array[item]);
}//"囚徒" "过客" "领袖"
for(var item in o){
 console.log(o[item]);
}//"linda" "style" "nick" "length"

$.each(array, function(i, ele){
 console.log(i,ele,this==ele);
});
//0 "囚徒" true
//1 "过客" true
//2 "领袖" true
$.each(o, function(i, ele){
 console.log(i,ele,this==ele);
});
//0 "linda" true
//1 "style" true
//2 "nick" true

$.each(o, function(i, ele){
 if(this=="linda"){//我们随机选取第一个属性
 console.log(this,this==ele);
 $.each(this, function(e, ele2) {
 console.log(e, ele2);
 });
 }
});
//String {0: "l", 1: "i", 2: "n", 3: "d", 4: "a", length: 5, [[PrimitiveValue]]: "linda"} true
//0 "l"
//1 "i"
//2 "n"
//3 "d"
//4 "a"

$.each(o, function(i, ele){
 if(this=="linda")//我们还是随机选取第一个属性(这还是随机吗?)
 console.log(Object.getOwnPropertyDescriptor(this, 'length'));
});
//Object {value: 5, writable: false, enumerable: false, configurable: false}

console.log(Object.getOwnPropertyDescriptor(o, 'length'));
//Object {value: 3, writable: true, enumerable: true, configurable: true}

var o = {0:"linda",1:"style",2:"nick",length:1}; // 试着改变length的值
$.each(o, function(i, ele){//再遍历一次
 console.log(i,ele);
});
//0 "linda"

var o = {0:"linda",1:"style",2:"nick",length:5}; // 坚持改变length的值
$.each(o, function(i, ele){//再遍历一次
 console.log(i,ele);
});
// 0 linda
// 1 style
// 2 nick
// length 5

var o = {0:"linda",1:"style",2:"nick"}; // 试试去掉length属性
$.each(o, function(i, ele){//再遍历一次
 console.log(i,ele);
});
// 0 linda
// 1 style
// 2 nick

$('div').each(function(i,ele){
 console.log(this,i,this == ele);
});
/https://img.qb5200.com/download-x/dom... 0 dom.... true
$(array).each(function(i,ele){//处理数组
 if(this == "领袖")
 console.log(this,i,this == ele);
});
//String {0: "领", 1: "袖", length: 2, [[PrimitiveValue]]: "领袖"} 2 true
$(o).each(function(i,ele){//处理对象
 if(this == "nick")
 console.log(this,i,this == ele);
});
//String {0: "n", 1: "i", 2: "c", 3: "k", length: 4, [[PrimitiveValue]]: "nick"} 2 true

var array = [1, 4, 9];
var roots = array.map(Math.sqrt);//map包裹方法名
// roots is now [1, 2, 3], array is still [1, 4, 9]
var array = [1, 4, 9];
var doubles = array.map(function(num) {//map包裹方法实体
 return num * 2;
});
// doubles is now [2, 8, 18]. array is still [1, 4, 9]

var elems = document.querySelectorAll('select option:checked');
var values = Array.prototype.map.call(elems, function(obj) {
 return obj.value;
});

var map = Array.prototype.map;
var array = map.call('Hello 中国', function(x) { 
 return x.charCodeAt(0);
});
console.log(array);
//[72, 101, 108, 108, 111, 32, 20013, 22269]

var str = '12345';
var output = Array.prototype.map.call(str, function(x) {
 return x;
}).reverse().join('');
console.log(output);//54321

console.log(['1', '2', '3'].map(Number));//[1,2,3]

function isBigEnough(element, index, array) {
 return element >= 10;
}
[12, 5, 8, 130, 44].every(isBigEnough); // false
[12, 54, 18, 130, 44].every(isBigEnough); // true

[12, 5, 8, 130, 44].every(elem => elem >= 10); // false
[12, 54, 18, 130, 44].every(elem => elem >= 10); // true

var array = [],
 length = array.length = 10000000;//(一千万)
//for(var i=0;i<length;i++){
// array[i] = 'louis';
//}
console.log(array[0]);
//-------------------------for
var t1 = +new Date();
for(var i=0;i<length;i++){
}
var t2 = +new Date();
console.log('for:' + (t2-t1));

//-------------------------do/while
var t1 = +new Date();
var i = 0;
do {
 i++;
} while(i<length);
var t2 = +new Date();
console.log('do while:' + (t2-t1));

//-------------------------forEach
var t1 = +new Date();
array.forEach(function(item){
});
var t2 = +new Date();
console.log('forEach:' + (t2-t1));

//-------------------------for in
var t1 = +new Date();
for(var item in array){
}
var t2 = +new Date();
console.log('for in:' + (t2-t1));

//------------------------- $.each
var t1 = +new Date();
$.each(array, function(i, ele){
});
var t2 = +new Date();
console.log('$.each:' + (t2-t1));

//-------------------------$().each
var t1 = +new Date();
$(array).each(function(i,ele){
});
var t2 = +new Date();
console.log('$(ele).each:' + (t2-t1));

//-------------------------map
var t1 = +new Date();
array.map(function(num){
});
var t2 = +new Date();
console.log('map:' + (t2-t1));

//-------------------------every
var t1 = +new Date();
array.every(function(e,i,arr){
});
var t2 = +new Date();
console.log('every:' + (t2-t1));

var array = [],
 length = array.length = 1000000;
for(var i=0;i<length;i++){
 array[i] = 'louis';
}

for ~= do while < forEach ~= map ~= every < $.each < $(e).each < for in