js、jq周遊數組和對象

js周遊數組

1.普通for循環

var arr = [1,4,45,34,12,45,56,8];
for ( var i = 0; i <arr.length; i++){
    console.log(arr[i]);
};
           

2.優化的for循環：将數組的長度存儲起來，避免重複擷取長度，數組越大時優化效果越明顯

var arr = [1,4,45,34,12,45,56,8];
var len = arr.length;
for ( var i = 0; i <len; i++){
    console.log(arr[i]);
};
           

3.使用for...in,但是數組的周遊中千萬不要用for in，該方法一般對對象的周遊使用。下面例子中的index變量類型是string，并不是number。

var arr = [1,4,45,34,12,45,56,8];
for(var index in arr){
    console.log(typeof index);//string
    console.log(index+"--"+arr[index]); 
};
           

4.使用for...of，性能較好

var arr = [1,4,45,34,12,45,56,8];
for(var value of arr){
    console.log(value);
};
           

5.使用forEach，自帶循環功能

forEach循環的缺點就是：不能使用break語句中斷循環，也不能使用return傳回到外層函數。

var arr = [1, 4, 45, 34, 12, 45, 56, 8];
arr.forEach(function (value, index) { // 第一參數是值,第二個參數是索引
    console.log(index + "--" + value);
});
           

6.使用map，和forEach的文法一樣，性能比forEach好

map周遊數組方式支援return，并且傳回一個新的數組。

var arr = [1, 4, 45, 34, 12, 45, 56, 8];
var newArr = arr.map(function (value, index) {// 第一參數是值,第二個參數是索引
    console.log(index + "--" + value);
    return value += 1;
});
console.log(newArr);// [2, 5, 46, 35, 13, 46, 57, 9]
           

js周遊對象

1.for...in周遊

var obj = {
    name: "張三",
    age: 18,
    sex: "男"
};
for (var key in obj) {
    console.log(key+":"+obj[key]);
};
           

jq周遊數組和對象

1.$.each周遊數組

var arr = [1, 4, 45, 34, 12, 45, 56, 8];
$.each(arr, function (index, value) {//第一個參數是索引，第二個參數是值
    console.log(index + "--" + value);
});
           

2.$.each周遊對象

var obj = {
    name: "張三",
    age: 18,
    sex: "男"
};
$.each(obj, function (key, value) {//第一個參數是鍵，第二個參數是值
    console.log(key + ":" + value);
});