JS針對Array的各種操作匯總
Array應該是我們在平時寫js代碼中，使用頻率最高的，在平時的項目中，很多數據都是可以通過Array來存儲、操作等任務。除了Object之外，Array類型應該是js中最常用的類型了。
今天總結一下Array的一些簡單和基本的操作，也來鞏固下自己的基礎知識。
一、如何創(chuàng)建Array（下面直接說數組）
創(chuàng)建數組主要有兩種方法，第一種是使用數組構造函數，第二種是使用數組字面量表示法。
1、使用數組構造函數
如：var arr = new Array();
如果預先知道數組的長度，那么也可以直接給構造函數傳遞該長度。
如：var arr = new Array(20);
如果知道數組中應該包含的項，就直接在構造的時候，傳遞數組中的應該包含的項。
如：var arr = new Array(1,2,3);
2、使用數組字面量表示法
如：var arr = [1,2,3,4];
var arr2 = [];
二、數組的操作
1、 棧方法和隊列方法
1）棧操作的方式：先進后出原則----通過重數組尾部添加數據項，然后在從數組的尾部獲取尾部數據項
push();----就是在數組的尾部添加數據項，該方法的參數個數可以自定義；
pop();---該方法就是獲取數組的最尾部的一個數據項，該函數無需傳遞任何參數；
如：
var colors = new Array();//創(chuàng)建數組
var count = colors.push("red","green");//推入兩項
console.log(count);
var color = ["red","black"];
color.push("brown");//推入另一項
color[3]="yellow"; //添加一項
console.log(color);
console.log(color.push("blue"));
console.log(color.pop());//取得最后一項
2）隊列操作的方式：先進先出原則---通過從數組的頭部插入數據和獲取數據項來模擬實現
push();--向數組末端添加數據項；
shift();---獲取數組的頭部一項的數據信息；
unshift();--與shift完全相反，就是向數組的頭部插入數據項信息；
var colorArr = new Array();//創(chuàng)建數組
colorArr.push("red","yellow");//推入兩項
console.log(colorArr);
var length = colorArr.push("blue");
console.log(length);
var item = colorArr.shift();//取得第一項
console.log(item);
console.log(colorArr.length);
2、檢測驗證數組
在平時項目開發(fā)中，我們往往會遇到，判斷一個對象是否為數組（函數的參數傳遞中），那么如果判斷一個對象是否為數組呢，有以下兩種方式
1）第一種方法
if(value instanseof Array){
}
2）第二種方法
if(Array.isArray(value)){
}//該方法只使用與高版本的瀏覽器：IE9+、Firefox4+/Chrome
3、具體的編程實例
1）添加元素（數組末尾添加元素）
在數組 arr 末尾添加元素 item。不要直接修改數組 arr，結果返回新的數組 .
方法一：slice()和push()結合
function append(arr, item) {
var newArr = arr.slice(0); // slice(start, end)淺拷貝數組
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）添加元素（添加任意位置的元素）
在數組 arr 的 index 處添加元素 item。不要直接修改數組 arr，結果返回新的數組。
方法一：使用普通的迭代拷貝
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()結合
function insert(arr, item, index) {
var newArr=arr.slice(0);
newArr.splice(index,0,item);
return newArr;
}
方法三：concat()和splice()結合
function insert(arr, item, index) {
var newArr=arr.concat();
newArr.splice(index,0,item);
return newArr;
}
3、刪除元素（刪除數組最后一個元素）
刪除數組 arr 最后一個元素。不要直接修改數組 arr，結果返回新的數組 。
方法一：使用普通的迭代拷貝
function truncate(arr, item) {
var newArr=[];
for(var i=0;i<arr.length-1;i++){
newArr.push(arr[i]);
}
return newArr;
}
方法二：concat()和pop()結合
function truncate(arr) {
var newArr = arr.concat();
newArr.pop();
return newArr;
}
4、刪除元素（刪除數組第一個元素）
刪除數組 arr 第一個元素。不要直接修改數組 arr，結果返回新的數組 。
方法一：使用普通的迭代拷貝
function curtail(arr) {
var newArr=[];
for(var i=1;i<arr.length;i++){
newArr.push(arr[i]);
}
return newArr;
}
方法二：concat()和shift()結合
function curtail(arr) {
var newArr = arr.concat();
newArr.shift();
return newArr;
}
方法三：slice()
function curtail(arr) {
return arr.slice(1);
}
5、合并數組
合并數組 arr1 和數組 arr2。不要直接修改數組 arr，結果返回新的數組 。
方法一：使用普通的迭代拷貝
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()結合
function concat(arr1, arr2) {
var newArr=arr1.slice(0);
for(var i=0;i<arr2.length;i++){
newArr.push(arr2[i]);
}
return newArr;
}
5、移除數組中的元素
移除數組 arr 中的所有值與 item 相等的元素。不要直接修改數組 arr，結果返回新的數組 。
方法一：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;
}
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
Array的push與unshift方法都能給當前數組添加元素，不同的是，push是在末尾添加，而unshift則是在開頭添加。2011-03-03
這篇文章主要介紹了理解javascript中的回調函數(callback),本文著重于對回調函數概念的理解,需要的朋友可以參考下2014-09-09
下面小編就為大家?guī)硪黄獪\談在fetch方法中添加header后遇到的預檢請求問題。小編覺得挺不錯的，現在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-08-08
這篇文章主要介紹了JS實現星星評分功能實例代碼(兩種方法)的相關資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-06-06
本文給大家?guī)砹薺son解析方法小結的知識，非常不錯，具有參考借鑒價值，感興趣的朋友一起學習吧2016-06-06
最近有朋友問我node環(huán)境和瀏覽器的區(qū)別這一問題，今天小編就抽空給大家介紹下Node環(huán)境和瀏覽器的區(qū)別，感興趣的朋友一起看看吧2018-08-08
這篇文章主要介紹了JS數組搜索之折半搜索實現方法,結合具體實例形式分析了javascript數組折半搜索算法的原理、實現技巧與相關注意事項,需要的朋友可以參考下2017-03-03
這篇文章主要介紹了javascript無刷新評論實現方法,涉及javascript動態(tài)添加表格元素的技巧,需要的朋友可以參考下2015-05-05
這篇文章主要介紹了點評js異步加載的4種方式，幫助大家更全面的了解js異步加載方式，感興趣的小伙伴們可以參考一下2015-12-12
這篇文章主要教會大家學習使用bootstrap3柵格系統(tǒng)，bootstrap開發(fā)環(huán)境搭建，還介紹了柵格系統(tǒng)的類型，感興趣的小伙伴們可以參考一下2016-04-04