遍历数组

31次阅读

共计 1710 个字符,预计需要花费 5 分钟才能阅读完成。

方法 1 — for

var arr = [1,2,3,4,5,6,7,8,9]
for(var i = 0; i<arr.length;i++){console.log(arr[i])
}

方法 2 — for…in

var arr = [1,2,3,4,5,6,7,8,9]
for(var i in arr){console.log(arr[i])
    conosle.loh(arr[i] + '/' + i) // 还可以添加新属性
}

方法 3 — for…of

var arr = [1,2,3,4,5,6,7,8,9]
for(var i of arr){console.log(i)
}

for…in 和 for…of 两者的主要区别在于他们的迭代方式
推荐
在循环对象属性的时候使用 for in
在遍历数组的时候使用 for of

  • for…in 循环出来的是 key, for…of 循环出来的是 value
  • for…in 是 ES5 标准,for…of 是 ES6 标准,兼容性可能存在些问题,请注意使用
  • for…of 不能遍历普通的对象,需要和 Object.keys() 搭配使用

方法 4 — forEach

/* forEach 方法:被传递给 forEach 的函数会在数组的每个元素上执行一次,元素作为参数传递给该函数 */

var arr = [1,2,3,4,5,6,7,8,9]
arr.forEach(function(element,index){console.log(element)
    console.log(element + '/' + index)
})

【!注意!】未赋值的值是不会在 forEach 循环迭代的,但是手动赋值为 undefined 的元素是会被列出的

var arr = [1,,3,undefined,5,6,7,8,9]
arr.forEach(function(element,index){console.log(element + '/' + index)
})

方法 5 — map

map 遍历数组,并通过 callback 对数组元素进行操作,并将所有操作结果放入数组中并返回该数组

var arr = [1,2,3,4,5,6,7,8,9]
var arr2 = arr.map(function(item){console.log(item)
 })

方法 6 — filter

filter()返回一个包含所有在回调函数上返回为 true 的元素新数组,回调函数在此担任的是过滤器的角色,当元素符和条件,过滤器就返回 true, 而 filter 则会返回所有符合过滤条件的元素

var arr = ['aaa','bbb','ccc',1,2,3]

var arr2 = arr.filter(function(item){if(typeof item == 'number'){return item;}
})
console.log(arr2);

方法 7 — every

every() 当数组中的每一个元素在 callback 上被返回 true 时就返回 true(注意:要求每一个单元项都返回 true 时才为 true)

var arr = ['aaa','bbb','ccc',1,2,3]

var bol = arr.every(function(element){if(typeof element == 'string'){return element;}
})
console.log(bol); //false

every()与 filter()的区别是:后者会返回所有符合过滤条件的元素;前者会判断是不是数组中的所有元素都符合条件,并且返回的是布尔值

方法 8 — some

some()只要数组中有一项在 callback 上就返回 true

var arr = ['aaa','bbb','ccc',1,2,3]

var arr = ["first","second",'third' ,"fourth",3,5,8];
var bol = arr.some(function(element){if(typeof element == 'string'){return element;}
})
console.log(bol); //true

every()与 some()的区别是:前者要求所有元素都符合条件才返回 true, 后者要求只要有符合条件的就返回 true

正文完
 0