JS針對(duì)Array的各種操作匯總

更新時(shí)間：2016年11月29日 16:34:07 作者：Wendy-lxq

這篇文章主要為大家詳細(xì)介紹了JS針對(duì)Array的各種操作,如何創(chuàng)建Array,數(shù)組的一些簡(jiǎn)單和基本的操作,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

Array應(yīng)該是我們?cè)谄綍r(shí)寫js代碼中，使用頻率最高的，在平時(shí)的項(xiàng)目中，很多數(shù)據(jù)都是可以通過Array來存儲(chǔ)、操作等任務(wù)。除了Object之外，Array類型應(yīng)該是js中最常用的類型了。

今天總結(jié)一下Array的一些簡(jiǎn)單和基本的操作，也來鞏固下自己的基礎(chǔ)知識(shí)。

一、如何創(chuàng)建Array（下面直接說數(shù)組）

創(chuàng)建數(shù)組主要有兩種方法，第一種是使用數(shù)組構(gòu)造函數(shù)，第二種是使用數(shù)組字面量表示法。

1、使用數(shù)組構(gòu)造函數(shù)

如：var arr = new Array();

如果預(yù)先知道數(shù)組的長度，那么也可以直接給構(gòu)造函數(shù)傳遞該長度。

如：var arr = new Array(20);

如果知道數(shù)組中應(yīng)該包含的項(xiàng)，就直接在構(gòu)造的時(shí)候，傳遞數(shù)組中的應(yīng)該包含的項(xiàng)。

如：var arr = new Array(1,2,3);

2、使用數(shù)組字面量表示法

如：var arr = [1,2,3,4];

var arr2 = [];

二、數(shù)組的操作

1、棧方法和隊(duì)列方法

1）棧操作的方式：先進(jìn)后出原則----通過重?cái)?shù)組尾部添加數(shù)據(jù)項(xiàng)，然后在從數(shù)組的尾部獲取尾部數(shù)據(jù)項(xiàng)

push();----就是在數(shù)組的尾部添加數(shù)據(jù)項(xiàng)，該方法的參數(shù)個(gè)數(shù)可以自定義；

pop();---該方法就是獲取數(shù)組的最尾部的一個(gè)數(shù)據(jù)項(xiàng)，該函數(shù)無需傳遞任何參數(shù)；

如：

var colors = new Array();//創(chuàng)建數(shù)組 
var count = colors.push("red","green");//推入兩項(xiàng) 
console.log(count); 
 
var color = ["red","black"]; 
color.push("brown");//推入另一項(xiàng) 
color[3]="yellow"; //添加一項(xiàng) 
console.log(color); 
console.log(color.push("blue")); 
console.log(color.pop());//取得最后一項(xiàng)

2）隊(duì)列操作的方式：先進(jìn)先出原則---通過從數(shù)組的頭部插入數(shù)據(jù)和獲取數(shù)據(jù)項(xiàng)來模擬實(shí)現(xiàn)

push();--向數(shù)組末端添加數(shù)據(jù)項(xiàng)；

shift();---獲取數(shù)組的頭部一項(xiàng)的數(shù)據(jù)信息；

unshift();--與shift完全相反，就是向數(shù)組的頭部插入數(shù)據(jù)項(xiàng)信息；

var colorArr = new Array();//創(chuàng)建數(shù)組 
colorArr.push("red","yellow");//推入兩項(xiàng) 
console.log(colorArr); 
var length = colorArr.push("blue"); 
console.log(length); 
 
var item = colorArr.shift();//取得第一項(xiàng) 
console.log(item); 
console.log(colorArr.length);

2、檢測(cè)驗(yàn)證數(shù)組

在平時(shí)項(xiàng)目開發(fā)中，我們往往會(huì)遇到，判斷一個(gè)對(duì)象是否為數(shù)組（函數(shù)的參數(shù)傳遞中），那么如果判斷一個(gè)對(duì)象是否為數(shù)組呢，有以下兩種方式

1）第一種方法

　　if(value instanseof Array){

}

2）第二種方法

　　if(Array.isArray(value)){

}//該方法只使用與高版本的瀏覽器：IE9+、Firefox4+/Chrome

3、具體的編程實(shí)例
1）添加元素（數(shù)組末尾添加元素）

在數(shù)組 arr 末尾添加元素 item。不要直接修改數(shù)組 arr，結(jié)果返回新的數(shù)組 .

方法一：slice()和push()結(jié)合

 function append(arr, item) { 
  var newArr = arr.slice(0); // slice(start, end)淺拷貝數(shù)組 
  newArr.push(item); 
  return newArr; 
};

方法二：普通的迭代拷貝

 function append(arr, item) { 
  var length = arr.length, 
    newArr = []; 
  
  for (var i = 0; i < length; i++) { 
    newArr.push(arr[i]); 
  } 
  
  newArr.push(item); 
  
  return newArr; 
};

方法三：使用concat

function append(arr, item) { 
  return arr.concat(item); 
}

2）添加元素（添加任意位置的元素）
在數(shù)組 arr 的 index 處添加元素 item。不要直接修改數(shù)組 arr，結(jié)果返回新的數(shù)組。

方法一：使用普通的迭代拷貝

function insert(arr, item, index) { 
  var newArr=[]; 
  for(var i=0;i<arr.length;i++){ 
    newArr.push(arr[i]); 
  } 
  newArr.splice(index,0,item); 
  return newArr; 
}

方法二：slice()和splice()結(jié)合

function insert(arr, item, index) { 
  var newArr=arr.slice(0); 
  newArr.splice(index,0,item); 
  return newArr; 
}

方法三：concat()和splice()結(jié)合

function insert(arr, item, index) { 
  var newArr=arr.concat(); 
  newArr.splice(index,0,item); 
  return newArr; 
}

3、刪除元素（刪除數(shù)組最后一個(gè)元素）
刪除數(shù)組 arr 最后一個(gè)元素。不要直接修改數(shù)組 arr，結(jié)果返回新的數(shù)組。

方法一：使用普通的迭代拷貝

function truncate(arr, item) { 
  var newArr=[]; 
  for(var i=0;i<arr.length-1;i++){ 
    newArr.push(arr[i]); 
  } 
  return newArr; 
}

方法二：concat()和pop()結(jié)合

function truncate(arr) { 
  var newArr = arr.concat(); 
  newArr.pop(); 
  return newArr; 
}

4、刪除元素（刪除數(shù)組第一個(gè)元素）
刪除數(shù)組 arr 第一個(gè)元素。不要直接修改數(shù)組 arr，結(jié)果返回新的數(shù)組。

方法一：使用普通的迭代拷貝

function curtail(arr) { 
  var newArr=[]; 
  for(var i=1;i<arr.length;i++){ 
    newArr.push(arr[i]); 
  } 
  return newArr; 
}

方法二：concat()和shift()結(jié)合

function curtail(arr) { 
  var newArr = arr.concat(); 
  newArr.shift(); 
  return newArr; 
}

方法三：slice()

function curtail(arr) { 
  return arr.slice(1); 
}

5、合并數(shù)組
合并數(shù)組 arr1 和數(shù)組 arr2。不要直接修改數(shù)組 arr，結(jié)果返回新的數(shù)組。

方法一：使用普通的迭代拷貝

function concat(arr1, arr2) { 
  var newArr=[]; 
  for(var i=0;i<arr1.length;i++){ 
    newArr.push(arr1[i]); 
  } 
  for(var j=0;j<arr2.length;j++){ 
    newArr.push(arr2[j]); 
  } 
  return newArr; 
}

方法二：concat()方法

function concat(arr1, arr2) { 
  return arr1.concat(arr2); 
}

方法三：slice()和push()結(jié)合

function concat(arr1, arr2) { 
  var newArr=arr1.slice(0); 
  for(var i=0;i<arr2.length;i++){ 
    newArr.push(arr2[i]); 
  } 
  return newArr; 
}

5、移除數(shù)組中的元素
移除數(shù)組 arr 中的所有值與 item 相等的元素。不要直接修改數(shù)組 arr，結(jié)果返回新的數(shù)組。

方法一：splice()方法

function remove(arr, item) { 
      var newArr = arr.slice(0); 
      for(var i=0; i<newArr.length; i++) { 
        if(newArr[i] == item) { 
          newArr.splice(i, 1); 
        } 
      } 
      return newArr; 
    } 
    var arr = [1,2,3,4,2]; 
    var item = 2; 
    console.log(remove(arr, item)); 
    console.log(arr);

方法二：push()方法

function remove(arr,item){ 
  var newarr = []; 
  for(var i=0;i<arr.length;i++){ 
    if(arr[i] != item){ 
      newarr.push(arr[i]); 
    } 
  } 
  return newarr; 
}

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: