js中的數組和字元串有點類似,不是說本質上,而是在遍歷,獲取時的類似。從標識來說,可以一眼看出那個是數組,那個是字元串;但在使用遍歷時,會不經意的將兩者混淆,導致方法用錯。同時兩者的方法又有好幾個相同的,但需註意語義,以及有些方法是不會對原數組產生影響的。以下是我整理的一些關於數組和字元串的一些方法 ...
js中的數組和字元串有點類似,不是說本質上,而是在遍歷,獲取時的類似。從標識來說,可以一眼看出那個是數組,那個是字元串;但在使用遍歷時,會不經意的將兩者混淆,導致方法用錯。同時兩者的方法又有好幾個相同的,但需註意語義,以及有些方法是不會對原數組產生影響的。以下是我整理的一些關於數組和字元串的一些方法,不保證完整性。
數組方法
arr.push() 可向數組的末尾添加一個或多個元素,並返回新的長度。會影響原數組
1 var a = [1,2]; 2 a.push(3); 3 console.log(a); // [1,2,3] 4 console.log(a.push(8)); //4
arr.unshift() 在數組開頭添加元素,返回該元素值。會影響原數組
1 var a = [1,2,3,"hello"]; 2 console.log(a.unshift("world")); // world 3 console.log(a); // ["world",1,2,3,"hello"]
arr.pop() 用於彈出數組最後一個元素,返回該元素的值。會影響原數組。(等同於在數組中刪除此元素)
1 var a = [1,2]; 2 console.log(a.pop()); // 2 3 console.log(a); // [1]
arr.shift() 將數組的第一個元素從中刪除,並且返回第一個元素的值。會影響原數組。(刪除操作)
var a = [1,2]; console.log(a.shift()); // 1 console.log(a); // [2]
arr.concat() 用於連接兩個或者多個數組,返回一個新的數組。不會影響原數組。
1 var arr = [1,2,3,4]; 2 alert(arr.concat(1,2,3,[1,2,3],5).length); //11 3 arr.concat(1,2,4,[1,2,3],5); 4 alert(arr.length) //4
arr.join() 接收一個參數作為分隔符,以字元串的形式返回。不會影響原數組。它接受0參數或者1個參數,若是傳了多個參數只有第一個是有效的。參數若是為無,預設為','
1 [1,2,3,4].join('0').split('') //["1", "0", "2", "0", "3", "0", "4"] 2 var arr = [1,2,3,4]; arr.join("&"); 3 console.log(arr) //[1,2,3,4]
arr.slice(n,m):用於切割並且創造一個新的數組,不會影響原數組。
- 1個參數: 從開始位置截取到結尾
- 2個參數: 從開始位置截取到結束位置 [a, b) 不包括結束位置本身
- 結束位置還可以是負數( 實際計算為:該負數 + 數組長度) 結束位置小於起始位置,返回 空數組 []
1 var a = [1, 2, 3]; 2 console.log(a.slice(1)); // [2, 3] 3 console.log(a.slice(1, 2)); // [2] 4 console.log(a); // [1, 2, 3] 原數組沒有被改變 5 console.log(a.slice(1, -1)); // (-1 + 3) = 2 > a.slice(1, 2) > [2] 6 console.log(a.slice(1, -100)); // []
arr.splice(n,m,data) 用於截取數據,插入數據,刪除數據。操作的是數據本身,所以會影響原數組。
- [開始位置]:當只有1個參數的時候:從數組的開始位置刪掉剩下的所有數據,返回刪掉的數據。
- [開始位置,截斷的個數](註意,這和 slice 的第二個參數意義可是不一樣的,這是 長度):以 n為起點,m為長度,刪掉 [n, n+ m) 的元素
- [開始位置,截斷個數,插入的數據]: (n, m, data): 以 n為起點, m為長度,刪掉 [n, n+ m] 的元素,並填充 data 到刪除的位置
1 var array = [15, 5, 10, 2, 0]; 2 console.log(array.splice(1, 3,1,2,1)); //5,10,2 3 console.log(array); //15, 1, 2, 1, 0 4 console.log(array.splice(1, 3)); //5,10,2 5 console.log(array); // [15,0] 6 console.log(array.splice(1)); // 0 7 console.log(array); //15
arr.reverse() 將數組元素倒順,會影響原數組。
1 var a = [1,2,3,5]; 2 console.log(a.reverse()); // [5,3,2,1]
arr.sort(fn) 排序方法,參數:fn(a,b):比較函數,無參數的時候按照字母表 ASCII 升順排序
1 var a = [1, 2, 3, 5, 10, 25]; 2 console.log(a.sort()); // [1, 10, 2, 25, 3, 5]
sort()
預設對每一個 子項 調用轉型方法 toString()
,之後才進行判斷。而這個時候其實是根據 ASCII 碼的大小來判斷的。因此 "15" < "5"。先比較第一位,再比較第二位。想要按我們預期的排序,需進行一些處理。
1 var array = [15, 5, 10, 2, 0]; 2 array.sort(function(a,b){ 3 return a-b; 4 }) 5 console.log(array); //[0, 2, 5, 10, 15]
以下為ES5新增方法(新增的方法都不會影響原數組)
arr.indexOf() 返回在該數組中第一個找到的元素位置,若不存在則返回 -1
1 var array = [15, 5, 10, 2, 0]; 2 console.log(array.indexOf(1)); //-1 3 console.log(array.indexOf(15)); //0
arr.forEach():對數組中的每一項運行給定函數,這個方法沒有返回值(遍曆數組,獲得數組所有元素)參數為function類型,預設有傳參(遍曆數組內容,對應數組索引,數組本身)
1 var array = [15, 5, 10, 2, 0]; 2 array.forEach(function (value, index, array) { 3 console.log(array[index]); 4 });
arr.map():對數組中的每一項運行給定函數,返回每次調用結果組成的數組。
1 var array = [15, 5, 10, 2, 0]; 2 var num = array.map(function (value, index, array) { 3 return value * 3; 4 }); 5 console.log(array, num); //[15, 5, 10, 2, 0] ,[45, 15, 30, 6, 0]
arr.filter():對數組中的每一項運行給定函數,返回該函數會返回 true 的項組成的數組(篩選)
1 var array = [15, 5, 10, 2, 0]; 2 var num = array.filter(function (value, index, array) { 3 return value >0; 4 }); 5 console.log(array, num); //[15, 5, 10, 2, 0] ,[15, 5, 10, 2]
兩個歸併的方法
- arr.reduce(function(pre, next, index, array) {}) 從左到右
- arr.reduceRight(function(pre, next, index, array) {}) 從右到左
some: 對數組中的每一項運行給定函數,如果函數對任一項返回 true,就會返回 true,否則 false
every:對數組中的每一項運行給定函數,如果函數對所有的項都返回 true,才返回 true,否則 false
以上就是我所知曉的所有數組方法,ES6還未涉及到,後續補充!!
字元串方法
indexOf(data,start) 用於返回某個數組或者字元串中規定字元或者字元串的位置;當前查詢字元所在的位置的下標,如無,返回-1,start表示從第幾位開始查詢。
1 var str="hello world!" 2 console.log(str.indexOf("h")); //0 3 console.log(str.indexOf("i")); //-1
str.lastIndexOf() 判斷一個字元最後一次出現在某個字元串的索引,如果包含返回它的索引,如果不包含返回-1.
1 var str="hello world!" 2 console.log(str.lastIndexOf("d")); // 10 3 console.log(str.lastIndexOf("i")); //-1
str.charAt() 返回指定位置的字元
1 var str="hello world!" 2 console.log(str.charAt(1)); //estr.substr(n,m) 從索引n開始,截取m個字元,將截取的字元返回,對原字元串沒有任何改變
1 var str="hello world!" 2 console.log(str.substr(1)); //ello world! 3 console.log(str.substr(1,3)) //ell
str.substring(n,m) 返回從指定位置n,到結束位置(不含)m 的字元串,如果不指定結束位置,則從開始位置到結尾
1 var str="hello world!" 2 console.log(str.substring(1)); //ello world! 3 console.log(str.substring(1,3)) //el
str.slice(n,m) 同substring,需要註意和數組中方法slice()的相似
1 var str="hello world!" 2 console.log(str.slice(1)); //ello world! 3 console.log(str.slice(1,3)) //el
str.split("-") 通過指定字元分割字元串,返回一個數組
1 var str="hello world!" 2 console.log(str.split(" ")); // ["hello", "world!"]
str.replace("需要替換的字元串","替換之後的字元串") 將字元串中的一些字元替換為另外一些字元。最好配合正則使用
1 var str="hello world!" 2 console.log(str.replace("l","*")); // he*lo world!
str.charCodeAt() 返回指定索引出的unicode字元
1 var str="hello world!" 2 console.log(str.charCodeAt(0)); // 104
str.concat() 拼接2個字元串,返回一個新字元串,對原有字元串沒有任何改變。
1 var str="hello world!" 2 console.log(str.concat("d")); // hello world!d 3 console.log(str); //hello world!
str.match() 可在字元串內檢索指定的值,或找到一個或多個正則表達式的匹配。把找到的字元放在數組裡,返回一個數組。
1 var str="hello world!" 2 console.log(str.match("d")); // ["d", index: 10, input: "hello world!", groups: undefined]
str.search() 方法用於檢索字元串中指定的子字元串,或檢索與正則表達式相匹配的子字元串。
1 var str="hello world!" 2 console.log(str.search("d")); // 10 3 console.log(str.search("l")); //2
以上為字元串的方法,同數組,不涉及ES6的!!
註意方法是否會影響原數組!!