添加

• push(向數(shù)組的后面添加)

let arr = ["html","css"];
// 1.push  向數(shù)組的后面添加
arr.push("js")
console.log(arr); // ["html", "css", "js"]

• unshift(向數(shù)組的前面添加值)

let arr = ["html","css"];
// unshift 向數(shù)組的前面添加值
arr.unshift("vue");
console.log(arr)
// ["vue", "html", "css"]

• 擴(kuò)展運算符
  ...arr 可以將一個數(shù)組展開

var arr = [1,2,3]
console.log(arr); // [1, 2, 3]
console.log(...arr); // 1 2 3

var a=[4,5,6]
var b = [7,8,9]
a.push(...b)  // 拼接數(shù)組
console.log(a); // [4, 5, 6, 7, 8, 9]

• concat( ) 連接兩個數(shù)組 (不改變原數(shù)組的內(nèi)容)

var arr = [1,2,3];
var c = [4,5,6];
var b = arr.concat(c);

console.log(arr);  // [1,2,3]
console.log(b);    // [1,2,3,4,5,6]

遍歷

• forEach(遍歷)

arr.forEach(function(item, index){
  console.log(item, index)
// html 0
// css 1
})

• of 方法

var arr = [2,3,4,5]
for(var i of arr){
  console.log(i);
/*
2
3
4
5
*/
}

• map 方法(可以改變數(shù)組的每一項，變成一個新數(shù)組)
  1.數(shù)組的每一項是基礎(chǔ)(簡單)類型，執(zhí)行map不會改變數(shù)組原來的結(jié)構(gòu)
2.數(shù)組的每一項為復(fù)雜類型，會改變原來的數(shù)據(jù)結(jié)構(gòu)

var arr = [2,3,4,5]
var res = arr.map((item=>{
  return item*2
}))
console.log(arr);  // [2,3,4,5]
console.log(res);  // [4,6,8,10]

• some 方法
  只要數(shù)組中有一項滿足條件，就輸出true

var arr = [1,2,3,4,5]
var res = arr.some(item =>{
  return item>3
})
console.log(res); // true

• every 方法
  數(shù)組中的每一項滿足條件，才輸出true

var arr = [1,2,3,4,5]
var str = arr.every(item => item >2)
console.log(str);  //false

刪除

• pop( ) 從尾部刪除

var arr = [1,2,3,4]
arr.pop()
console.log(arr) // [1,2,3]

• shift( ) 從頭部刪除

var arr = [1,2,3,4]
arr.shift()
console.log(arr); // [2,3,4]

查詢

• arr[index] 查詢對應(yīng)下標(biāo)的值

//arr[index] 查詢對應(yīng)下標(biāo)的值
var arr=[1,2,3];
console.log(arr[0]);  //1;

• indexOf(value) 查詢對應(yīng)值的下標(biāo)

var arr=[1,2,3,4];
console.log(arr.indexOf(1)); // 0
//如果沒有對應(yīng)的值,則返回-1

• includes(value) 判斷數(shù)組是否包含某個值

// 返回boolean
var arr = [1,2,3,4]
console.log(arr.includes(5)); // false

• slice(start,end) 截取 (包含開始，不含結(jié)束)

// slice(startIndex,endIndex) 截取 包含開始不含結(jié)束
// slice(startIndex) 截取從startIndex開始到后面的所有值
var arr = [1,2,3,4]
console.log(arr.slice(1,3));  // [2,3]
console.log(arr.slice(1)); // [2,3,4]

sort 排序

• 升序算法

var arr = [4,7,18,20,3]  // [3,4,7,18,20]
/* 升序算法 */
arr.sort((a,b)=>{
  return a-b;
})
console.log(arr);

• 降序算法

var arr = [4,7,18,20,3]
arr.sort((a,b)=>{
  return b-a;
})
console.log(arr);

取最大值 Math.max( )

• Math.max(...arr) 對數(shù)組取最大值

var arr = [1,2,3]
console.log(Math.max(...arr)); // 3

• Math.min(...arr) 取最小值

// 簡單的算法實現(xiàn)
var arr = [4,3,2,1]
var minNum = arr[0]
for(var i=1;i<arr.length;i++){
  if(minNum>arr[i]){
    minNum=arr[i]
  }
}
console.log(minNum);

// Math.min(...arr) 取最小值
var arr = [4,3,1]
console.log(Math.min(...arr)); // 1

arr.reverse( ) 反轉(zhuǎn)

var arr = ["html","css","javascript"]
console.log(arr.reverse());  // ["javascript","css","html"]

findIndex()

• 普通數(shù)組查索引

let arr=[1,2,3,4,5,6];
console.log(arr.findIndex(o=> o==20))
//找不到時返回 -1

console.log(arr.findIndex(o=> o==2))
//返回2的索引是 1

//若有多個符合條件的元素，則返回第一個元素索引。
console.log(arr.findIndex(o=> o>2))
//返回是第一個也就是3的索引 2

• 對象數(shù)組查索引

let arr1=[
    {name:"張三",age:16},
    {name:"張四",age:18},
    {name:"王五",age:20},
]

console.log(arr1.findIndex(o=> o.name=="張四"))
//返回張四的索引是 1

//若有多個符合條件的元素，則返回第一個元素索引。
console.log(arr1.findIndex(o=> o.age>19))
//返回是第一個也就是王五的索引 2

filter 方法 (篩選，過濾）

此方法也不會改變原始數(shù)組，會返回一個篩選成功匹配的元素組成的新數(shù)組

// 查找符合條件的元素，主要用于篩選
var arr =[1,2,3,4,5]
var res = arr.filter(item =>item>2)
console.log(res); // [3, 4, 5]

splice()

• 刪除 —- splice(index,len)

arr = ['a','b','c','d']
arr.splice(1,1) 
console.log(arr)
//['a','c','d'] 刪除起始下標(biāo)為1，長度為1的一個值，len設(shè)置的1，如果為0，則數(shù)組不變

arr.splice(1,2) 
console.log(arr)  //['a','d'] 刪除起始下標(biāo)為1，長度為2的一個值，len設(shè)置的2

//刪除第一個
arr.splice(0,1) 
//刪除最后一個
arr.splice(arr.length-1,1)

• 替換 —- splice(index,len,[新值])

arr = ['a','b','c','d']
arr.splice(1,1,'ttt') 
console.log(arr)
//['a','ttt','c','d'] 替換起始下標(biāo)為1，長度為1的一個值為‘ttt'，len設(shè)置的1

arr.splice(1,2,'ttt') 
console.log(arr)
//['a','ttt','d'] 替換起始下標(biāo)為1，長度為2的兩個值為‘ttt'，len設(shè)置的1

• 添加 —- splice(index,0,[新值]) 第二個值 是固定為0

arr = ['a','b','c','d']
arr.splice(1,0,'ttt') 
console.log(arr)
//['a','ttt','b','c','d'] 表示在下標(biāo)為1處添加一項‘ttt'

過濾

• 簡單數(shù)組示例

var a =[1,2,3,4,5,6,7,8,9]
var r = a.filter(o=> o<5)
console.log(r)

//輸出結(jié)果：
[1, 2, 3, 4]

• 數(shù)組對象示例

var aa =[
{id:1,name:"張三"},
{id:2,name:"李四"},
{id:3,name:"王五"}
]
var bb = aa.filter(o=> o.id<3)
console.log(bb)

//輸出結(jié)果
0: {id: 1, name: "張三"}
1: {id: 2, name: "李四"}

數(shù)組截取

• 取數(shù)組某一段的值
  Array<number>.slice(start?: number, end?: number): number[]

var array = [1, 2, 3, 4, 5]
const subArr = array.slice(0, 1)
console.log(subArr) // [1]

const subArr = array.slice(0, 10)
console.log(subArr) // [1, 2, 3, 4, 5]

const subArr = array.slice(0, -2)
console.log(subArr) // [1, 2, 3]

join()

join() 方法用于把數(shù)組中的所有元素放入一個字符串。
元素是通過指定的分隔符進(jìn)行分隔的。

• 語法

arrayObject.join(separator)

• 實例

var list = ["趙","錢","孫"]
console.log(list.join())

//輸出結(jié)果: 趙,錢,孫

var list = ["趙","錢","孫"]
console.log(list.join("|"))
//輸出結(jié)果  趙|錢|孫

console.log(list.join("==="))
//輸出結(jié)果  趙===錢===孫