前端入門系列(三):javascript數組方法 ECMAScript3定義的數組方法 ECMAScript5中的數組方法

ECMAScript3定義的數組方法

  • 轉換:join()
  • 排序: reverse()、sort()
  • 連接:concat()
  • 裁剪: slice()
  • 插入、刪除:splice()、push()、pop()、unshift()、shift()
  • 對象方法:toString()、toLocaleString()

join()

將數組中所有元素轉化爲字符串並連接在一起,返回最後生成的字符串。可以指定一個可選的字符串在生成的字符串中來分隔數組中的各個元素。如果不指定分隔符,默認使用逗號

reverse()

將數組中的元素順序顛倒,返回逆序的數組。它不通過創建新的數組重新排列,而是在原先的數組中排列它們

sort()

將數組中的元素排序並返回排序後的數組。當不帶參數調用sort()時,數組元素以字母表順序排序。
如果包含undefined的元素,它們會被排到數組的尾部。
如果要按照其他方式排序,必須給sort()方法傳遞一個比較函數,該函數的返回值決定了該函數所傳入參數a,b在排序好的數組中的先後順序。假設第一個參數在前,則應該返回一個小於0的數;相反,則返回一個大於0的數。

//按數值升序
a.sort(function(a,b){
    return a-b;
})
//按數組降序
a.sort(function(a,b){
    return b-a;
})
//隨機排序
a.sort(function(){
    return 0.5-Math.random();
})

concat()

Array.concat()方法創建並返回一個新的數組,元素包括調用concat()的原始數組的元素和concat()的每個參數。如果這些參數中的任何一個自身是數組,則連接的是數組的元素;但是,concat
()不會扁平化數組的數組,可以理解爲只能解剖一層

var a=[1,2,3];
a.concat(4,5);            //返回[1,2,3,4,5]
a.concat([4,5]);          //返回[1,2,3,4,5]
a.concat([4,5],[6,7])     //返回[1,2,3,4,5,6,7]
a.concat(4,[5,[6,7]])     //返回[1,2,3,4,5,[6,7]]

由於返回的是新數組,該方法可用於實現數組複製

var b=a.concat();
console.log(b)            //返回[1,2,3]             

slice()

Array.slice()方法創建並返回指定數組的子數組
slice(start,end) 參數start爲必須,end爲可選,分別指定截取的數組的起、止位置;如果出現負數,它表示相對於數組最後一個元素的位置。
slice(start) 截取start開始到數組結束的所有元素
slice(start,end) 截取[start,end)閉開區間的數組元素

var a=[1,2,3,4,5];       
a.slice(0,3);        //返回[1,2,3]
a.slice(3);          //返回[4,5]
a.slice(1,-1);       //返回[2,3,4]
a.slice(-3,-2);      //返回[3]

slice()方法可用於實現數組複製

a.slice(0);          //返回[1,2,3,4,5]

splice()

Array.splice()是數組中插入或刪除元素的通用方法不同於concat()和slice(),splice()會修改調用的數組
splice(index,howmany,item1,item2...)
第一個參數指定了插入或刪除的起始位置
第二個參數指定了應該從數組中刪除的元素的個數,如果省略,從起始點開始到數組結尾的所有元素都將被刪除
返回值:splice()返回一個由刪除元素組成的數組,或者沒有刪除元素,就返回空數組
刪除:

var a=[1,2,3,4,5];
a.splice(3);           //返回[4,5],a是[1,2,3]
a.splice(1,2);         //返回[2,3],a是[1]

插入:注意區別於concat(),splice()會插入數組本身而非數組的元素

var a=[1,2,3,4,5];
a.splice(2,0,'a','b')  //返回[],a是[1,2,'a','b',3,4,5]
a.splice(2,2,[1,2],3)  //返回[3,4],a是[1,2,[1,2],3,4,5]

push()、pop()、unshift()、shift()

數組的尾部插入元素、刪除元素:
push()、pop()
數組的頭部插入元素、刪除元素:
unshift()、shift()
這些方法都可以被splice()替代

toString()和toLocaleString()

toString()方法將數組的每個元素轉化爲字符串,返回用逗號分隔的字符串列表。注意,輸出不包括方括號或其他任何形式包裹數組數值的分隔符。

[1,2,3].toString();       //返回'1,2,3'
["a","b","c"].toString(); //返回'a,b,c'
[1,[2,'c']].toString();   //返回'1,2,c'

這裏與不使用任何參數調用join()方法返回的字符串是一樣的。

toLocaleString()是數組對象的本地字符串表示,返回結果隨機器不同而不同,最好不要在腳本中用來基本運算。

ECMAScript5中的數組方法

ECMAScript5中數組方法概述:
大多數方法第一個參數接收一個函數並且對數組中的每個元素調用一次該函數。對不存在的元素不調用該函數。
大多數情況下,調用提供的函數使用三個參數:數組元素、元素的索引和數組本身,通常只需要使用第一個參數,忽略後面兩個參數。
大多數ECMASscript數組方法第一個參數是一個函數,第二個參數可選。如果有第二個參數,則調用的函數被看成第二個參數的方法,即第二個參數可以在調用函數時將作爲它的this關鍵字的值來使用,起到修改指針的作用。

forEach()

array1.forEach(callbackfn[, thisArg])

參數 定義
array1 必需。 一個數組對象。
callbackfn 必需。 一個接受最多三個參數的函數。 對於數組中的每個元素,forEach 都會調用 callbackfn 函數一次。
thisArg可選 可在 callbackfn 函數中爲其引用 this 關鍵字的對象。 如果省略 thisArg,則 undefined 將用作 this 值。

如果 callbackfn 參數不是函數對象,則將引發 TypeError 異常。

對於數組中的每個元素,forEach 方法都會調用 callbackfn 函數一次(採用升序索引順序)。 不爲數組中缺少的元素調用該回調函數。

除了數組對象之外,forEach 方法可由具有 length 屬性且具有已按數字編制索引的屬性名的任何對象使用。

map()

map()方法將調用數組的每個元素傳遞給指定的函數,並返回一個數組,它包含該函數的返回值。
map()方法返回的是新數組,它不修改調用的數組;如果是稀疏數組,返回的也是相同方式的稀疏數組。它具有相同的長度,相同的缺失元素。

a=[1,2,3];
b=a.map(function(x){
    return x*x;          //b是[1,4,9]    
})

filter()

filter()方法創建並返回調用數組的一個子集。傳遞的函數用來進行邏輯判定的,該函數返回true或false。
返回true的元素將被添加成爲這個子集的成員。

a=[1,2,3,4,5];
b=a.filter(function(x){
    return x>3
})                 //b是[4,5]
c=a.filter(function(x,i){
    return i%2==0;
})                 //c是[1,3,5]

every()和some()方法

所有:every()每個數組元素回調函數都返回true的時候纔會返回true,當遇到false的時候終止執行,返回false;

a=[1,2,3,4];
a.every(function(x){
    return x < 10;      //返回true
});
a.every(function(x){
    return x % 2 == 0;  //返回false,並非所有元素都能被2整除   
})

存在:some()
存在有一個數組元素的回調函數返回true的時候終止執行並返回true,否則返回false。

a=[1,2,3,4];
a.some(function(x){
    return x % 2 == 0;  //返回true 
});
a.some(isNaN);    //false

reduce()和reduceRight()方法

遍歷數組,調用回調函數,將數組元素組合成一個值
參數1:回調函數:把兩個值合爲一個
參數2:value,一個初始值,可選
reduce從索引最小值開始
reduceRight反向,方法有兩個參數

var a=new Array(1,2,3,4,5,6);
console.log(a.reduce(function(v1,v2){
   return v1+v2;
}));              // 21
console.log(a.reduceRight(function(v1,v2){
   return v1-v2;
},100));          // 79

indexOf()lastIndexOf()方法

用於查找數組內指定元素位置,查找到第一個後返回其索引,沒有查找到返回-1,indexOf從頭至尾搜索,lastIndexOf反向搜索。

var a=new Array(1,2,3,3,2,1);
console.log(a.indexOf(2));     //1
console.log(a.lastIndexOf(2)); //4
console.log(a.IndexOf(4));     //-1,找不到
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章