【JavaScript入門】Array類型

Array

數組也是對象數據類型的 typeof [] ->'object'

數組也有屬性名，只不過屬性名是數字，咱們把數字屬性名稱之爲它的索引：數組是以數字做爲索引，索引從零開始，有一個length屬性表明數組的長度。

類數組：相似於數組，可是不是數組
一、經過getElementsByTagName獲取的元素集合是類數組
二、函數中的實參集合arguments也是類數組
...

循環數組中的每一項

Array.prototype.aa = 100;

//=>FOR循環操做
for (var i = 0; i < ary.length; i++) {
    console.log(arr[i]);
}

//=>FOR IN循環操做
for (var key in arr) {
    //key:屬性名(數組中的屬性名是索引)
    console.log(arr[key]);
}

//=>FOR循環只能遍歷到數組私有的一些屬性，而FOR IN循環能夠把一些自定義的公共屬性也能遍歷到

數組中的經常使用方法

數組中有不少經常使用方法 console.dir(Array.prototype)

一、方法的意義和做用
二、方法的形參
三、方法的返回值
四、經過此方法，原來的數組是否發生了改變

實現數組的增長、修改、刪除

var ary = [12,23,34];
push/unshift
//=>增長
/*
 * 一、push：向數組的末尾追加新內容
 *   參數：一到多個，任何數據類型均可以，想要給數組末尾追加什麼，直接傳遞到push方法中便可，傳遞多個用逗號隔開
 *   返回值：新增後數組的長度
 *   原有數組改變了
 */ 

/*
 * 二、unshift：向數組開頭追加新內容
 *   參數：須要追加的內容（能夠是多個任何數據類型的值）
 *   返回值：新增後數組的長度
 *   原來數組改變了
*/

/*
 * 三、把數組當作一個普通的對象，使用對象鍵值對的操做，給其設置新的屬性（索引）
 * arr[arr.length]=xxx  向數組的末尾追加了新的內容
*/

//=>刪除
/*
 * 一、pop：刪除數組最後一項
 *   參數：無
 *   返回值：被刪除的那一項內容
 *   原有數組改變了
*/

/*
 * 二、shift：刪除數組第一項
 *   參數：無
 *   返回值：被刪除那一項的內容
 *   原有數組改變了
 * 使用shift刪除第一項以後，後面每一項的索引都要向前進一位（致使後面項的索引起生改變）
*/

/*
 * 三、把數組當作普通的對象操做
 * delete刪除：`delete ary[索引]`刪除指定索引這一項(當前項被刪除後，原有數組其它項的索引不會改變；當前數組的length也不會改變；)
 * 
 * ary.length--：刪除數組最後一項
*/

//=>splice：數組中內置的方法，能夠實現數組的增長、修改、刪除
/*
 * splice實現刪除
 *   splice(n,m)：從索引n開始刪除m個（m不寫是刪除到數組的末尾）
 *   返回值：被刪除的內容(以一個新數組保存)
 *   原有數組改變了
 *   -> splice(0) 清空數組
 *   -> splice()  一項都不刪除,返回一個新的空數組
 *   -> splice(0,1) 刪除第一項
 *   -> splice(ary.length-1) 刪除最後一項
 *  
 * splice實現修改
 *  splice(n,m,x)：在原有刪除的基礎上，用x代替刪除的內容
 * 
 * splice實現增長
 *  splice(n,0,x)：在修改的基礎上，咱們一項都不刪除，把x插入到索引n的前面
 *  -> ary.splice(0,0,x) 向數組開頭追加新的內容
 *  -> ary.splice(ary.length,0,x) 向數組末尾追加新元素
*/

數組的查詢

/*
 * slice：數組的查詢
 *  參數：slice(n,m) 從索引n開始找到索引爲m處（不包含m）
 *  返回值：把找到的部分以一個新數組返回
 *  原來的數組不變
 *   
 *  -> slice(n) 從索引n開始找到末尾
 *  -> slice(0) / slice() 數組克隆,克隆一份和原來數組如出一轍的新數組
 *  -> slice支持負數索引，若是傳遞的索引爲負數，瀏覽器解析的時候是按照 總長度+負數索引 來處理的
 *  ...
*/

將兩個數組進行拼接

/*
 * concat：將多個數組拼接在一塊兒
 *  參數：要拼接的內容（把內容放在原數組的後面），能夠是一個數組，也能夠是一些數據值
 *  返回：拼接後的新數組
 *  原有數組不變
 *   
 *  -> concat() 什麼都沒有拼接，至關於把原有數組克隆一份如出一轍的新數組出來
*/

把數組轉換爲字符串的

/*
 * 一、toString：實現把數組轉化爲字符串（轉換後的字符串以逗號分隔每一項）
 *   參數：無
 *   返回值：轉換的字符串
 *   原有數組不變
*/

/*
 * 二、join：把數組按照指定的分隔符轉換爲字符串，和字符串中的split相對應
 *   參數：指定的連接符
 *   返回值：轉換後的字符串
 *   原有數組不變
*/

//=>已知數組中的每一項都是數字，想實現數組求和，咱們如何實現？
//一、循環實現
var total=null;
for(var i=0;i<ary.length;i++){
    total+=ary[i];
}

//二、利用join
var total = eval(ary.join('+')); //->evel：把字符串變爲JS表達式執行

實現數組中每一項的排序和排列

/*
 * 一、reverse：把數組中的每一項倒過來排列
 *   參數：無
 *   返回值：排序後的數組
 *   原有數組改變 
*/

/*
 * 二、sort：實現數組的排序
 *   參數：無或者回調函數
 *   返回值：排序後的數組
 *   原有數組改變
 *   
 * 不傳遞參數的狀況下：能夠給10之內的數字進行升序排列，可是超過10的就沒法處理了（多位數只識別第一位）
 *  
 * ary.sort(function(a,b){
 *     return a-b; //->升序
 *     return b-a; //->降序
 * });
*/

驗證數組中是否包含某一項

/*
 * indexOf / lastIndexOf：獲取當前項在數組中第一次或者最後一次出現位置的索引
 *   數組中的這兩個方法在IE6~8下不兼容
 *   字符串中的這兩個方法兼容全部的瀏覽器
 * 
 * 若是當前數組中並無這一項，返回的索引是-1，咱們根據這一點能夠驗證數組中是否包含這一項 
*/
if(ary.indexOf(12)>-1){
    //->數組中包含12
}

Array.prototype.myIndexOf = function myIndexOf(value){
    var result = -1;
    for(var i=0;i<this.length;i++){
        if(value===this[i]){
            result = i;
            break;
        }
    }
    return result;
}
arr.myIndexOf(12)

遍歷數組中每一項的方法

//=>如下方法在IE6~8下都不兼容

/*
 * forEach：遍歷數組中的每一項
*/
arr.forEach(function(value,index){
    //=>數組中有多少項，當前回調函數執行多少次；每一次傳遞進來的value就是當前遍歷數組這一項的值，index就是遍歷這一項的索引
});

/*
 * map：遍歷數組中的每一項，在forEach的基礎上，能夠修改每一項的值
*/
arr.map(function(value,index){
    //=>數組中有多少項，當前回調函數執行多少次；每一次傳遞進來的value就是當前遍歷數組這一項的值，index就是遍歷這一項的索引
    return xxx; //=>RETURN後面返回的結果就是把當前遍歷的這一項修改成xxx
});

filter
find
reduce
every
...