Array

1. 静态方法

可以直接通过 Array.方法名调用，故为静态方法

转化方法
- 把 json 对象转换成数组
```
Array.from(json对象);
```
参数要满足：key 必须是 0，1，2（数字或字符串均可），还有 length，比如类数组 arguments 对象就很合适
- 把一堆独立的数字，字符串或变量，合成数组
```
Array.of(数字1，字符串1，数字2，变量1....)
```
判断方法
- 判断是否为数组
```
const bool = Array.isArray(arr);
```

2.原型方法

是通过Array.prototype.方法名挂载上去的，故为原型方法

需要用过数组.方法名来调用

ES5 之前

会影响数组内部元素

添加与删除
- 尾部添加多个元素，返回操作后数组的 length
```
length = 数组.push(elem1,elem2...)
```
- 删除尾部最后一个元素，并返回此元素
```
last = 数组.pop();
```
- 头部添加多个元素，返回操作后数组的 length
```
length = 数组.unshift(elem1,elem2...)
```
- 删除头部第一个元素，并返回此元素
```
first = 数组.shift();
```
整个操作
- 删除某位置开始的 n 个元素，且可添加新元素补充进去，返回被删除的元素
```
数组.splice(开始删除处的索引，要删除的元素数目，elem1，elem2...)
```
- 把数组元素颠倒，不仅自身变化，同时会返回颠倒后的结果
```
const rev = 数组.reverse();
```
- 排序，如果不加参数，将按照字符编码顺序，不仅自身变化，同时会返回排序后的结果
```
const sor = 数组.sort(比较函数);
//比较函数有两个参数a和b
//若返回大于0，代表a应该在b的前面
```
  - 注意：对数字排序不可靠，所以要给函数按算术大小排序
```
userArray.sort((a, b) => b - a);
```
  - 例子：中文按拼音排序
```
userArray.sort(function (a, b) {
  return a.localeCompare(b);
});
```

不影响内部数组元素（仅访问）

concat
- 链接多个数组，返回链接后的一个新数组
```
const combine  = 数组.concat(array1, array2...）
```
slice
- 返回选定位置的数组元素，包括 begin 但不包括 end
```
const part = 数组.slice(begin[, end])
```
join
- 给定分隔符，拼接数组中的元素，返回拼接后的字符串
```
const str = 数组.join(分隔符);
```

ES5 加入的新方法

不影响内部数组元素（仅访问）

查找
- 从头部的 fromIndex 处开始向后找，返回第一个找到的索引号，找不到则返回-1
```
数组.indexOf(要查的元素[, fromIndex])
```
- 从尾部的 fromIndex 处向前开始找，返回第一个找到的索引号，找不到则返回-1
```
数组.lastIndexOf(要查的元素[, fromIndex])
```
- 注意：对 NaN 会有强对比误判，谨慎使用，更推荐用新的.includes
迭代
- forEach 遍历数组，在 callback 函数中做处理，函数有三个参数：velue，index，array
```
数组.forEach(callback，提供callback的新this指向)
```
  - 注意:
    - forEach 无法通过 break 来中断遍历，只能用 try 方法抛出异常来中断跳出
    - 也不能用 return，因为只是从某一个 callback 中返回，还是会继续执行
  - 这里第二个参数要留意，仅在普通函数时提供有效，箭头函数的 this 是被固定的
- map 遍历数组，在 callback 函数中对每个元素做相同运算，并最终返回一个新数组，来表达所有运算后的结果
```
const newArray = 数组.map(callback，提供callback的新this指向)
```
  - 注意:
    - 使用 map 时一定要记得在 callback 中进行显式 return，否则最终返回的就是全 undefined 数组
- filter 遍历数组，在 callback 函数中对每个元素做相同筛选，函数如果返回 true，就留下此元素，最终返回一个新数组，来表达所有留下的元素
```
const newArray = 数组.filter(callback，提供callback的新this指向)
```
- every 遍历数组，在 callback 函数中对每个元素做判断，只有每个元素都返回 true，最终结果才为 true
```
const bool = 数组.every(callback，提供callback的新this指向)
```
- some 遍历数组，在 callback 函数中对每个元素做判断，一旦有一个元素返回 true，最终结果就是 true
```
const bool = 数组.some(callback，提供callback的新this指向)
```
  - 如果数组为空，那永远返回 false
  - 只会在被赋值的数组项上调用 callback
- reduce 遍历数组，在累加器函数中做处理，total 是总值，currentValue 是每次迭代的元素值，currentIndex 是每次迭代的索引值，initialValue 是第一次迭代开始的初始值（可不写，默认 0），最终返回累加器处理完的总值
```
result = 数组.reduce(累加器函数(total, currentValue, currentIndex, arr){ }, initialValue)

//还有反向遍历数组，在累加器函数中做处理
数组.reduceRight()
```

ES6 加入的新方法

会影响数组内部元素

整个操作
- 从外部填充数据到某段位置
```
数组.fill(替换数据源，开始替换的位置，结束替换的位置)
```
  - 比如[1, 2, 3, 4, 5, 6].fill('a', 2, 4)
    - 表示把 a 填到 2 号位和 3 号位，不包括 4 号
    - 本质是填充到原有位置
    - 结果是[1, 2, 'a', 'a', 5, 6]
- 用自身填充数据到某段位置
```
数组.copyWithin(开始替换的位置，替换数据源的开始位置，替换数据源的结束位置)
```
  - 参数
    - 参数 2 可选，默认为 0，可用负值表示从最后一个（-1）开始数
    - 参数 3 可选，默认为数组长度，直到无法读为止
  - 比如[1, 2, 3, 4, 5].copyWithin(0, 3)
    - 表示把 3 号位开始的 4,5 替换到 0 号位,1 号位去
    - 结果是[4, 5, 3, 4, 5]

不影响内部数组元素（仅访问）

查找
- 从头部开始向后找，条件语句返回 true 则代表符合，直接返回值
```
数组.find(function (value, index, arr) {
  return 条件语句;
});
```
- 从头部开始向后找，条件语句返回 true 则代表符合，直接返回索引
```
数组.findIndex(function(value, index, arr
    return 条件语句
})
```
- 从头部的 fromIndex 处开始向后找，返回布尔值，表示是否找到
```
数组.includes(要查的元素[, fromIndex])
```
  - 修复了 indefOf 中对 NaN 的强对比误判
    - 比如[1, 2, NaN].indexOf(NaN);会返回-1，是有问题的
    - 而[1, 2, NaN].includes(NaN);会返回 true，没问题
遍历方法
- 遍历值
```
for(let item of arr)
//等价于
for(let item of arr.values())
```
- 遍历键
```
let arr = [1, 2, 3];
for (let index of arr.keys()) {
  console.log(index);
}

for (let index in arr) {
  console.log(index);
}
```
  - 不建议用 for in 去遍历键，因为会把原型上的属性和方法都遍历出来(一般是没有的，多出现在你对 arr 进行了其他属性或原型方法赋予)，除非你愿意在内部用 hasOwnPropery 做过滤
- 遍历键值对
```
for(let [index, value] of arr.entries())
```

ES6 之后的方法

不影响内部数组元素

扁平化方法

把数组按指定维度降维，进而扁平化

数组.flat(维度);

维度如果不给，默认是 1，只会降低 1 维

例子

let result = ["1", ["2", ["3", ["4"]]]].flat();
console.log(result); // [ '1', '2', [ '3', ['4'] ] ]

如果想完全扁平，维度可以填Infinity

例子

let result = ["1", ["2", ["3", ["4"]]]].flat(Infinity);
console.log(result); //  ['1', '2', '3', '4']

在 map 的同时，把结果进行扁平化处理

数组.flatMap((item) => 对每个元素的操作返回);

例子

仅用 map

let result = ["My name", "is Tom"].map((item) => item.split(" "));
console.log(result); // [['My', 'name'], ['is', 'Tom']]

用 flatMap

let result = ["My name", "is Tom"].flatMap((item) => item.split(" "));
console.log(result); // ['My', 'name', 'is', 'Tom']

Keyboard shortcuts