JavaScript中數組有各種操作方法，以下通過舉例來說明各種方法的使用：數組操作方法 push 在數組最後添加一個元素 pop 把數組最後一位取出來，並返回，且原來數組發生變化 shift 把數組第一位取出來，並返回，且原來數組發生變化 unshift 在數組第一位新增一個元素 join 把數 ...

JavaScript中數組有各種操作方法，以下通過舉例來說明各種方法的使用：

數組操作方法

push

在數組最後添加一個元素

var arr=[3,4,5,6]
console.log(arr)   //[3, 4, 5, 6]

arr.push("evenyao")  //字元串需要加""，數字不加
console.log(arr)   //[3, 4, 5, 6, "evenyao"]

pop

把數組最後一位取出來，並返回，且原來數組發生變化

var arr=[3, 4, 5, 6, "evenyao"]
console.log(arr)   //[3, 4, 5, 6, "evenyao"]

var value = arr.pop()   //arr.pop()的返回值就是取出的值，但這裡是undefined是因為前面有var value
console.log(value)  //"evenyao"
console.log(arr)   //[3, 4, 5, 6]

shift

把數組第一位取出來，並返回，且原來數組發生變化

var arr=["root",3, 4, 5, 6, "evenyao"]
console.log(arr)   //["root",3, 4, 5, 6, "evenyao"]

var value = arr.shift()
console.log(value)  //"root"
console.log(arr)  //[3, 4, 5, 6, "evenyao"]

unshift

在數組第一位新增一個元素

var arr=[3, 4, 5, 6, "evenyao"]
console.log(arr)   //[3, 4, 5, 6, "evenyao"]

arr.unshift("root")  //字元串需要加""，數字不加
console.log(arr)   //["root",3, 4, 5, 6, "evenyao"]

join

把數組元素使用參數作為連接符，鏈接成字元串，不會修改原數組的內容

var arr=[3, 4, 5, 6, "evenyao"]
console.log(arr.join('-'))   //3-4-5-6-evenyao
console.log(arr)   //[3, 4, 5, 6, "evenyao"]

splice

splice方法用於一次性解決數組添加、刪除（這兩種方法一結合就可以達到替換效果），方法有三個參數

1.開始索引
2.刪除元素的位移
3.插入的新元素，當然也可以寫多個

使用splice完成刪除

var arr=[3, 4, 5, 6, "evenyao"]
var arr2 = arr.splice(1,2)   //從下標為1的元素開始，取出2個元素作為一個數組的返回，原數組發生改變

console.log(arr)  //[3, 6, "evenyao"]
console.log(arr2)  //[4, 5]

使用splice完成新增

var arr=[3, 4, 5, 6, "evenyao"]
arr.splice(1,0,8,9,"yes")   //從下標為1的位置（元素4）開始，刪除0個，新增三個元素（8,9,"yes"），位置在（元素4）之前

console.log(arr)   //[3, 8, 9, "yes", 4, 5, 6, "evenyao"]

slice

取出元素（區間）可作為新數組。但不一樣的是原數組不發生變化

var arr=[3, 4, 5, 6, "evenyao"]
var arr2 = arr.slice(2,3)  //從arr下標為2開始，到下標為3結束（不包括3，即只取了一個），作為新數組，原數組不變

console.log(arr)   //[3, 4, 5, 6, "evenyao"]
console.log(arr2)   //[5]

reverse

將數組逆序，會修改原數組

var arr=[3, 4, 5, 6, "evenyao"]
console.log(arr)   //[3, 4, 5, 6, "evenyao"]

arr.reverse()
console.log(arr)  //["evenyao", 6, 5, 4, 3]

concat

用於拼接數組，但不會修改任何一個原始數組，也不會遞歸鏈接數組內部數組

var a = [1,2,3,4,5];
var b = [6,7,8,9];
console.log(a.concat(b));//[1, 2, 3, 4, 5, 6, 7, 8, 9]
console.log(a); //[1, 2, 3, 4, 5]
console.log(b); //[6, 7, 8, 9]

也因為不會改變任何一個原始數組，因此可以用concat來進行數組的深拷貝，即：

var arr=[3, 4, 5, 6, "evenyao"]
var arr2 = arr.concat([])   //相當於和一個空數組進行了拼接，然後生成了arr2看上去和arr一模一樣，但是卻是兩塊不一樣的記憶體空間

console.log(arr)   //[3, 4, 5, 6, "evenyao"]
console.log(arr2)   //[3, 4, 5, 6, "evenyao"]
arr === arr2   //false

sort

用於對數組進行排序，會改變原數組

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

但是有一些情況下情況下會變成下麵這樣：

var arr=[7,8,9,10,11]
arr.sort()
console.log(arr) //[10, 11, 7, 8, 9]

因為按照字母表排序，7比10大，這時候我們需要傳入自定義排序函數

var arr = [7,8,9,10,11]

arr.sort(function(v1,v2){
       return v1-v2
})
console.log(arr) //[7, 8, 9, 10, 11]

其他案例：

    var users = [
        {
            name: 'aaa',
            age: 21
        },
        {
            name: 'baa',
            age: 18
        },
        {
            name: 'abc',
            age: 24
        }
    ]

    // 按age 從小到大排序
    var sortByAge = users.sort(function(v1, v2){
        return  v1.age > v2.age
    })

  // 按name從大到小排序
    var sortByName = users.sort(function(v1, v2){
        return  v1.name > v2.name
    })

ES5 數組拓展

ES5為Array做了大幅拓展

.indexOf / .lastIndexof

該方法用於查找數組內指定元素的位置，查到第一個之後返回其索引，沒有找到則返回-1。lastIndexOf反向搜索，查到第一之後，返回其索引，但順序還是取正序。

var arr = [2,3,4,"root","evenyao",3,8,7]
console.log(arr.indexOf(3))   //1
console.log(arr.indexOf(11))   //-1
console.log(arr.lastIndexof(3))   //5

forEach

遍曆數組，參數為一個回調函數，回調函數有三個參數

當前元素 value
當前元素索引值 i
整個數組 array

var arr = [1,2,3,4,5,6]

arr.forEach(function(value,i,array){
    array[i]= value + 1
})

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

var arr  = [3,4,"evenyao"]
arr.forEach(function(value,index){
    console.log('' + value+value)
})

//33
//44
//evenyaoevenyao

map

遍曆數組，回調函數。返回值做操作之後組成一個新數組返回，新數組索引結構和原數組一致，原數組不變

var arr = [1,2,3,4,5,6]
var arr2 = arr.map(function(val){
    return val * val
})

console.log(arr)   //[1, 2, 3, 4, 5, 6]
console.log(arr2)   //[1, 4, 9, 16, 25, 36]

every、some

邏輯判定，回調函數返回一個布爾值

every是所有函數的每個回調函數都返回true，才返回true，遇到false就終止執行，返回false

var arr = [1,2,-1,0,5]
arr.every(function(val){
    return val>0
})  //false

var arr = [1,2,1,3,5]
arr.every(function(val){
    return val>0
})  //true

some是存在有一個回調函數返回true就終止執行並返回true，否則返回false

var arr = [1,2,-1,0,5]
arr.some(function(val){
    return val>0
})  //true

filter

返回數組的一個子集，回調函數用於邏輯判斷是否返回，返回true則把當前元素加入到返回數組中，false則不加。新數組只包含返回true的值，原數組保持不變。

var arr = [3,5,6,-1,-2,-3]
var arr2 = arr.filter(function(val){
    return val > 0
})

console.log(arr)  //[3, 5, 6, -1, -2, -3]
console.log(arr2)  //[3, 5, 6]