ES5中数组有多少种遍历的方法
JS中遍历的方法
- for (针对于数组遍历)- 写法繁琐,但支持break和continue
- forEach (针对于数组遍历)- 写法简洁,但不支持break和continue
- every (针对于数组遍历)- 向下遍历时需要返回true,若不返回true则相当于break【故可以支持break和continue的概念】
- for-in (针对于对象遍历)- 由于数组也是对象,故若无故给数组了对应的属性值,则也会通过for-in遍历出来。且for-in是可以使用break和continue的,但是for-in的index是string类型
- 实例代码
let array = [1, 2, 3, 4, 5]
for (let i = 0; i < array.length; i++) {
console.log(array[i])
}
array.forEach((item) => console.log(item))
array.forEach((item) => {
console.log(item)
return true
})
array.name = 'Jack'
for (let index in array) {
console.log(index, array[index])
}
ES6中数组有多少种遍历的方法
- for-of (可以遍历数组/对象/其他自定义数据结构) - 直接输出item内容,且不会遍历出数组的属性
- 实例代码
for (let item of array) {
console.log(item)
}
const Price = {
A: [1.5, 2.3, 4.5],
B: [3, 4, 5],
C: [0.5, 0.8, 1.2]
}
for (let key in Price) {
console.log(key, Price[key])
}
Array.from(如何将伪数组转换成数组)
什么是伪数组
- 伪数组是具有数组的特性但不能直接调用数组的方法,如arguments不具有slice方法等等
- 当对象按照索引方式存储数据;具备length属性时这个对象就是伪数组 -> 即 {0: ‘a’, 1: ‘b’, length:2}
ES5将伪数组转换成数组
function test1 () {
let args = [].slice.call(arguments)
}
ES6将伪数组转换成数组
function test2 () {
let args = Array.from(arguments)
}
实际Array.from的参数与应用举例
let array = Array.from({ length: 5 }, () => 1)
console.log(array)
Array.of-fill
ES5创建新数组的方法
let array1 = Array(5)
let array2 = []
ES6创建新数组的方法
Array.from(...)
Array.of(...)
Array.fill(...)
let array3 = Array.from({ length: 5 })
let array4 = Array.of(1, 2, 3, 4, 5)
console.log(array4)
let array5 = Array(5).fill(7)
console.log(array5)
Find & FindIndex(如何查找数组)
let array = [1, 2, 3, 4, 5]
let find1 = array.filter((item) => item === 3)
console.log(find1)
let find2 = array.find((item) => item === 3)
console.log(find2)
let find3 = array.findIndex((item) => item === 3)
console.log(find3)
ES5的数组查找API
ES6的数组查找API
- find - 返回数组中满足条件的第一个元素
- findIndex - 返回数组中满足条件的第一个元素的下标