该篇文章是我在学习js的数组总结的一些方法及其理解，如有不足之处望大佬们指点！
1.数组的定义
在js中数组的初始化定义大致有三种方法，分别是常规方式，简介方式和字面方式
-
常规方式，就是先 new 一个数组对象再分别为它们赋值
let arr_01 = new Array(); arr_01[0] = "z"; arr_01[1] = "x"; arr_01[2] = "c"; console.log("常规方式:" + arr_01); // 常规方式:z,x,c -
简介方式,可以在Array对象里面传入参数，传入的参数就是数组前几个的值
let arr_02 = new Array("v", "b", "n"); console.log("简介方式:" + arr_02); // 简介方式:v,b,n -
字面方式，直接声明一个数组然后通过中括号传入参数进行赋值
let arr_03 = ["a", "s", "d"]; console.log("字面：" + arr_03); // 字面：a,s,d
特别的 ，在js中数组里面的值可以不止为单一的一类数据类型可以是混合数组，既可以有数字又可以有字符，字符串，也可以是布尔值，还可以是日期等。
var let = ["a", 5, arr_03, Date(), true];
console.log("混合数组:" + arr_04); // 混合数组:a,5,a,s,d,Fri Sep 25 2020 15:54:49 GMT+0800 (GMT+08:00),true
2.数组的方法
-
concat() 数组的连接 arr1.concat(arr2,arr3) ，将多个数组连接成一个新的数组，并且不改变原来的数组
var arr_05 = arr_01.concat(arr_02, arr_03); console.log(arr_05); // ["z", "x", "c", "v", "b", "n", "a", "s", "d"] console.log(arr_01); // ["z", "x", "c"] -
join() 将数组用join所带的参数连接起来转换成字符串
let x = arr_05.join("-") console.log(x); // z-x-c-v-b-n-a-s-d -
push() 和 pop() push在数组尾部添加一个元素，pop在尾部删除一个
//尾部添加 push(); console.log(arr_01); // ["z", "x", "c"] arr_01.push("a"); console.log(arr_01); // ["z", "x", "c", "a"] //删除尾部 pop(); console.log(arr_02); // ["v", "b", "n"] arr_02.pop(); console.log(arr_02); // ["v", "b"] -
unshift() 和 shift () 和上面的相反，它们是在头部添加元素
//头部添加 unshift(); console.log(arr_03); // ["a", "s", "d"] arr_03.unshift("c"); console.log(arr_03); // ["c", "a", "s", "d"] //头部删除 shift(); console.log(arr_03); // ["c", "a", "s", "d"] arr_04.shift(); console.log(arr_03); // ["a", "s", "d"] -
slice(start,end) 从已有的数组中返回从start到end的元素,当只有一个参数时，则是从start到数组的最后一个元素。
let arr_01 = ["z", "x", "c", "a"]; var arr_07 = arr_01.slice(1); console.log(arr_07); // ["x", "c", "a"] var arr_08 = arr_01.slice(1, 2); console.log(arr_08); // ["x"] -
splice(start,num,item1,.....,itemX) 向数组中添加/删除项目，然后返回被删除的项目,参数分别是起点，长度，要替换的元素。该函数也会根据传入的参数，有不同的效果。
//从中间删除 splice（起点，长度） console.log(arr_05); // ["z", "x", "c", "v", "b", "n", "a", "s", "d"] arr_05.splice(2, 3); console.log(arr_05); // ["z", "x", "n", "a", "s", "d"] //从第二个位置插入元素splice(起点，长度，元素) console.log(arr_05); // ["z", "x", "n", "a", "s", "d"] arr_05.splice(2, 0, "a", "b", "c"); console.log(arr_05); // ["z", "x", "a", "b", "c", "n", "a", "s", "d"] //从第二个位置进行替换splice(起点，长度，元素) console.log(arr_05); // ["z", "x", "a", "b", "c", "n", "a", "s", "d"] arr_05.splice(2, 2, "f", "h"); console.log(arr_05); // ["z", "x", "f", "h", "c", "n", "a", "s", "d"] -
reverse() 将数组的数据进行反转，并且返回反转后的数组，会改变原数组
var str1 = [12,2,"hello"]; console.log(str1.reverse()); //["hello", 2, 12] console.log(str1); //["hello", 2, 12]
3.数组对象的遍历方法
3.1 for循环遍历
-
最基础的 for循环进行遍历
let arr_01 = [1,5,6,'d','fg']; for(let i=0; i<arr_01.length; i++ ){ console.log(arr_01[i]); } -
for-in 方法进行遍历
let arr_01 = [1,5,6,'d','fg']; for( i in arr_01){ console.log(arr_01[i]); } -
es6最新的迭代遍历方法：for-of 方法遍历 , 记住它虽然和 for-in 长得很像，但for-in对应的前面跟的是 i 值，而for-of 跟的是 item 元素
let arr_01 = [1,5,6,'d','fg']; for( item of arr_01){ console.log(item); } -
forEach 遍历方法，如果在等号的左方放一个变量，那么此变量返回值将会是
undefined(没有返回任何值)。let arr_01 = [1,5,6,'d','fg']; arr_01.forEach((item,index) => { console.log(index,item); }); // 0 1 // 1 5 // 2 6 // 3 "d" // 4 "fg"
3.2 其他的遍历函数
-
map 方法遍历数组，它会在执行后 return返回一个长度一样的新数组，如果不给return则会返回 undefined。map传入的函数中：item ：对象 ， index： 索引值 ， array： 全部数组
let arr_02 = [ { id: "1110", name: "张三" } , { id: "1111", name: "李四" } , { id: "1112", name: "王二" } , { id: "1113", name: "麻子" } ]; // 不给return，则返回undefined let arr_03 = arr_02.map((item,index,array)=>{ console.log(item,index,array); }) console.log(arr_03); // [undefined, undefined, undefined, undefined] // 为数组每个id号加上年级编号 let arr_04 = arr_02.map((item,index,array)=>{ item.id = `2018${item.id}` // 模板字符串在每个id前面加上2018 return item }) console.log(arr_04); // {id: "20181110", name: "张三"} // {id: "20181111", name: "李四"} // {id: "20181112", name: "王二"} // {id: "20181113", name: "麻子"}**特别注意：**当数组经过map后，如果是基础类型的数组对象其原来的值不会发生改变，而如果是引用类型的数组对象，原数组会发生改变。
// 比如基础类型的数组对象 let arr1 = [1,2,3,4] let newarr1 = arr1.map(item=>{ item = item * 2 return item }) console.log(arr1); // [1, 2, 3, 4] console.log(newarr1); // [2, 4, 6, 8] // 引用类型的数组对象，如上面的为数组每个id号加上年级编号,原数组的值被改变 console.log(arr_02); // [{id: "20181110", name: "张三"}, {id: "20181111", name: "李四"},....] console.log(arr_04); // [{id: "20181110", name: "张三"}, {id: "20181111", name: "李四"},....] -
filter 遍历数组方法，返回符合过滤条件的数组，没有判断条件则返回空数组。它不会改变原数组。
let arr_02 = [ { id: "1110", name: "张三" } , { id: "1111", name: "李四" } , { id: "1112", name: "王二" } , { id: "1113", name: "麻子" } ]; // 找到符合条件对象，并返回成数组 let arr_05 = arr_02.filter((item,index,array)=>{ return item.id === '1110' }) console.log(arr_05); // [{id: "1110", name: "张三"}] -
find 遍历数组方法，找到第一个符合条件的值并返回，当超过两个以上的值，则选择第一个符合的值。
let arr_06 = arr_02.find(item=>{ return item.name = "张三" }) console.log(arr_06); // {id: "1110", name: "张三"} -
every 和 some 遍历数组方法，将两个方法进行对比记忆，这个两个就有点像 “与” 和 “非” 。every是每个元素都符合指定条件返回 true，而some 则是每个元素都不符合才会返回 false，只要一个为 true 则返回 true。
let arr1 = [1,2,3,4] let resultEvery = arr1.every(item=>{ return item >=2 // 是否全部大于等于2 }) console.log(resultEvery); // false let resultSome = arr1.some(item=>{ return item >= 2 // 是否存在大于等于2的值 }) console.log(resultSome); // true -
reduce 遍历数组的方法，将数组合成一个值，可以用于累加或对比
let arr1 = [1,2,3,4] let sum = arr1.reduce((accumulator, item, index, array)=>{ // 分別是前一个返回值, 当前值, 当前索引值，数组 return accumulator = accumulator + item }, 0) // 给定一个初始值 console.log(sum); // 累加求所有值的和 10
