数组是一种特殊的对象, 是有顺序的 [{},{}] 对象数组 它的索引值最大是2^32 -1
创建数组
var arr = new Array(1, 2); // bad
但有时用来初始化一定长度的数组. new Array(10)
var arr = [1, 2]; // good 字面量let arr = [a, a + 1, a + 2] 可以是表达式: (返回值的式子,三目, 单目, 逻辑, 函数执行...)
二维数组.[,,].lengtharr[0] // 取值Array.of() 用来解决 new Array() 无法创建一个元素的数组 => es6加的工厂方法 浅拷贝数组 … and Array.from()
用于可迭代对象, 和 { }
es6加的工厂方法
Array.from() 相当于 [...'abc']
Array.from({}, (i) => i + 1)
Array.from([2,4], (i)=> i * 2) // [4, 8]
in 和 稀疏数组
let a1 = [,];a1.length 1
let a1 = [,,];a1.length 2
[1,,3].length => 3
0 in a1 false
0 in ['a'] truedelete arr[2] delete不会修改数组的length ... 有什么应用场景???
数组的属性
arr.length = 0; // 返回值是数字, 清空数组, 那为啥不直接赋值 []?
let arr = ['a', 'b', 'c']
arr.length = 1;
迭代
forEach() 能感知稀疏数组, 不会对没有的元素调用...for of 则不能
for(let [index, item] of arr.entries()){}
老式for 循环
for(let i = 0; i < arr.length; i++) {} // 实际上只读取一次arr.length
for(let i = 0, len = arr.length; i < len; i++) {}
for(let i = arr.length - 1; i >= 0; i--) {if(xx) continue
}
改变原数组7个方法
let arr = [];
arr.push('c','d') 新数组的长度 => 2
arr.pop() // 'd'
arr.unshift('a', 'b') // 3
arr.shift() // 'a'
arr.shift() // 'b'
arr.shift() // 'c'
arr.shift() // undefinedlet arr2 = ['a', 'b', 'c']; arr2.reverce(); // ['c', 'b', 'a']
arr2.splice(1, 1, 'd', 'e', 'f') // ['b'] splice 粘接
arr2.sort((a, b) => a - b ) // sort 排序
不影响原数组的3个方法
| 方法 | 描述 |
|---|---|
| slice(startIndex, endIndex) | 返回截取的数组 可以为负数 |
| arr1.concat([‘a’]) arr1.concat(‘a’) | 拼接 |
| join() join(‘’)区别 | [null,undefined,‘a’].join(‘’) // ‘a’ |
其他方法
| 方法 | 描述 |
|---|---|
| indexOf lastIndexOf | 不能判断NaN, 字符串也有这个方法 |
| forEach | 无返回值,不能break中断. 不需要return 下面的需要 (item, index, arr) |
| filter | 过滤, 可以链式… 第二个参数改变this 指向 |
| map | 映射 map第二个参数 改变this指向 |
| arr.fill(‘a’, 0, 3) | arr 要有长度才行!! |
| index in arr | 返回boolean (用得很少…因为是判断index) |
| arr.includes(‘a’) | // 同上 |
| Array.isArray(arr) | // 同上 |
| some/every // 同上 | |
| for(let i in arr) { } | // i为 index |
| entries() keys() values() | |
| compyWithin() | – |
| flat() flatMap() | – |
| at() | – |
js-数组方法reduce-到底要不要传第二个参数
要
因为
[].reduce((x, y) => {}) 报错
[3].reduce((x, y) => x + y) 预期3, 实际返回值是 [3]
arr.reduce((x, y) => x.b + y.b, { b: 0 }) 项目中可能会这么写
console.log(a.reduce((x, y) => x + y))
console.log(a.reduce((x, y) => x * y))
console.log(a.reduce((x, y) => (x > y ? x : y)))[2, 3, 4].reduceRight((x, y) => {return Math.pow(x, y)
})
- forEach不能退出 (i, index, array)
map 要 有返回值.
console.log([1, 2, 3].map((i) => i * 2)) [2, 4, 6]
console.log([{ id: 1 }, { id: 2 }].map((i) => i.id)) [1, 2]
filter 根据boolean 过滤, false 的被过滤掉
arr.filter((x) => x < 3)
arr.filter((x) => i % 2 === 0)
arr.filter(() => true) 过滤稀疏数组
[undefined, null, 3].filter((i) => i !== undefined && i !== null) [3]
find findIndex
arr.find(i => i.id === xxx) 找不的话返回undefined
arr.findIndex(i => i.id===xxx) 找不到返回-1
every 很坑
数学传统?
[].every((i) => i > 100) 因为空数组的时候, 回调并不会执行, 且返回 true
[].some((i) => i > 100) 空数组的时候, 也不会执行, 但是返回的是false
flat flatMap
es2019的方法
arr.flat() 不传的话默认一层
let arr = [1, [2, [3, [4]]]]
console.log(arr.flat()) [1, 2, Array(2)]
console.log(arr.flat(1)) [1, 2, Array(2)]
console.log(arr.flat(2)) [1, 2, 3, Array(1)]
console.log(arr.flat(3)) [1, 2, 3, 4]
console.log(arr.flat(4)) [1, 2, 3, 4]flatMap 先map 完了 flat
['hellow world', 'the definitive guide'].flatMap(i => i.split(' ')) ['hellow', 'world', 'the', 'definitive', 'guide']
[-2, 2, [], []].flatMap(i => i) [-2, 2]
[-2, 2].flatMap((i) => (i < 0 ? [] : Math.sqrt(i))) [1.4142135623730951]
concat 拼接 不改变原数组
[1].concat(2) [1, 2]
[1].concat([2]) [1, 2] 它会打平一次数组....
[1].concat(2,3,[4,[5]]) [1, 2, 3, 4, Array(1)]
参考资料
- Array 对象 - JavaScript 教程 - 网道 (wangdoc.com)
- 数组的扩展 - ECMAScript 6入门 (ruanyifeng.com)
- javascript权威指南(第四版)
