共计 5530 个字符，预计需要花费 14 分钟才能阅读完成。
在前端开发中，我们要经常用到 js 中的数组的内置方法，在控制台中的打印中，我们可以看到数组中的内置方法。
-
Array.concat()
该方法可以合并一个或者多个数组let arr = [1,2,3]; let arr1 = [4,5,6]; let arr2 = [7,8,9]; let newArr = arr.concat(arr1); //[1,2,3,4,5,6] let newArr1 = arr.concat(arr1,arr2); //[1,2,3,4,5,6,7,8,9] -
Array.copyWithin()
该方法复制数组内的某些值到到另一个索引位置，用法 arr.copyWithin(target,start,end) 执行后，该数组发生改变，可以传三个参数
target 是目标索引
start 复制源索引的开始, 可以忽略，默认为 0，复制源包含该索引的值
end 复制源索引的结束，可以忽略，默认为 arr.length+1，复制源不包含该索引的值let arr = [1,2,3,4,5,6]; let arr1 = [1,2,3,4,5,6]; let arr2 = [1,2,3,4,5,6]; let arr3 = [1,2,3,4,5,6]; arr.copyWithin(0,2,3); //[3,2,3,4,5,6] arr1.copyWithin(0,2,4); //[3,4,3,4,5,6] 这里可以看到如果复制源为多个值, 他也会替换掉目标索引后面的值 arr2.copyWithin(3) //[1,2,3,1,2,3] 这里默认 start=0，end=5，也就是整个数组都是复制源，从目标索引为 3 的位置开始复制，因为后面只有三个位置，所以复制源后面的 4,5,6 就没有再复制，也就是数组长度不会变 arr3.copyWithin(3,-2,-4) //[1, 2, 3, 3, 4, 6] 负数的时候从右边开始算 -
Array.every()
遍历数组，遍历的时候检测一旦有值不符合就返回 false, 他的使用 arr.every(callback(item,index,array)，thisArg)，参数 callback 为一个函数，该函数可以传三个参数每项的值 item，该值索引 index 以及原数组 array，thisArg 为执行 callback 时 this 指向，该方法不会改变原来数组。var arr = [2,5,6,7,4,5]; var arr1 = [15,34,55,654,4343]; arr.every(function(item,index.array){return item>5}) //false arr1.every(function(item,index.array){return item>5}) //true -
Array.fill()
向数组特定位置插入某个值，使用 fill(value,start,end)；value 要插入的值，start 插入的开始索引，默认为 0，end 插入的结束索引，默认为 array.length[1,2,3,4,5].fill(3) //[3,3,3,3,3] [1,2,3,4,5].fill(3,2) //[1,2,3,3,3] [1,2,3,4,5].fill(3,2,4) //[1,2,3,3,5] [1,2,3,4,5].fill(3,-5,-2) //[3, 3, 3, 4, 5] start 和 end 允许负值 -
Array.filter()
通过遍历数组来过滤某些值，它的使用 arr.fill(callback(item,index,array)，thisArg)，参数 callback 为一个函数，该函数可以传三个参数每项的值 item，该值索引 index 以及原数组 array，thisArg 为执行 callback 时 this 指向, 该方法不会改变原来数组。[null,1,2,3,4,null].filter(function(item,index,array){return item}) //[1,2,3,4] -
Array.find()
查找数组的第一次出现的值，它的使用 arr.find(callback(item,index,array)，thisArg)，参数 callback 为一个函数，该函数可以传三个参数每项的值 item，该值索引 index 以及原数组 array，thisArg 为执行 callback 时 this 指向, 该方法不会改变原来数组。var arr= [ { name:"教师 1", teaid:1 }, { name:"教师 2", teaid:2 }, { name:"教师 1", teaid:3 } ] arr.find(function(item,index,array){return item.name=="教师 1"}) // {name: "教师 1", teaid: 1} 只返回找到的第一个值 -
Array.findIndex()
查找数组的第一次出现的值的索引，没有找到返回 -1，它的使用 arr.findIndex(callback(item,index,array)，thisArg)，参数 callback 为一个函数，该函数可以传三个参数每项的值 item，该值索引 index 以及原数组 array，thisArg 为执行 callback 时 this 指向, 该方法不会改变原来数组。[1,2,3,4].findIndex(function(item,index,array){return item == 2}) //1 [1,2,3,4].findIndex(function(item,index,array){return item == 25}) //-1 -
Array.flat()
通过遍历可以将数组内的数组合并成为一个数组，用法 arr.flat(deep) 参数 deep 为合并的层数，该方法会改变原数组[1,2,[3,4,[5,6]],7,8].flat() //[1,2,3,4,[5,6],7,8] [1,2,[3,4,[5,6]],7,8].flat(2) //[1,2,3,4,5,6,7,8] -
Array.forEach()
该方法可以遍历数组内的每一项，用法 arr.forEach(callback(item,index,array),thisArg)，该方法不会改变数组本身var arr= [ { name:"教师 1", teaid:1 }, { name:"教师 2", teaid:2 }, { name:"教师 1", teaid:3 }] arr.forEach((item,index,array)=>{console.log(item.name) })// 教师 1 教师 2 教师 1 -
Array.includes()
判断数组中是否含有某个值，如果有返回 true，没有返回 false，用法 arr.includes(value,checkIndex),checkIndex 表示数组从下标几开始查找。var arr=["hello","world"] arr.includes("hello") //true arr.includes("hello",1)//false -
Array.indexOf()
查找数组中是否含有某个值，如果有返回找到的第一个值的下标，没有返回 -1, 用法 arr.includes(value,checkIndex),checkIndex 表示数组从下标几开始查找var arr=[1,2,3,4,5] arr.indexOf(1)//0 arr.indexOf(4)//3 arr.indexOf(2,3)//-1 -
Array.join()
将数组内的值全部拼成一个字符串, 用法 arr.join(partition),partition 是指定某个字符将数组内的元素隔开，默认为 ”,”var arr=["hello","world"] arr.join(); //"hello,world" arr.join("-"); //"hello-world" arr.join(""); //"hello world" -
Array.lastIndexOf()
和 indexOf() 相似，该方法会返回数组中最后一个值的下标, 没有返回 -1, 只是 checkIndex 是从该下标开始逆向查找var arr=[1,2,1,4,5,4,2] arr.lastIndexOf(1)//2 arr.lastIndexOf(6)//-1 arr.lastIndexOf(2,3)//1 -
Array.map()
遍历数组，并根据处理返回一个新的数组，但是不会改变原来数组，和 forEach 用法类似，与 forEach 区别是 map() 方法要有返回值；var arr=[1,2,3,4]; var newArr=arr.map((item,index,array)=>{return item+2}) arr //[1,2,3,4] newArr //[3,4,5,6] -
Array.pop()
删除数组最后一个值并返回数组最后一个值，该方法会改变原来数组var arr=[1,2,3,4,5] var lastNum=arr.pop(); lastNum//5 arr//[1,2,3,4] -
Array.push()
从数组尾部添加元素并返回数组改变后的数组长度，该方法会改变原来数组var arr=[1,2,3,4,5] var arrlength=arr.push(6); arr.push(6,7,8,9); arr //[1,2,3,4,5,6] arrlength //6 -
Array.reverse()
将原数组反转，该方法会改变原数组var arr=[1,2,3,4,5] arr.reverse() arr// [5,4,3,2,1] -
Array.shift()
删除数组中的第一个元素，该方法会改变原数组var arr=[1,2,3,4,5] var shiftNum=arr.shift(); shiftNum//1 arr//[2,3,4,5] -
Array.unshift()
从数组开始位置添加数据，该方法会改变原数组var arr=[1,2,3,4,5] var length=arr.unshift(); length//6 arr//[2,3,4,5] -
Array.slice()
提取数组特定下标范围内的值，用法 arr.slice(start,end)，start 开始提取的下标值，end 结束提取的下标值（提取出来的数组包含 start 下标的元素值，不包含 end 下标的元素值），该方法不会改变数组var arr=[1,2,3,4,5] var sliceArr=arr.slice(1,2) arr// [1,2,3,4,5] sliceArr//[2] -
Array.some()
遍历判断数组内是否符合要求的元素，只有有一个就返回 true，没有就返回 false，它的使用 arr.some(callback(item,index,array)，thisArg)，参数 callback 为一个函数，该函数可以传三个参数当前处理的数组元素 item，该值索引 index 以及原数组 array，thisArg 为执行 callback 时 this 指向, 该方法不会改变原来数组。
// 判断是否有大于 2 的元素[null,1,2,3,4,null].some(function(item,index,array){return item>2})//true -
Array.sort()
对数组进行排序，用法 arr.sort(callback(compareFir,compareSed)),compareFir、compareSed 分别是比较的第一个和第一个元素，该方法会改变原来数组排序；var arr=[1,56,2,54,776]; arr.sort() // arr=[1,2,54,56,776] // 也可以用于成绩排序之类的 var stuScore=[ { stuName:'job', score:45, }, { stuName:'jack', score:4 }, { stuName:'tom', score:90, }, { stuName:'alice', score:89, }, { stuName:'lei', score:63, } ] stuScore.sort((firVal,sedVal)=>{if(firVal.score>sedVal.score){return 1}else{return -1} return 0 }) console.log(stuScore) // [{stuName: "jack", score: 4} {stuName: "job", score: 45} {stuName: "lei", score: 63} {stuName: "alice", score: 89} {stuName: "tom", score: 90} ] -
Array.splice()
该方法可以删除或者向数组内添加元素，用法 arr.splice(start,deleteSum,item1,item2…),start 表示开始删除或者添加开始的下标,deleteSum 表示要删除元素的个数，要添加元素时，deleteSum 应为 0 或者为负数，item1,item2… 这些表示要添加的元素, 该方法会修改原来数组。var arr=[1,2,3,4,5]; var spliceArr=arr.splice(2,2) // 此时 arr 为 [1,2,5],spliceArr 为 [3,4] arr.splice(2,0,5,6) // 此时 arr 为 [1,2,5,6,3,4,5] -
Array.toString()
将数组转换成字符串，var arr = [1,2,3,4,5] arr.toString() //"1,2,3,4,5" 该方法不会改变原数组，arr 依然是 [1,2,3,4,5]
