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);
});