JavaScript中幾個相似方法對比

標籤：字串   start   倒數   

一、substring與substr

	substring	substr
概述	返回字串兩個索引之間（或到字串末尾）的子串	返回字串從指定位置開始到指定長度的子串
文法	650) this.width=650;" src="http://images2015.cnblogs.com/blog/211606/201702/211606-20170207131932526-1612700630.png" style="border:0px;margin-top:10px;" />	650) this.width=650;" src="http://images2015.cnblogs.com/blog/211606/201702/211606-20170207132303494-842242559.png" style="border:0px;margin-top:10px;" />
參數	indexStart：一個 0 到字串長度之間的整數 indexEnd：可選，一個 0 到字串長度之間的整數	start：開始提取字元的位置，可為負值 length：可選。提取的字元數
描述	1. indexStart = indexEnd，返回一個Null 字元串 2. indexStart > indexEnd，則效果是兩個參數調換了一樣 3. 省略 indexEnd，提取字元一直到字串末尾 4. 任一參數 < 0 或為 NaN，則被當作 0 5. 任一參數 > strLength（字串長度），則被當作strLength	1. start < 0，則被看作 strLength + start（從字串倒數算起） 2. start < 0 && abs(start) > strLength，則start = 0 3. start >= strLength，返回一個Null 字元串 4. 任意參數為 NaN，則被當作 0 5. length <= 0，返回一個Null 字元串
代碼	線上執行

1）substring描述

返回字串兩個索引之間（或到字串末尾）的子串。

650) this.width=650;" src="/img/fz.gif" alt="複製代碼" style="margin-top:10px;border:none;" />

var anyString = "Mozilla";//字串長度為7// 輸出 "Moz"console.log(anyString.substring(0,3));console.log(anyString.substring(3,0));//indexStart > indexEnd，則像兩個參數對換console.log(anyString.substring(3,-3));//indexEnd < 0，則indexEnd = 0console.log(anyString.substring(3,NaN));//indexEnd = NaN，則indexEnd = 0console.log(anyString.substring(-2,3));//indexStart < 0，則indexStart = 0console.log(anyString.substring(NaN,3));//indexStart = NaN，則indexStart = 0// 輸出 "lla"console.log(anyString.substring(4,7));console.log(anyString.substring(7,4));//indexStart > indexEnd，則像兩個參數對換，同上// 輸出 ""console.log(anyString.substring(4,4));//indexStart = indexEnd// 輸出 "Mozilla"console.log(anyString.substring(0,7));console.log(anyString.substring(0,10));//indexEnd > anyString.length，indexEnd=anyString.length。console.log(anyString.substring(0));//省略 indexEnd，提取字元一直到字串末尾

650) this.width=650;" src="/img/fz.gif" alt="複製代碼" style="margin-top:10px;border:none;" />

 

2）substr描述

返回字串從指定位置開始到指定長度的子串。

650) this.width=650;" src="/img/fz.gif" alt="複製代碼" style="margin-top:10px;border:none;" />

var str = "abcdefghij";//長度為10// 輸出bcconsole.log(str.substr(1,2));// 輸出hi，start=7console.log(str.substr(-3,2));//start < 0，則被看作 strLength + start，其中 strLength 為字串的長度// 輸出hijconsole.log(str.substr(-3));//start < 0，省略length// 輸出bcdefghijconsole.log(str.substr(1));// 輸出ab start=0console.log(str.substr(-20,2)); //abs(start) > 字串的長度，start=0// 輸出""console.log(str.substr(20,2));  //start >= 字串的長度，輸出Null 字元串// 輸出""console.log(str.substr(1,0));console.log(str.substr(1,-5));//length <= 0，返回一個Null 字元串console.log(str.substr(1,NaN));//end非數字, end=0// 輸出aconsole.log(str.substr(NaN, 1));//start非數字, start=0

650) this.width=650;" src="/img/fz.gif" alt="複製代碼" style="margin-top:10px;border:none;" />

 

二、slice與splice

	slice	splice
概述	將數組的一部分的淺拷貝, 返回到從開始到結束（結束不包括）選擇的新數組對象 原始數組不改變	通過刪除現有元素和/或添加新元素來更改數組的內容 原始數組會改變
文法	650) this.width=650;" src="http://images2015.cnblogs.com/blog/211606/201702/211606-20170207194212354-1575944145.png" style="border:0px;margin-top:10px;" />	650) this.width=650;" src="http://images2015.cnblogs.com/blog/211606/201702/211606-20170207194134526-1428088417.png" style="border:0px;margin-top:10px;" />
參數	begin：可選，開始提取的索引（從0開始），可為負值 end：可選，結束提取的索引（包含begin，不包含end），可為負值	start：開始修改的索引（從0開始），可為負值 deleteCount：可選，要移除的數組元素的個數 item1，item2...：可選，要添加進數組的元素，從start位置開始
返回	一個含有提取元素的新數組	由被刪除的元素組成的一個數組 如果沒有刪除元素，則返回空數組。
描述	1. 原始數組沒有修改，淺複製了原數組的元素 2. 任何參數為負數，改變計算方式，從數組倒數算起 3. 任何參數為NaN，則被當作 0 4. start 省略，start=0 5. start > end，輸出空數組	1. 原始數組被修改，在指定位置可添加任意多個元素 2. start <0 為負數，改變計算方式，從數組倒數算起 3. start 或 deleteCount 為NaN，則被當作 0 4. start 省略，輸出空數組 5. deleteCount > 數組長度，則deleteCount=數組長度
代碼	線上執行

1） slice描述

將數組的一部分的淺拷貝, 返回到從開始到結束（結束不包括）選擇的新數組對象，原始數組不改變。

650) this.width=650;" src="/img/fz.gif" alt="複製代碼" style="margin-top:10px;border:none;" />

var fruits = [‘Banana‘, ‘Orange‘, ‘Lemon‘, ‘Apple‘, ‘Mango‘];var citrus = fruits.slice(1, 3);//包含1 不包含3// 輸出 [‘Banana‘, ‘Orange‘, ‘Lemon‘, ‘Apple‘, ‘Mango‘]console.log(fruits);//原始數組沒有修改// 輸出 [‘Orange‘, ‘Lemon‘]console.log(citrus);//淺複製了原數組的元素// 輸出 [‘Banana‘, ‘Orange‘, ‘Lemon‘, ‘Apple‘, ‘Mango‘]console.log(fruits.slice());// start 省略，start=0// 輸出 [‘Apple‘, ‘Mango‘]console.log(fruits.slice(-2));// start < 0，從數組倒數算起// 輸出 [‘Apple‘]console.log(fruits.slice(-2, -1));// start < 0 && end < 0，從數組倒數算起，倒數第二個元素到倒數第一個元素// 輸出 [‘Orange‘, ‘Lemon‘, ‘Apple‘]console.log(fruits.slice(1, -1));// 輸出 []console.log(fruits.slice(2, 1));// start > end，輸出空數組// 輸出 [‘Banana‘]console.log(fruits.slice(NaN, 1));// start非數字，start=0// 輸出 []console.log(fruits.slice(1, NaN));// end非數字，end=0

650) this.width=650;" src="/img/fz.gif" alt="複製代碼" style="margin-top:10px;border:none;" />

 

2） splice描述

通過刪除現有元素和/或添加新元素來更改數組的內容，原始數組會改變。

650) this.width=650;" src="/img/fz.gif" alt="複製代碼" style="margin-top:10px;border:none;" />

var myFish = ["angel", "clown", "mandarin", "sturgeon"];// 輸出 []console.log(myFish.splice(2, 0, "drum"));// 空，沒有刪除元素console.log(myFish);//原數組被改變 myFish=["angel", "clown", "drum", "mandarin", "sturgeon"]// 輸出 ["drum"]console.log(myFish.splice(2, 1));// 有刪除元素 myFish=["angel", "clown", "mandarin", "sturgeon"]myFish.splice(2, 1, "splice", "parrot");console.log(myFish);//添加兩個元素 myFish=["angel", "clown", "splice", "parrot", "sturgeon"]// 輸出 ["parrot", "sturgeon"]console.log(myFish.splice(-2));// start < 0，從數組倒數算起 myFish=["angel", "clown", "splice"]// 輸出 []console.log(myFish.splice(-2, -1));// start < 0 && deleteCount < 0，空數組console.log(myFish.splice(1, -1));//空數組console.log(myFish.splice(1, NaN));// deleteCount非數字，deleteCount=0console.log(myFish.splice());// start省略// 輸出 ["angel"]console.log(myFish.splice(NaN, 1));// start非數字，start=0  myFish=["clown", "splice"]// 輸出 ["clown", "splice"]console.log(myFish.splice(0, 10));// deleteCount > 數組長度

650) this.width=650;" src="/img/fz.gif" alt="複製代碼" style="margin-top:10px;border:none;" />

JavaScript中幾個相似方法對比