数组声明
数组是多个变量值的结合，是Array对象的实例，所以可以像对象一样调用方法。
创建数组
使用对象方式创建数组。
使用字面量方式简单创建数组。
Array.of
当使用对象创建数组时，如果只想要一个值可用Array.of进行创建，否则创建的是一个长度为填入值的空数组。
多维数组
数组中可以包含多个数组，这被称为多维数组。
如下示例，创建出一个二维数组。
const声明
由于数组是引用类型，以使用const声明并修改其中的值不会抛出异常。
但是并不推荐这样做。
基本操作
长度获取
使用length可获取数组长度。
类型检测
使用Array对象提供的isArray()方法来判断一个对象是否为数组类型。
类型转换
数组转字符串
大部分数据类型都可以使用toString() 函数转换为字符串。
、
还可以使用String()将数组对象进行包裹实现转换。
使用join()方法拼接合并出字符串。
类数组转数组
可通过Array.from()将类数组转为数组，类数组是指具有length属性或为可迭代对象。
参数1：要转换的类数组
参数2：类似于
map()的回调函数，对元素挨个挨个做操作
以下示例将展示把DOM对象的NodeList转换为数组进行操作的过程。
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Documenttitle>
head>
<body>
<div>d1div>
<div>d2div>
<div>d3div>
<div>d4div>
body>
<script>
"use strict";
let ele_list = document.querySelectorAll("div");
Array.from(ele_list, function (ele) {
console.log(ele.innerHTML); // d1 d2 d3 d4
})
script>
html>
... 展开语法与类数组转换
...语法是非常强大的一种语法，类似于Python中的*柴博语法，可将元素单一拆出。
我们使用[...对象]即可将类数组的元素全部添加进数组中，且可以调用数组的方法对其中元素进行操作。
以下示例将演示使用[...NodeList]将 DOM的NodeList类数组转换为数组再使用map()方法对其中元素进行操作。
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Documenttitle>
head>
<body>
<div>d1div>
<div>d2div>
<div>d3div>
<div>d4div>
body>
<script>
"use strict";
let ele_list = document.querySelectorAll("div");
[...ele_list].map(function (ele) {
console.log(ele.innerHTML); // d1 d2 d3 d4
})
script>
html>
展开语法
数组合并
为一个数组添加另一个数组中的元素，可使用...展开语法，但是我个人并不推荐这么做，在运行效率上来说会有略微的降低。
函数传参
...语法代替了arguments来接收任意数量的位置传参。
arguments可接收任意数量的位置传参，但是形参名只能是arguments，但...语法可以跟上任意形参名
节点转换
上面已经介绍过...语法与类数组转换，这里不再详细举例。
解构赋值
解构是一种更简洁的赋值特性，可以理解为分解一个数据的结构
建议使用
var/let/const声明，如果在严格模式下不使用声明会抛出异常
基本使用
严格按照语法，解构接收变量必须由[]包裹，并且一定不要忘记前面的声明。
... 接收全部
可以使用...语法来接收余下的全部变量。
占位使用
某些变量不想获取，可使用_作为变量名进行占用，这在很多编程语言中都是通用的，或者直接使用,将它舍弃掉。
函数参数
可以使用结构赋值的特性，让函数的形参接收到数组实参传递进的元素。
当然我们也可以为形参的接收变量设定默认值。
索引使用
索引index总是从0开始，数组中最后一位元素的索引为length-1
语法介绍：数组对象[index]
尽量不要使用索引进行数组对象的操作，因为被操作的元素可能会出现undefined的情况造成误判。
获取单元素
使用索引index来获取单一元素。
获取最后一位元素。
获取倒数第二位元素。
增加单元素
如果增加的元素索引大于数组索引，那么之前的未定义索引位置上的元素都会用undefined进行占位。
修改单元素
直接使用index进行操作即可，如果操作的index元素为undefined或者不存在，则相当于增减单元素。
删除单元素
使用delete配合索引来删除单个元素，被删除的元素在数组中依旧会用undefined进行占位。
管理元素
push
属于栈方法，将元素压入数组尾部。
可以理解为追加元素至数组尾部。
unshift
属于栈方法，将元素压入数组头部。
可以理解为添加元素至数组头部。
shift
属于栈方法，将数组第一个元素弹出。
返回值为弹出的元素。
pop
属于栈方法，将数组末尾元素弹出。
返回值为弹出的元素。
fill
使用fill() 填充数组元素
指定填充位置
slice
使用 slice() 方法从数组中截取部分元素组合成新数组（并不会改变原数组），不传第二个参数时截取到数组的最后元素。
splice
使用 splice 方法可以添加、删除、替换数组中的元素，会对原数组进行改变。
删除元素
删除数组元素第一个参数为从哪开始删除，第二个参数为删除的数量，返回值为删除的元素。
先删除元素再添加元素
通过指定新参数来设置在删除位置添加的元素
向末尾添加元素
配合length进行操作。
向头部添加元素
元素位置调整函数
清空数组
将数组值修改为[]可以清空数组，如果有多个引用时数组在内存中存在被其他变量引用。
将数组length设置为0也可以清空数组
使用splice方法删除所有数组元素
使用pop/shift删除所有元素，来清空数组
合并拆分
join
使用join()连接成字符串
split
split() 方法用于将字符串分割成数组，类似join方法的反函数。
concat
concat()方法用于连接两个或多个数组，元素是值类型的是复制操作，如果是引用类型还是指向同一对象
copyWithin
使用 copyWithin() 从数组中复制一部分到同数组中的另外位置。
语法说明
array.copyWithin(target, start, end)
| 参数 | 描述 |
|---|---|
| target | 必需。复制到指定目标索引位置。 |
| start | 可选。元素复制的起始位置。 |
| end | 可选。停止复制的索引位置 (默认为 array.length)。如果为负值，表示倒数。 |
查找元素
indexOf
使用 indexOf() 从前向后查找元素出现的位置，如果找不到返回 -1，找到的话返回索引位置本身。
第二个参数为从指定位置开始向后查找。
lastIndexOf
使用 lastindexOf() 从后向前查找元素出现的位置，如果找不到返回 -1，找到的话返回索引位置本身。
第二个参数为从指定位置开始向前查找。
includes
判断数组中某一个元素是否存在，返回布尔值。
find
find()方法找到后会把值返回出来，你可以为它指定一个匿名函数，参数是 : 当前值，索引，操作数组。
如果找不到返回值为undefined
使用includes()等不能查找引用类型，因为它们的内存地址是不相等的。
这个时候find()就派上用场了。
findIndex
findIndex() 与 find() 的区别是返回索引值，参数也是 : 当前值，索引，操作数组。
find原理
下面是find()的原理。
下面是为Array对象添加原型方法实现。
反转排序
reverse
反转数组顺序。
sort
sort每次使用两个值进行比较 Array.sort((a,b)=>a-b
返回负数 a 排在 b前面，从小到大
返回正数 b 排在a 前面
返回 0 时不动
默认从小到大排序数组元素。
使用排序函数从大到小排序，参数一与参数二比较，返回正数为降序负数为升序。
也可以配合reverse()进行从大到小的排序。
应用场景
按照工资从大到小进行排序。
排序原理
循环遍历
for
根据数组长度结合for 循环来遍历数组
forEach
forEach()使函数作用在每个数组元素上，但是没有返回值。注意与map()的区别，map()是具有返回值的。
如下实例，将原列表中的每个元素的值加上100。
for/in
遍历时的迭代变量为索引值。
for/of
遍历时的迭代变量为值本身。
迭代器方法
数组本身就是属于一个迭代对象，因此可以调用其下的迭代方法。
迭代器有一个特点，只能向后不能向前，迭代器中的值取一个少一个，关于迭代器的知识在后面会有。
迭代器取值方法next()。
keys
获取所有的索引值。
values
获取所有的值本身。
entries
以数组形式返回所有的索引值与值本身
扩展方法
every
every() 用于递归的检测元素，要所有元素操作都要返回真结果才为真。
指定函数中第一个参数为元素，第二个参数为索引，第三个参数为原数组。
查看班级中同学的Js成绩是否都及格
some
使用 some 函数可以递归的检测元素，如果有一个返回true，表达式结果就是真。
指定函数中第一个参数为元素，第二个参数为索引，第三个参数为原数组。
敏感词汇检测示例如下。
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Documenttitle>
head>
<body>
<input type="text" placeholder="前请输入昵称">
<button type="button">提交button>
body>
<script>
"use strict";
const detect = ["蛤蟆", "维尼熊", "跳跳虎"];
document.querySelector("button").addEventListener("click", function () {
let user_input = document.querySelector("input").value;
let res = detect.some(function (value, index, array) {
// 如果列表中的词汇出现在用户输入的字符串中
return user_input.indexOf(value) >= 0;
});
if (res) alert("请不要输入敏感词汇！");
});
script>
html>
filter
对数组中的元素挨个进行判定，为真的留下，为假的抛弃。
指定函数中第一个参数为元素，第二个参数为索引，第三个参数为原数组。
筛选出大于60的元素。
map
对数组中的元素挨个进行操作，并返回一个新数组。
指定函数中第一个参数为元素，第二个参数为索引，第三个参数为原数组。
注意与forEach()函数的区别，它是没有返回值的，而map()是具有返回值的。
如下实例，将每个元素的值加上100并返回一个新列表。
reduce
使用 reduce 与 reduceRight 函数可以迭代数组的所有元素，reduce 从前开始 reduceRight 从后面开始。下面通过函数计算课程点击数的和。
第一个参数是执行函数，第二个参数为初始值
传入第二个参数时将所有元素循环一遍
不传第二个参数时从第二个元素开始循环
执行函数参数说明如下
| 参数 | 说明 |
|---|---|
| prev | 上次调用回调函数返回的结果 |
| cur | 当前的元素值 |
| index | 当前的索引 |
| array | 原数组 |
统计元素在数组中出现的次数。
返回数组中最大元素。
元素累加。
元素累加，并在之前基础上加100。