js數組學習

本文是對數組的常規方法作一個記錄。

數組的基本方法除concat、slice外都會對原數組進行修改

數組的建立

var arr = new Array(12);// 建立一個長度爲12的數組，值爲undefined
    var arr1 = new Array(1,2,3); 
    var arr2 = [1,2,3]; //arr1=arr2

length

數組的長度能夠讀取，也可設置

var arr = [1,2,3];
arr.length;  //3
arr.length=0; //[]

Array.indexOf('value',index)

做用：在數組中查找給定元素（從左往右找）
參數：value-要查找的值；index-從第index位開始查找；index省略從頭開始搜索,負數表明相對數組末尾的偏移量
返回值：找到，返回第一個匹配元素的索引；沒有找到返回-1

var arr=[1,2,3,4,2,3];
    arr.indexOf();//=>-1
    arr.indexOf(2,1);//=>1
    arr.indexOf(2,7);//=>-1
    arr.indexOf(5);//=>-1
    arr.indexOf(2,-2);//=>4
    arr.indexOf(2,-6);//=>1 負數超出範圍都找的1
    arr.indexOf(2,-11);//=>1 從第-5位往右找

查找數組中全部的x,並返回其下標

<!--
    @a:要查找的字符串
    @arr:要查找的數組
-->
function findAll(x,arr){
    var i=0;
    var results=[];
    while(arr.indexOf(x,i) != -1){
        results.push(arr.indexOf(x,i));
        i = arr.indexOf(x,i)+x.length;
    }
    return results;
}

Array.lastIndexOf('value',index)

做用：在數組中查找給定元素（從右往左找）
參數：value-要查找的值；index-從第index位開始查找；index省略從尾開始搜索,負數表明相對數組末尾的偏移量
返回值：找到，返回第一個匹配元素的索引；沒有找到返回-1

var arr=[1,2,3,4,2,3];
    arr.lastIndexOf();//=>-1
    arr.lastIndexOf(2,1);//=>1
    arr.lastIndexOf(2,0);//=>-1
    arr.lastIndexOf(2,7);//=>4 正數超出範圍都找的是4
    arr.lastIndexOf(2,-2);//=>4 從第4位往左找
    arr.lastIndexOf(2,-6);//=>-1 從第0位往左找
    arr.lastIndexOf(2,-11);//=>-1 從第-5位往左找

Array.join('value')

做用：將數組轉爲字符串
參數：value-數組元素間鏈接符；省略時默認爲（，）
返回值：一個字符串。將數組中每一個元素轉化爲字符串，並用value值銜接起來

var arr=[1,2,3];
    arr.join();//=>"1,2,3"
    arr.join('');//=>"123"
    var arr1=new Array(3);
    arr1.join('-'); //=>"--"

Array.concat('value')

做用：銜接數組
參數：value-能夠是一個元素或一個數組(數組取的是元素)
返回值：一個銜接value的新數組。不會修改調用的數組

var arr=[1,2,3];
    arr.concat(4,5);//=>[1,2,3,4,5]
    arr.concat([4,5]);//=>[1,2,3,4,5]
    arr.concat([4,[5,[6,7]]]);//=>[1,2,3,4,[5,[6,7]]]

Array.push()、Array.pop()、Array.shift()、Array.unshift()

做用： 1.添加元素: 返回新數組長度

push:數組末尾添加元素；
unshift:數組開頭添加元素;一次性插入

2.刪除元素: 返回刪除的數據

pop:刪除數組最後一個元素；
shift:刪除數組第一個元素;

var arr=[1,2,3];
    arr.push([4,5]);//=>[1,2,3,[4,5]]  返回4
    arr.shift();//=>[2,3,[4,5]]  返回1

Array.slice(start,end)

做用：返回數組一部分
參數：start-開始序號，end-結束序號。end省略默認到最後一位。負數從數組尾部開始計算，-1表示最後一位，-2表示倒數第二位
返回值：start到end之間的新數組[start,end)。不會修改調用的數組

var arr=[1,2,3,4,5];
    arr.slice(0,3);//=>[1,2,3]
    arr.slice(3);//=>[4]
    arr.slice(1,-1);//=>[2,3,4]
    arr.slice(-3,-2);//=>[3]
    arr.slice(-8,3);//=>[1,2,3]
    arr.slice(3,0);//=>[]  截取不到返回空數組，從小到大，不交換

Array.splice(start,deleteCount,value,...)

做用：添加、刪除和替換數組元素
參數：start-數組元素序號

deleteCount-要刪除元素的個數
  value-要插入數組中的0個或多個值

返回值：刪除元素返回包含刪除元素的新數組；添加或替換返回空數組

var arr=[1,2,3,4,5,6,7,8];
    arr.splice(4);//=>返回[5,6,7,8]a爲[1,2,3,4]
    arr.splice(1,0,2,3);//=>返回[] a爲[1,2,3,2,3,4]
    arr.splice(1,1,5);//=>返回[2] a爲[1,5,3,2,3,4]

Array.sort(orderfunc)

做用：對數組元素排序
參數：可選函數。不帶參數按字符編碼排序

arr.sort(function(a,b){
        return a-b; //從小到大
        //return b-a; 從大到小
       // return Math.random()-0.5; 隨機排序
    })

Array.reverse()

做用：顛倒數組元素，逆序

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

Array.toString()

做用：將數組轉爲字符串，與join不傳參數同樣
參數：可選函數。不帶參數按字符編碼排序

[1,2,3].toString(); //"1,2,3"
   [1,[2,'c']].toString(); //"1,2,c"

---

ES5中數組方法

均不會改變原數組

Array.forEach()

做用：遍歷數組，爲每一個元素調用指定函數
注意：forEach不能在全部元素傳遞給函數前終止遍歷

var arr=[1,2,3]; 
   arr.forEach(function(item,index,arr){
        arr[index] = item+1;
   })
   arr=>[2,3,4]

Array.map()

做用：將數組每一個元素傳遞給用指定函數
注意：傳遞給map的函數應有返回值，不修改原數組，返回的是新數組

var arr=[1,2,3]; 
   b=arr.map(function(item,index,arr){
        return x*x;
   })  //[1,4,9]

Array.filter()

做用：返回過濾後數組的一部分

刪除數組中undefined和null
    a = a.filter(function(item){
        return item!==undefined && item!==null;
    })

Array.every()

做用：對數組元素應用指定函數進行檢測
返回值：全部元素均知足條件，返回true；不然false
注意：every和some一旦能確認返回什麼值，就會中止遍歷

var arr = [1,2,3]
    arr.every(function(item){
        return item<5;
    }) //true

Array.some()

做用：對數組元素應用指定函數進行檢測
返回值：有一個元素知足條件，返回true
注意：空數組，調用every()返回true;調用some返回false

Array.reduce(fn,value)

做用：使用指定函數將數組進行組合，返回一個值（從左往右）
參數：fn-指定函數，value-傳遞給函數的初值
一個參數：

第一次的兩個值分別爲數組的第1、二個元素，其結果做爲第二次的第一個值

兩個參數：

第一次的值爲value和數組第一個元素，其結果做爲第二次的第一個值

var arr = [1,2,3，4,5]
    var sum = arr.reduce(function(prev,cur,index,arr){
        return prev+cur;
    },0)
    var max = arr.reduce(function(x,y){
    return (x>y)?x:y;
    })

Array.reduceRight(fn,value)

做用：使用指定函數將數組進行組合，返回一個值（從右往左）

---

ES6對數組方法的擴展（）

參考http://es6.ruanyifeng.com/#do...

Array.form(arr,fn)

做用：將類數組對象和可遍歷對象轉爲真正的數組。如nodeList、argument等
參數：arr爲類數組或集合，fn函數做用相似map方法
注意：只要部署了Iterator接口的數據結構，都能將其轉爲數組。字符串和set結構均可以轉爲數組

let arrLike={
    '0':'a',
    '1':'b',
    '2':'c',
    length:3
   }
   var arr1=[].slice.call(arrLike); //es5
   var arr2=Array.from(arrLike);
   Array.form([1,2,3],(x)=>x*x) //[1,4,9]
   Array.form('abc'); //['a','b','c']

Array.of(value)

做用：將一組值轉爲數組,彌補Array()因參數的個數不一樣結果不一樣的不足

Array(3) //[,,,]  Array.of(3) //[3]
  Array() //[]  Array.of() //[]

Array.fill(value，start,end)

做用：使用給定的value,填充一個數組
參數：value要填充的值，start-end從start到end進行填充

[1,2,3].fill(5); //[5,5,5]
 [1,2,3].fill(4,1,2); //[1,4,3]

---

數組檢測

使用typeOf能夠完成對基本數據類型的檢測，對數組的檢測可使用如下方法：

一、Array.isArray([]) =>true

二、[] instanceOf Array =>true

instanceOf問題：web瀏覽器可能右多個窗口或frame，每一個窗口都有本身的JavaScript環境，有本身的全局對象。每一個全局對象有本身的構造函數，所以一個窗體中的對象不多是另外一個窗口的構造函數實例， 所以該方法存在必定的問題

三、Object.prototype.toString.call([]) == "[object Array]"; =>true

call()和apply()均可以間接地調用函數，並顯式地修改this值。任何函數均可以做爲任何對象的方法來調用，哪怕這個函數不是那個對象的方法。如：

Array.join = Array.join || function(a,sep){
        return Array.prototype.join.call(a,sep);
    }
    Array.prototype.join.call('abc','-'); //a-b-c