本文的内容 api 办法较多，千万，千万，千万，千万，千万，别死记硬背。没有任何作用，反而减轻你学习的累赘，碰到有适合的场景能够查 api 来应用。

又是一篇根底文章，为什么要这么强调根底呢？在之前的面试中，发现好多面试者将精力放到了框架、类库上。对于根底的货色浅尝辄止。殊不知这样学习如同背道而驰。学不好根底怎么能将更高级的货色理解透彻呢。

文章意为让大家进步对基础知识的认知，更好的学习，更快的学习。很多时候你会发现一个问题，编程的常识都是互通的，一通则百通。所以呢？还是底层，还是根底。地基之深厚，方能使常识的大厦耸立不倒。

一不小心废话又多了，请置信我，根底写完之后，肯定会有进阶知识点。怎么样，期待不。????

闲言少叙，明天咱们来认识一下数组这个货色。

every body，开始咱们的表演……

1. 惯例操作

数组是在内存中 间断存储数据 的容器，形如你看到的酒店房间、火车、教室……都是间断的。

数组的特点是 减少、删除慢，更新快。为什么这么说呢？

因为在数组中增加和删除元素，会将前面的元素顺次后移或者前移。

小栗子上场

const arr = [1,2,3,4]

// 增加元素
arr.push(0) // 会将 4，3，2，1 别离向后挪动一位，给 0 这个新元素腾出地位

// 删除元素
arr.shift() // 删除后，因为第一位空出，所以会将前面的元素顺次前移。// 更新元素
arr[0] = 10 // 只批改第一个元素，不影响其余

总结：

• 每次减少和删除元素都会同时操作前面的元素
• 更新不会影响其余元素，只会影响以后元素

上面这个表格具体的形容了每一个罕用办法的性能和应用。敬请查阅。

1.1 小文档：

1.2 小示例：

像 pop、unshift、shift、索引批改、索引查问 这几种办法都是罕用办法，不用太过多说。

其余办法应用时的留神点：

1. push

let arr = [1,2,3]

// 减少单个元素
arr.push(4) // [1,2,3,4]

// 增加多个元素
arr.push(5,6) // [1,2,3,4,5,6]

// 减少数组
arr.push([7,8]) // [1,2,3,4,5,6,[7,8]]

阐明：push增加数组时，会将数组作为一个元素增加到原数组中，最终失去一个 多维数组

2. concat

let arr = [1,2,3]

// 拼接一个元素
arr.concat(4) // [1,2,3,4]

// 拼接多个元素
arr.concat(5,6) // [1,2,3,4,5,6]

// 拼接数组
arr.concat([7,8]) // [1,2,3,4,5,6,7,8]

阐明：concat拼接数组时，会将数组里的每一项独自增加到原数组中。

3. slice

let arr = [1,2,3]

// 只传一个参数，从以后地位始终裁剪到数组开端
arr.slice(0) // [1,2,3]

// 传两个参数，从第一个的地位裁剪到最初一个的地位，蕴含起始地位，不蕴含完结地位
arr.slice(0,1) // [1]

// 若第二个参数大于第一个参数。截取为空
arr.slice(1,0) // []

阐明：slice 的两个参数都能够接管 正数 ， 正数 的意义为从后向前查找，所起的作用和代码中雷同。

4. sort

let arr = [1,2,3]

// 正序排列
arr.sort((a,b) => a - b)

// 倒序排列
arr.sort((a,b) => b - a)

阐明：sort 可接管一个排序函数作为参数，正序为 参数 1 - 参数 2 ，倒序为 参数 2 - 参数 1

5. join

let arr = [1,2,3]
// 元素之间可应用指定的连接符连贯
arr.join('-') // 1-2-3
arr.join('=') // 1=2=3
……

6. splice

let arr = [1,2,3]

// 任意地位新增
arr.splice(0,0,'11') // ['11',1,2,3]

// 任意地位删除
arr.splice(0,1) // [1,2,3]

// 任意地位替换任意个数的元素
arr.splice(1,2,4,5,6) // [1,4,5,6]

阐明：splice(索引地位，批改个数，新数据 1，新数据 2，新数据 3，……)

• 批改个数为 0，示意新增
• 新数据个数为 0，示意删除
• 其余状况为，从索引地位开始，向后查找 批改个数 个元素，批改为后边所有的新数据。

2. 骚操作（进阶操作）

说完了根底，怎么能不进阶呢。就像你吃腻了家常便饭，怎么也得来点儿大鱼大肉吧。

接下来，就是满汉全席的时刻~~~

1. 应用 from 创立数组

const arr = [1,2,3];

// 通过 arr 创立新数组。const arr1 = Array.from(arr);

// 创立新数组，并且独自解决每一项
const arr2 = Array.from(arr, item => item * 2)

// 创立定长数组并应用 0 填充
const arr3 = Array.from({length: 10}, () => 0)

留神：

from 可接管第二个参数，能够将每一项通过运算，并返回解决后的数组。

2. 扁平化数组 flat

[[1,2]].flat()
[[1,2]].flat(1)
[[[[[[1,2]]]]]].flat(Infinity)

留神：

• flat 可接管一个参数，为扁平化的层级
• 如果传入 Infinity 则表明，不论数组有多少层。它都能给扒光。

3. 去重解决 new Set()

let arr = [1,1,2,2,3,3,4,4,5,5,6,6]
arr = [...new Set(arr)] // [1,2,3,4,5,6]

留神：

• set 是一种不蕴含反复元素的汇合。能够通过数组创立
• 利用 set 的去重个性，过滤一遍数组，失去的就是不蕴含反复元素的数组

4. 数组排序 sort — 数组乱序 – 0.5

[3,2,1].sort((a,b) => a - b) // 正序
[3,2,1].sort((a,b) => b - a) // 倒序

// 创立一个乱序的数组
[1,2,3,4,5,6,7,8,9,10].sort(() => Math.random() - 0.5)

留神：

• sort接管一个函数作为排序函数。函数返回 负数 为正序，正数 为倒序，0 为相等
• 应用随机数，能够不确定的返回 负数、正数和 0 。也就会失去一个乱序的数组

5. 最大和最小值 Max 和 Min

Math.max(...[1,2,3,4,5]) // 5
Math.min(...[1,2,3,4,5]) // 1

留神：

• max和 min 函数只接管参数，不能承受数组。所以要将数组中的元素开展传入。

6. 数组解决高阶函数 reduce、map、filter、some、every、forEach、fill

（这可是个大活儿。）

// reduce 聚合
[1,2,3,4].reduce((pre, next, index, array) => pre + next)
[1,2,3,4].reduce((pre, next, index, array) => pre + next, 0) // 第二个参数为默认值

// map 遍历解决
[1,2,3,4].map((item, index, array) => item * 2) // [2,4,6,8]

// filter 过滤
[1,2,3,4].filter((item, index, array) => item > 2) // [3,4]

// some 局部符合条件
[1,2,3,4].some((item, index, array) => item === 1) // true
[1,2,3,4].some((item, index, array) => item === 5) // false

// every 全副符合条件
[1,2,3,4].every((item, index, array) => item === 1) // false
[1,1,1].every((item, index, array) => item === 1) // true

// forEach 遍历
[1,1,1].forEach((item, index, array) => console.log(item))

// fill 填充
new Array(10).fill(value, start, end)
new Array(10).fill(1, 0, 2) // [1,1,,,,,,,,]

留神：

入参函数的参数阐明：

1. map、filter、some、every、forEach 这几个函数的参数是一样的，都是(item, index, array)。

   • item 是以后操作的元素
   • index 是以后的索引值
   • array是操作的数组自身。

2. reduce((pre, next, index, array) => {}, defaultValue)

   • pre是以后操作的后果
   • next为下一个要操作的元素。
   • index 是以后的索引值
   • array是操作的数组自身
   • defaultValue为默认值

3. fill(value, start, end)

   • value为填充的值
   • start为开始地位（蕴含）
   • end为完结地位（不蕴含)

7.includes、indexOf、lastIndexOf、find、findIndex

// 是否蕴含 includes
[1,2,3,4].includes(4) // true
[1,2,3,4].includes(5) // false

// 查找首次呈现的地位 indexOf
[1,2,3,4].indexOf(3) // 2

// 查找最初一次呈现的地位 lastIndexOf
[1,2,3,4].lastIndexOf(3) // 2

// 查找元素 find
[1,2,3,4].find(item => item === 3) // 3
               
// 查找元素的索引
[1,2,3,4].findIndex(item => item === 3) // 2

留神：

这几个办法没什么可留神的，会应用就 ok 了。????????????

8.Array.isArray

// 判断是不是数组
const arr = 1
Array.isArray(arr) // false
Array.isArray([]) // true

9. 数组解构

const arr = [1,2,3,4,5,6]
const [a,,b,...c] = arr // 将 0 赋值给 a。将 3 赋值给 b。将 4,5,6 作为一个数组赋值给 c

// 小技巧：// 通过解构替换两个值
let a = 1
let b = 2
[a, b] = [b, a]
console.log(a, b) // 2, 1

10. 开展操作符

const arr = [1,2,3]
console.log(arr) // [1,2,3]
console.log(...arr) // 1,2,3

留神：

是将数组中的每个元素做开展解决。

吼吼吼，终于看完了，见底了，记住，千万别死记硬背哟。（连忙劳动劳动，看到这里的你，必定脑子累的不行不行的。）