1. 2. 顺序 方法名 功能 返回值 是否改变原数组 版本 1 push() (在结尾)向数组添加一或多个元素 返回新数组长度 Y ES5-
2 unshift() （在开头)向数组添加一或多个元素 返回新数组长度 Y ES5-
3 pop() 删除数组的最后一位 返回被删除的数据 Y ES5- 4 shift() 移除数组的第一项 返回被删除的数据 Y ES5-
5 reverse() 反转数组中的元素 返回反转后数组 Y ES5-
6 sort() 以字母顺序(字符串Unicode码点)对数组进行排序 返回新数组 Y ES5-
7 splice() 在指定位置删除指定个数元素再增加任意个数元素 （实现数组任意位置的增删改) 返回删除的数据 Y ES5-
8 concat() 通过合并（连接）现有数组来创建一个新数组 返回合并之后的数组 N ES5-
9 join() 用特定的字符,将数组拼接形成字符串 (默认",") 返回拼接后的新数组 N ES5-
10 slice() 裁切指定位置的数组 被裁切的元素形成的新数组 N ES5-
11 toString() 将数组转换为字符串 新数组 N ES5-
12 valueOf() 查询数组原始值 数组的原始值 N ES5-
13 indexOf() 查询某个元素在数组中第一次出现的位置 存在该元素,返回下标,不存在 返回 -1 N ES5-
14 lastIdexOf() 反向查询数组某个元素在数组中第一次出现的位置 存在该元素,返回下标,不存在 返回 -1 N ES5-
15 forEach() (迭代) 遍历数组,每次循环中执行传入的回调函数 无/(undefined) N ES5-
16 map() (迭代) 遍历数组, 每次循环时执行传入的回调函数,根据回调函数的返回值,生成一个新的数组 有/自定义 N ES5-
17 filter() (迭代) 遍历数组,
每次循环时执行传入的回调函数,回调函数返回一个条件,把满足条件的元素筛选出来放到新数组中 满足条件的元素组成的新数组 N ES5-
18 every() (迭代) 判断数组中所有的元素是否满足某个条件 全都满足返回true 只要有一个不满足
返回false N ES5- 19 some() (迭代)
判断数组中是否存在,满足某个条件的元素 只要有一个元素满足条件就返回true,都不满足返回false N ES5-
20 reduce() (归并)遍历数组,
每次循环时执行传入的回调函数,回调函数会返回一个值,将该值作为初始值prev,传入到下一次函数中 最终操作的结果 N ES5-
21 reduceRight() (归并)用法同reduce,只不过是从右向左 同reduce N ES5-
22 includes() 判断一个数组是否包含一个指定的值. 是返回 true，否则false N ES6
23 Array.from() 接收伪数组,返回对应的真数组 对应的真数组 N ES6
24 find() 遍历数组,执行回调函数,回调函数执行一个条件,返回满足条件的第一个元素,不存在返回undefined 满足条件第一个元素/否则返回undefined N ES6
25 findIndex() 遍历数组,执行回调函数,回调函数接受一个条件,返回满足条件的第一个元素下标,不存在返回-1 满足条件第一个元素下标,不存在=>-1 N ES6
26 fill() 用给定值填充一个数组 新数组 N ES6
27 flat() 用于将嵌套的数组“拉平”，变成一维的数组。 返回一个新数组 N ES6
28 flatMap() flat()和map()的组合版 , 先通过map()返回一个新数组,再将数组拉平( 只能拉平一次
) 返回新数组 N ES6
1.push();功能: 在数组最后一位添加一个或多个元素,并返回新数组的长度,改变原数组.(添加多个元素用逗号隔开)
var arr = [1, 2, "c"];
var rel = arr.push("A", "B");
console.log(arr); // [1, 2, "c", "A", "B"]
console.log(rel); // 5 (数组长度)
2.unshift(); 功能: 在数组第一位添加一个或多个元素，并返回新数组的长度，改变原数组。(添加多个元素用逗号隔开)
var arr = [1, 2, "c"];
var rel = arr.unshift("A", "B");
console.log(arr); // [ "A", "B",1, 2, "c"]
console.log(rel); // 5 (数组长度)
3.pop(); 功能：删除数组的最后一位，并且返回删除的数据，会改变原来的数组。(该方法不接受参数,且每次只能删除最后一个)
var arr = [1, 2, "c"];
var rel = arr.pop();
console.log(arr); // [1, 2]
console.log(rel); // c
4.shift(); 功能：删除数组的第一位数据，并且返回被删除的数据，会改变原来的数组。(该方法同pop()；一样不接受参数,且每次只能删除数组第一个)
var arr = ["a","b", "c"];
var rel = arr.shift();
console.log(arr); // ['b', "c"]
console.log(rel); // a
5.splice(); 功能：向数组中添加，或从数组删除，或替换数组中的元素，然后返回被删除/替换的元素。可以实现数组的增删改；
语法： arrayObject.splice(index,howmany,item1,…,itemX)
index 必需。整数，规定添加/删除项目的位置（元素下标），使用负数可从数组结尾处规定位置。
howmany 必需。要删除的项目数量。如果设置为 0，则不会删除项目。
item1, …, itemX 可选。向数组添加的新项目。
例，删除arr()中第三个元素并添加 ”add1“ "add2"元素
var arr = ["a", "b", "c", 2, 3, 6];
var rel = arr.splice(2, 1, "add1", "add2");
console.log(arr); //原数组
console.log(rel); //新数组
6.toString(); 功能: 直接将数组转换为字符串,并且返回转换后的新数组,不改变原数组,与join();方法不添加任何参数 相同.
var list = ["a", "b", "c", "d"];
var rel = list.toString();
console.log(rel); // a,b,c,d (字符串类型)
7.数组map方法作用: 映射数组
<script>
/*
1.数组map方法作用: 映射数组
说人话：按照某种映射关系, 把数组的每一个元素给修改了
举例：全场8折: 数组的每一个元素 * 0.8
2. map方法特点
2.1 回调函数执行次数 == 数组长度
2.2 回调函数内部的return
* return 新数组的元素
* 如果没有return, 则map的返回值都是undefined
2.3 map方法的返回值
* 返回映射之后的新数组
*/
let arr = [ 88,90,100,20,50 ]
//完整写法
let res = arr.map( (item,index) => {
return item*0.8
} )
//箭头函数如果形参只有一个可以省略小括号， 如果函数体只有一行可以省略大括号(必须省略return)
let res2 = arr.map( item=>item*0.8 )
console.log( res2 )
</script>
8.数组filter方法作用: 筛选数组
<script>
/*
1.数组filter方法作用: 筛选数组
* 应用场景: 筛选数组,将符合条件的元素放入新数组中
* 举例： 找出数组中所有大于10的元素
2. filter方法特点
2.1 回调函数执行次数 == 数组长度
2.2 回调函数内部的return
* return true : 符合筛选条件，放入新数组中
* return false : 不符合筛选条件，不放入新数组中
2.3 filter方法的返回值
* 返回筛选之后的新数组
*/
let arr = [ 88,90,100,20,50 ]
//需求：找出50以上的元素
//完整写法
// let res = arr.filter( (item,index)=>{
// if( item >= 50 ){
// return true
// }else{
// return false
// }
// })
let res = arr.filter(item=>item >= 50)
console.log( res )
</script>
8.1sort以字母顺序(字符串Unicode码点)对数组进行排序 返回新数组
8.2reverse反转数组中的元素 返回反转后数组
8.3slice裁切指定位置的数组 被裁切的元素形成的新数组
9.数组forEach方法作用: 遍历数组
<script>
/*
1.数组forEach方法作用: 遍历数组
* 应用场景: 和 for(let i=0;i<arr.length;i++){} 功能一致
2. forEach方法特点
2.1 回调函数执行次数 == 数组长度
2.2 回调函数内部的return
* 没有返回值
2.3 forEach方法的返回值
* 没有返回值
*/
let arr = [45,60,88,90,20]
arr.forEach((item,index)=>{
console.log(item,index)
})
</script>
10.数组some方法作用: 判断数组中是否有符合条件的元素
<script>
/*
1.数组some方法作用: 判断数组中是否有符合条件的元素
* 应用场景: 非空判断（判断多个表单元素，有没有空文本）
* 举例 ： 判断数组中有没有负数
2. some方法特点
2.1 回调函数执行次数 != 数组长度
2.2 回调函数内部的return
* return true : 循环结束。 找到了满足条件的元素
* return false : 循环继续。 没找到，循环继续。 如果所有元素全部遍历还是没找到，最终结果就是false
2.3 some方法的返回值
* true : 有符合条件的元素
* false : 没有符合条件的元素
*/
let arr = [10,20,50,60,70,80]
//标准写法
// let res = arr.some((item,index)=>{
// if( item < 0 ){
// return true
// }else{
// return false
// }
// })
//简写
let res = arr.some(item=>item < 0)
console.log( res )
</script>
11.数组every方法作用: 判断数组中 是否所有的 元素都满足条件
<script>
/*
1.数组every方法作用: 判断数组中 是否所有的 元素都满足条件
* 应用场景: 开关思想 (购物车全选框)
* 举例 ： 判断数组中是不是都是正数
2. every方法特点
2.1 回调函数执行次数 != 数组长度
2.2 回调函数内部的return
* return true : 循环继续, 满足条件,如果所有的元素全部遍历还是true,则最终的结果就是true
* return false : 循环结束。 只要要到不满足条件的元素，循环结束。最终的结果false
2.3 every方法的返回值
* true : 所有的元素 都符合条件
* false : 有元素 不符合条件
*/
let arr = [10,20,50,60,70,80]
//标准写法
let res = arr.every((item,index)=>{
if( item >= 0 ){
return true
}else{
return false
}
})
console.log(res)
</script>
12.数组findIndex方法作用: 查找元素的下标
<script>
/*
1.数组findIndex方法作用: 查找元素的下标
* 数组的findIndex与indexOf异同点
相同点：功能一致，都是查找元素下标。 有则返回下标，无则返回固定值-1
不同点：应用场景不同
indexOf : 查找数组中的元素都是值类型
findIndex : 查找数组中的元素都是引用类型
2. findIndex方法特点
2.1 回调函数执行次数 != 数组长度
2.2 回调函数内部的return
* return true : 循环结束。 找到了,此时返回值就是下标
* return false : 循环继续。 没找到，循环继续。 如果所有元素全部遍历还是没找到，最终结果就是-1
2.3 some方法的返回值
* 元素下标 或者 -1
*/
let arr = [
{
name:'张三',age:20},
{
name:'李四',age:18},
{
name:'王五',age:16},
]
//需求：找名字为王五的人在哪里
// let res = arr.findIndex(item=>{
// if( item.name == 'sfs' ){
// return true
// }else{
// return false
// }
// })
let res = arr.findIndex(item=>item.name == '王五')
console.log(res)
</script>
13.reduce场景: 数组元素求和、求数组元素最大值
<script>
/* 1.数组reduce方法 : 数组累加器方法
* 对数组每一个元素执行一次回调函数,累加最后一次回调的结果
2.reduce场景: 数组元素求和、求数组元素最大值
*/
let arr = [20,55,60]
// let sum = 0
// for(let i = 0;i<arr.length;i++){
// sum = sum + arr[i]
// }
// console.log( sum )
/*
第一个参数：回调 (上一次值,当前值,当前下标)=>{}
* 默认下标不是从0开始，而是从1开始。 开发中一般需要设置默认值
* return 值 就是下一次 sum的值
第二个参数: 初始值
* 一般需要设置初始值为0, 如果不设置遇到空数组则会报错
reduce方法返回值是 ： 最后一次sum的结果
*/
// let res = arr.reduce( ( sum,item,index )=>{
// console.log( sum,item,index)
// return sum + item
// } , 0 )
let res = arr.reduce( ( sum,item )=>sum + item , 0 )
console.log( res )
</script>
14输入框失去焦点：正则校验手机号正则： /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}KaTeX parse error: Undefined control sequence: \d at position 14: / * 验证码正则： /^\̲d̲{6}/ * 用户名密码正则： /^\w{6,20}$/ * 确认密码 ： 检测两次密码是否一致
location.href
15.Array.from(); 功能: 将一个类数组对象或者可遍历对象转换成一个真正的数组
注意 将一个类数组对象转换为一个真正的数组，必须具备以下条件：
1、该 伪数组 / 类数组 对象必须具有length属性，用于指定数组的长度。如果没有length属性，那么转换后的数组是一个空数组。
2、该 伪数组 / 类数组 对象的属性名必须为数值型或字符串型的数字
16.find(); 功能: 遍历数组 每次循环 执行回调函数,回调函数接受一个条件 返回满足条件的第一个元素,不存在则返回undefined
参数
item:必须 , 循环当前元素
index:可选 , 循环当前下标
array:可选 , 当前元素所属的数组对象
实例:
var list = [55, 66, 77, 88, 99, 100];
var index = list.find(function (item, index, array) {
console.log(item, index, array);
return item > 60;
});
console.log(index); //66
17.fill(); 功能 用给定值填充一个数组
参数
value 必需。填充的值。
start 可选。开始填充位置。
end 可选。停止填充位置 (默认为 array.length)
var result = ["a", "b", "c"].fill("填充", 1, 2);