js之數組內置方法

時間 2019-11-10

原文原文鏈接

在前端開發中，咱們要常常用到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指向，該方法不會改變原來數組。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.lengthspa
```
[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指向,該方法不會改變原來數組。3d
```
[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指向,該方法不會改變原來數組。code
```
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指向,該方法不會改變原來數組。blog
```
[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(0);
length//6
arr//[0,1,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]

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。