Array()數組操作

1.shift():從集合中把第一個元素刪除,並返回這個元素的值

var arr= ["a","b","c","d","e","f"];
var result= arr.shift();
console.log(arr); //["b","c","d","e","f"] 
console.log(result);//a 

2.unshift():在集合開頭添加一個或更多元素,並返回新的長度

var arr= ["a","b","c","d","e","f"];
var result= arr.unshift("add");
console.log(arr); //["add","a","b","c","d","e","f"];
console.log(result);//7

3.push():在集合中添加元素,並返回新的長度

  • 從末尾開始插入
var arr= ["a","b","c","d","e","f"];
var result= arr.push("add");
console.log(arr); //["a","b","c","d","e","f","add"];
console.log(result);//7

4.pop():從集合中把最後一個元素刪除,並返回這個元素的值

var arr= ["a","b","c","d","e","f"];
var result= arr.pop();
console.log(arr); //["a","b","c","d","e"]; 
console.log(result);//f

5.splice():splice()主要用途是向當前數組的中間插入項,可以進行刪除、插入、替換操作,然後返回被刪除的項目

  •  刪除:兩個參數
array.splice(index,howmany)
  • index:必需。整數,規定添加/刪除項目的位置,使用負數可從數組結尾處規定位置。
  • howmany:必需。要刪除的項目數量。如果設置爲 0,則不會刪除項目
  • 例子
var arr= ["a","b","c","d","e","f"];
var result= arr.splice(1,2);
console.log(arr); //["a","d","e"]; 
console.log(result);//["b","c"]
  • 插入:三個參數
arrayObject.splice(index,howmany,item1,.....,itemX)
  • index:必需。整數,規定添加/刪除項目的位置,使用負數可從數組結尾處規定位置。
  • howmany:必需。要刪除的項目數量。如果設置爲 0,則不會刪除項目
  • item1....itemx:像數組中插入的元素
  • 例子:不刪除元素,添加2個元素
var arr= ["a","b","c","d","e","f"];
var result= arr.splice(1,0,"x","y");
console.log(arr); //["a","b","x","y","c","d","e","f"]; 
console.log(result);//[]
  • 替換:替換:向指定位置插入任意數量的項同時刪除任意數量的項,插入項數和刪除項數可以不同。參數包括兩個基本參數(即刪除操作中的兩個參數類型)和要插入項的參數。(即刪除的同時添加)
  • 例子:刪除1個元素,添加2個元素
var arr= ["a","b","c","d","e","f"];
var result= arr.splice(1,1,"x","y");
console.log(arr); //["a","x","y","c","d","e","f"]; 
console.log(result);//["b"]

6.slice():基於當前數組中的一個或多個項創建一個新數組。

  • slice()方法中可以有一個或者兩個參數(代表數組的索引值,0,1,2……)
  • 當有1個參數時:返回當前數組中從此參數位置開始到當前數組末尾間所有項
  • 當有2個參數時:返回當前數組中兩個參數位置間的所有項,但不返回第二個參數位置的項
  • 參數也可以爲負數,表示從末尾算起,-1代表最後一個,使用方法和正數一樣。
  • 例子
var arr= ["a","b","c","d","e","f"];
var result1 = arr.slice(2);
var result2= arr.slice(1,4);
var result3= arr.slice(2,-2);
var result4= arr.slice(-3,-1);
console.log(result1 ); //["c","d","e","f"]; 
console.log(result2 ); //["b","c","d"]; 
console.log(result3 );//["c","d"]
console.log(result4 );//["d","e"]

7.concat():基於當前數組中所有項創建新數組。

  • 先創建數組的一個副本,若是concat()存在參數,將接收到的參數添加到副本的末尾,然後返回新構建的數組;若是沒有傳遞參數,僅僅複製當前數組並返回副本數組。
  • 例子
var arr= ["a","b","c","d","e","f"];
var result= arr.concat("x","y");
console.log(arr); //["a","x","y","c","d","e","f"]; 
console.log(result);//["a","x","y","c","d","e","f","x","y"]

8.reverse():方法顛倒數組中元素的位置,並返回該數組的引用


var arr= ["a","b","c","d","e","f"];
var result= arr.reverse();
console.log(arr); //["f", "e", "d", "c", "b", "a"]; 
console.log(result);//["f", "e", "d", "c", "b", "a"]

9.toString() 返回一個字符串,表示指定的數組及其元素

var arr= ["a","b","c","d","e","f"];
var result= arr.toString();
console.log(arr); //["a","b","c","d","e","f"]; 
console.log(result);//a,b,c,d,e,f

10.forEach() 方法對數組的每個元素執行一次提供的函數

  • 爲數組中每個元素執行的函數,該函數接收三個參數
  • currentValue(當前值):數組中正在處理的當前元素;index(索引):數組中正在處理的當前元素的索引;array:forEach()方法正在操作的數組
array.forEach(callback(currentValue, index, array){
    //do something
}, this)
  • 例子
var arr= ["a","b","c","d","e","f"];
arr.forEach(function(element) {
    console.log(element);
});
arr.forEach( element => console.log(element));
// a
// b
// c
// d
// e
// f

11.map() 方法創建一個新數組,其結果是該數組中的每個元素都調用一個提供的函數後返回的結果

  • 語法:
let new_array = arr.map(function callback(currentValue, index, array) { // Return element for new_array }[, thisArg])
  • callback:生成新數組元素的函數,使用三個參數:currentValue:callback 的第一個參數,數組中正在處理的當前元素;index:callback 的第二個參數,數組中正在處理的當前元素的索引;array:callback 的第三個參數,map 方法被調用的數組。
  • thisArg可選的。執行 callback 函數時 使用的this 值。(一般不使用
  • 例子
var arr= ["a","b","c","d","e","f"];
var result= arr.map( x => x + '1'); //連接符
console.log(arr);   //["a","b","c","d","e","f"];
console.log(result);// ["a1", "b1", "c1", "d1", "e1", "f1"]

12.find() 方法返回數組中滿足提供的測試函數的第一個元素的值。否則返回 undefined

  • 語法:arr.find(callback[, thisArg])
  • callback:在數組每一項上執行的函數,接收 3 個參數:element:當前遍歷到的元素;index:當前遍歷到的索引;array:數組本身
  • 例子
var arr= [
    {name: 'a', index: 1},
    {name: 'b', index: 2},
    {name: 'c', index: 3}
];
function findB(element) { 
    return element.name === 'b';
}
var result=arr.find(findB)
console.log(result); // { name: 'b', index: 2 }















發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章