JS中數組和字符串的方法大全

　　數組的方法很多，ECMScript5又提供了好幾種方法。有空把之前的雲上的筆記整理了一下，方便自己以后查找使用。

一、ECMScript 3的Array.prototype中定義的方法

1、join()
定義：將數組中所有的元素都轉化為字符串拼接在一起，返回最后生成的字符串。
注意：不改變原數組

var a = [1,2,3];
console.log(a.join());    //1,2,3 默認使用逗號分隔
console.log(a.join(""));  //123   轉化為字符串的常用方法
console.log(a.join("-")); //1-2-3 自定義分隔符
console.log(a);           //[1,2,3]  不修改原素組
var b = new Array(5);
console.log(b.join('*')); //****  4個連字號組成字符串

 

2、reverse()
定義：將數組中的元素顛倒順序，返回逆序的字符串。
注意：原數組被改變

var a2=[1,2,3];
console.log(a2.reverse());        //[3,2,1]
console.log(a2);                  //[3,2,1]原數組被修改
console.log(a2.reverse().join()); //1,2,3 因為原數組又被修改了

　　

3、sort()
定義：將數組中的元素排序后返回排序后的數組、
注意：數組以字母表順序排。
原數組被改變
可以自定義按非字母的順序排序，只要個sort()傳入一個比較的匿名的比較函數可以了。
該比較函數決定了兩個參數的在排好數組中的先后順序，加入第一個參數在前，返回小於0的值，反之。相等為0。

    var a3=['c','b',undefined,'a','z'];
    console.log(a3.sort());    //["a", "b", "c", "z", undefined],undefined被排到最后
    console.log(a3);           //["a", "b", "c", "z", undefined]修改原數組  

    //自定義排序規則
    var a4 = [33,4,1111,2222];
    //console.log(a4.sort());  //[1111, 2222, 33, 4] 默認排序
    a4.sort(function(a,b){
    	return a-b;            
    });
    console.log(a4);           //[4, 33, 1111, 2222]

　　

4、concat()
定義：創建並返回一個新數組。新數組由原數組和concat()里面的參數組成
注意：不改變原數組
只能扁平化一維數組，高維不行（不會遞歸扁平化數組），高維數組（扁平化）降維可以看。扁平化多維數組。

    var a5 = [1,2,3];
    console.log(a5.concat(4));            //[1,2,3,4]
    console.log(a5);                      //[1,2,3]  //原數組不改變
    console.log(a5.concat([4,5]));        //[1, 2, 3, 4, 5]
    console.log(a5.concat([4,5,[6,7]]));  //[1, 2, 3, 4, 5,[6,7]] //只能扁平化一維

　　

5、slice()
定義：返回指定數組的片段或者子數組，兩個參數分別指是片段的開始和結束位置（不包含結束的位置）。
注意：不改變原數組
如果沒有參數，相當於生成一原數組的副本
生成的新數組不包含結束位置的元素
說明：字符串也可以使用這個方法 ,如"[Object Array]".slice(8,-1); =>Array

   var a6 = [1,2,3,4,5];
   console.log(a6.slice(1,3));   //[2,3]  //索引從1到3但包括3的子數組
   console.log(a6);              //[1,2,3,4,5]  //原數組不改變
   console.log(a6.slice(1));     //[2,3,4,5] 只有一個參數，則從該參數位置到末尾
   console.log(a6.slice(1,-1));  //[2,3,4] 參數為-1只向最后一個元素，但不包括它
   console.log(a6.slice(-2,-1))  //[4] 從倒數第2個數到倒數第一個數，但不包括倒數第一個數

　　

6、splice()
定義：在數組中輸入和刪除元素的通用方法。返回的是由刪除元素組成的新數組，沒有刪就返回空數組[]
前兩個參數是指定需要刪除的元素，后面的任意個數的參數是需要插入到原數組的元素
注意：原數組被改變

   var a7 = [1,2,3,4,5];
   b7 = a7.splice(2); 
   console.log(b7);      //[3,4,5]   返回原數組從索引為2的元素到結尾被刪除的部分
   console.log(a7);      //[1,2]     原數組是被修改之后的數組
   
   b7 = a7.splice(1,2); 
   b7 = a7.splice(1,1);  // 從索引為1的元素開始刪除1個元素   
   console.log(b7);      //[2,3]   從索引為1的元素開始刪除2個元素，也就是2和3
   console.log(a7);      //[1,4,5] 原數組是被刪除之后剩余的數組
 
   var b7 = a7.splice(1,0,100); 
   console.log(b7);      //[] 因為沒有刪除元素，所有返回的是一個空數組
   console.log(a7);      //[1, 100, 2, 3, 4, 5] 從索引為1的元素開始，刪除0個元素，之后原索引為1的位置插入新元素

　　

7、push()和pop()
定義：push在數組的末尾添加一個或者多個元素，返回新數組的長度。所以不能鏈式操作
pop刪除數組的最后一個元素，返回它刪除的值元素

組合使用push()和pop()可以實現先進后出的棧

var a8 = [1,2,3];
var b8 = a8.push(4,5);
console.log(b8);   //5  返回的是新數組的長度。
console.log(a8);   //[1,2,3,4,5] 直接原數組尾部添加4
   
var a9 = [1,2,3];
var b9 = a9.pop();
console.log(b9);   //3  返回的刪除的元素。
console.log(a9);   //[1,2] 直接在原數組上刪除元素3

//棧
var stack = [];
stack.push(1,2,3);
console.log(stack);  //[1,2,3]
stack.pop();
console.log(stack);  //[1,2]
stack.push(100)    
console.log(stack);  //[1, 2, 100]
stack.pop()
console.log(stack);  //[1, 2]

　　

8、unshift()和shift()
定義：unshift是在數組頭部添加一個或多個元素。如果一次性傳入多個參數，多個參數按照按照原先的位置直接加到數
組中。返回新數組的新數組的長度。
shift:刪除數組的第一個元素，並返回刪除的元素

//組合使用push()和()可以實現先進先出的隊列
var queue = [];
queue.push(1,2,3);
console.log(queue);  //[1,2,3]
queue.shift();
console.log(queue);  //[2,3]
queue.push(100)    
console.log(queue);  //[2, 3, 100]
queue.shift();
console.log(queue);  //[3,100]
queue.shift();
console.log(queue);  //[100]

　　

9、toString()
定義：將數組數組中的每個元素轉化為字符串。 輸出用逗號分隔的字符串列表（可能數組的內部元素(數組)還會再次調
用toString()，高維數組扁平化正是利用這點）
注意：與不使用任何參數調用的jion()方法返回的字符串一樣。

var a10 = [1,2,3];
var a11 = [1,2,[3,4,[5,6]]];
console.log(a10.toString());  //1,2,3
console.log(a10);             //原數組         
console.log(a11.toString());  //1,2,3,4,6
console.log(a11);             //原數組

　　

二、ECMScript 5中的數組方法

1、forEach()  //遍歷
定義：該方法從頭到尾遍歷數組，為某個元素調用指定的函數。傳遞函數包括三個參數（數組元素、元素索引、數組本身
），如果只關心數組元素的值，可以只傳一個參數。
注意：無法在所有元素的都傳遞給調用函數之前提前結束。也就是沒有像for中一樣的break語句。如果要提交終止，可以
把forEach（）方法放到try塊中。如果forEach()調用的函數拋出forEach.break異常，循環提前結束

var data = [1,2,3];
var sum = 0;
data.forEach(function(value){
  sum+=value;
});
console.log(sum);  //6

var data = [10,20,30];
data.forEach(function(v,i,a){
  a[i] = v*2;
});
console.log(data) //[20, 40, 60]

　　

2、map()     //映射
定義：將調用的數組的每個元素傳遞給指定的函數，並返回一個新數組，它包含該該函數的返回值
注意：傳遞給map的函數應該有返回值，返回的是新數組，不修改調用的數組。

var data3 = [1,2,3];
var b = data3.map(function(val){
   return   val*10;
});
console.log(data3);  //[1,2,3]     不改變原數組
console.log(b);      //[10,20,30]  新數組

　　

3、filter() //過濾
定義：返回的數組元素是調用的數組的一個子集，就傳遞的函數是用來做邏輯判定的，返回true，傳給給判定函數的元素就是這個子集的成員。

var data4 = [1,2,3,4,5];
var b2 = data4.filter(function(val){
  return val<3;
});
console.log(b2);     //[1,2]
console.log(data4);  //[1,2,3,4,5] 不改變原數組   

var b3 = data4.filter(function(val,i){
  return i%2;
});
console.log(b3);     //[2,4] 返回索引為奇數的元素組成的數組

4、every() 和some()
這兩種方法是數組的邏輯判定，他們針對數組中的所有元素應用指定的函數進行判定。返回true或者false
定義:every 當且僅針對數組中的所有元素調用判定的函數都返回true,它才返回true
some 至少有一個判定為true就返回true.

 

5、reduce()
定義：使用指定的函數將數組元素進行組合，生成一個單值。參數一是執行簡化操作的函數，參數二是傳給簡化函數的初始值。

注意：一旦確認之后，就停止遍歷數組了。

var data5 = [1,2,3];
var sum = data5.reduce(function(x,y){
  return  x+y;
},0);
console.log(sum);  //6

var product = data5.reduce(function(x,y){
  return  x*y;
},100);
console.log(product);  //600 

　

6、indexOf()和lastIndexOf()
定義：搜索整個數組中具有給定值的位子，返回找到第一個元素的索引，如果沒有找到就返回-1；indexOf()是從頭找到尾，lastIndexOf()正好相反
注意：不接受函數作為參數，第一個參數是需要搜索的值，第二個參數是可選的，表示從哪里搜索，可以是負數，表示相對數組末尾的偏移量。
說明：字符串也有這兩個方法，功能類似。

var data6 = [1,2,3,3,4,3,5];
console.log(data6.indexOf(3)); //2 第一個3的索引是2

　　

7、isArray()
定義：判斷對象是不是數組

 

三、作為數組的字符串

1、簡單的使用

var str = "test"

str.charAt(1) //e
str[1]        //e

　　

2、可以調用數組的方法

注意：字符串是不可變的值，當成數組看待是只可讀的。所以像push() sort() reverse() splice()等會修改原數組的方法，在字符串上是無效的。錯誤可能都沒有提示！

var str = "hello";
Array.prototype.join.call(str," "); //"h e l l o"

Array.prototype.filter.call(str, function(x){
  return x.match(/o/g);             //["o"]
});

　　

 

String 對象方法

常用的:

chatAt()

indexOf()

match()

replace()

slice() //數組也是

split() //數組也是     split(/\s+/) 按中間一個或多個空字符串分隔成數組，如獲取字符串中的單詞

substr()

substring()

等

方法	描述
anchor()	創建 HTML 錨。
big()	用大號字體顯示字符串。
blink()	顯示閃動字符串。
bold()	使用粗體顯示字符串。
charAt()	返回在指定位置的字符。
charCodeAt()	返回在指定的位置的字符的 Unicode 編碼。
concat()	連接字符串。
fixed()	以打字機文本顯示字符串。
fontcolor()	使用指定的顏色來顯示字符串。
fontsize()	使用指定的尺寸來顯示字符串。
fromCharCode()	從字符編碼創建一個字符串。
indexOf()	檢索字符串。
italics()	使用斜體顯示字符串。
lastIndexOf()	從后向前搜索字符串。
link()	將字符串顯示為鏈接。
localeCompare()	用本地特定的順序來比較兩個字符串。
match()	找到一個或多個正則表達式的匹配。
replace()	替換與正則表達式匹配的子串。
search()	檢索與正則表達式相匹配的值。
slice()	提取字符串的片斷，並在新的字符串中返回被提取的部分。
small()	使用小字號來顯示字符串。
split()	把字符串分割為字符串數組。
strike()	使用刪除線來顯示字符串。
sub()	把字符串顯示為下標。
substr()	從起始索引號提取字符串中指定數目的字符。
substring()	提取字符串中兩個指定的索引號之間的字符。
sup()	把字符串顯示為上標。
toLocaleLowerCase()	把字符串轉換為小寫。
toLocaleUpperCase()	把字符串轉換為大寫。
toLowerCase()	把字符串轉換為小寫。
toUpperCase()	把字符串轉換為大寫。
toSource()	代表對象的源代碼。
toString()	返回字符串。
valueOf()	返回某個字符串對象的原始值。