String類型的屬性和方法

屬性

  字符串String類型的每個實例都有一個length屬性,表示字符串中的字符個數。由於字符串是不可變的,所以字符串的長度也不可變

  字符串的length屬性不會在for/in循環中枚舉,也不能通過delete操作符刪除

  [注意]對於字符串s來說,最後一個字符的索引是s.length - 1

var str = "test";
console.log(str.length);//4str.length = 6;
console.log(str,str.length);//"test",4

 

實例方法

  字符串String對象有多達20多個實例方法,包括toString()、toLocaleString()、valueOf()從Object對象繼承的3種對象通用方法,chartAt()、中括號[]、charCodeAt()和fromCharCode()4種訪問字符方法,concat()和加號+這2種字符串拼接方法,slice()、substr()和substring()3種創建子字符串方法,toLowerCase()、toLocaleLowerCase()、toUpperCase()、toLocaleUpperCase()這4種大小寫轉換方法,indexOf()和lastIndexOf()這2種查找字符串位置的方法,match()、search()、replace()、split()這4種正則匹配方法以及去除首尾空格的trim()方法和字符串比較的localeCompare()方法

 

對象通用方法

  String類型是與字符串對應的包裝類型,繼承了Object對象的通用方法toString()、toLocaleString()、valueOf()這三個方法

【toString()】

  toString()方法返回string的原始字符串值

【toLocaleString()】

  toLocaleString()方法返回string的原始字符串值

【valueOf()】

  valueOf()方法返回string的原始字符串值

console.log("test".valueOf());//"test"console.log("test".toString());//"test"console.log("test".toLocaleString());//"test"

 

訪問字符方法

  字符串的訪問字符方法總共有chartAt()、中括號[]、charCodeAt()和fromCharCode()四種

【chartAt()】

  charAt()方法接收一個基於0的字符位置的參數,返回指定位置的字符。當參數爲空或NaN時,默認參數爲0;當參數超出範圍時,則返回一個空字符串 

複製代碼

var str = "hello";
console.log(str.charAt(1));//econsole.log(str.charAt(-1));//''console.log(str.charAt(10));//''console.log(str.charAt());//h 
console.log(str.charAt(NaN));//h

複製代碼

  charAt()方法涉及到Number()函數的隱式類型轉換,如果轉換爲數值,則按照上述規則輸出字符串;如果轉換爲NaN,則輸出第0個字符

複製代碼

var str = "hello";
console.log(str.charAt(true));//'e'console.log(str.charAt(false));//'h'console.log(str.charAt('abc'));//'h'console.log(str.charAt({}));//'h'console.log(str.charAt([2]));//'l'

複製代碼

  [注意]x.charAt(pos)與x.substring(pos, pos+1)、x.substr(pos,1)、x.slice(pos,pos+1)的結果相等

var str = "hello";
console.log(str.charAt(1));//'e'console.log(str.substring(1,2));//'e'console.log(str.slice(1,2));//'e'console.log(str.substr(1,1));//'e'

【中括號】

  ECMAScript5定義了另一個訪問字符的方法,使用方括號加數字索引來訪問字符串中的特定字符。如果參數超出範圍或是NaN時,則輸出undefined;沒有參數時,會報錯;該方法沒有Number()轉型函數的隱式類型轉換,但參數爲單數值數組時可轉換爲數值

  [注意]IE7-瀏覽器不支持

複製代碼

var str = "hello";
console.log(str[0]);//hconsole.log(str`1`);//econsole.log(str[false]);//undefinedconsole.log(str[-1]);//undefinedconsole.log(str[NaN]);//undefinedconsole.log(str[]);//報錯

複製代碼

【charCodeAt()】

  charCodeAt()方法類似於charAt()方法,接收一個基於0的字符位置的參數,但返回的是指定位置的字符16位Unicode編碼。返回值是一個16位的整數,在0-65535之間,即0x0000-0xffff之間

  參數爲空或NaN時,默認參數爲0;當參數超出範圍時,則返回NaN

複製代碼

var str = "hello";
console.log(str.charCodeAt());//104console.log(str.charCodeAt(0));//104console.log(str.charCodeAt(1));//101console.log(str.charCodeAt(-1));//NaNconsole.log(str.charCodeAt(10));//NaNconsole.log(str.charCodeAt(NaN));//104

複製代碼

  同樣地,charCodeAt()方法涉及到Number()函數的隱式類型轉換,如果轉換爲數值,則按照上述規則輸出相應值;如果轉換爲NaN,則輸出第0個字符的字符編碼

複製代碼

var str = "hello";
console.log(str.charCodeAt(true));//101console.log(str.charCodeAt(false));//104console.log(str.charCodeAt('abc'));//104console.log(str.charCodeAt({}));//104console.log(str.charCodeAt([2]));//l08

複製代碼

【fromCharCode()】

  String構造函數本身有一個靜態方法:fromCharCode()。這個方法的任務是接收一個或多個字符編碼,然後把它們轉換成一個字符串。從本質上看,這個方法與實例方法charCodeAt()執行的是相反的操作。若參數爲空或NaN時,則返回空字符串;若參數超出0-65535的範圍,則輸出字符不可控

複製代碼

console.log(String.fromCharCode(104,101,108,108,111));//'hello'console.log(String.fromCharCode(0x6211,0x662f,0x5c0f,0x706b,0x67f4));//'我是小火柴'console.log(String.fromCharCode());//''console.log(String.fromCharCode(NaN));//''console.log(String.fromCharCode(-1));
console.log(String.fromCharCode(65560));

複製代碼

  如果一個字符佔用四字節,則需要拆成兩個字符表示

console.log(String.fromCharCode(0xD842, 0xDFB7)); // ""

 

字符串拼接

  關於字符串拼接共有concat()和加號+兩種方法

【concat()】

  concat()方法用於將一個或多個字符串拼接起來,返回拼接得到的新字符串,而原字符串不發生改變。若參數(第一個參數除外)不是字符串,則通過String()方法隱式轉換爲字符串,再進行字符串拼接

var stringValue = 'hello ';var result = stringValue.concat('world','!');
console.log(result);//'hello world!'console.log(stringValue);//'hello'

  [注意]第一個參數只能是字符串,如果是其他類型(數組除外)則報錯

(1).concat('2');//報錯(true).concat('false');//報錯({}).concat('abc');//報錯

  [注意]由於數組也存在concat()方法,參數會按照首先出現的參數是數組還是字符串來決定如何轉換

'1,2,3,'.concat([4,5]);//'1,2,3,4,5'[1,2,3].concat(',4,5');//[1, 2, 3, ",4,5"]

【加號運算符(+)】

  雖然concat()是專門用來拼接字符串的方法,但實踐中使用更多的還是加號運算符(+)。使用加號運算符在許多時候都比concat()簡單方便

var stringValue = 'hello ';
console.log(stringValue.concat('world','!'));//'hello world!'console.log(stringValue + 'world' + '!');//'hello world!'

  [注意]當操作數其中一個是字符串,或者對象轉換爲字符串時,才進行字符串拼接

複製代碼

1 + 2;//3'1' + 2;//'12'var o = {valueOf:function(){return '1';}};
o + 2;//'12'var o = {valueOf:function(){return 1;}};
o + 2;//3

複製代碼

 

創建子字符串

  創建子字符串共有slice()、substr()和substring()三種方法

【slice()】

  slice(start,end)方法需要兩個參數start和end,返回這個字符串中從start位置的字符到(但不包含)end位置的字符的一個子字符串;如果end爲undefined或不存在,則返回從start位置到字符串結尾的所有字符

  如果start是負數,則start = max(length + start,0)

  如果end是負數,則end = max(length + end,0)

  start和end無法交換位置

複製代碼

var stringValue = 'hello world';
console.log(stringValue.slice());//'hello world'console.log(stringValue.slice(2));//'llo world'console.log(stringValue.slice(2,undefined));//'llo world'console.log(stringValue.slice(2,-5));//'llo 'console.log(stringValue.slice(2,-20));//''console.log(stringValue.slice(20));//''console.log(stringValue.slice(-2,2));//''console.log(stringValue.slice(-2,-20));//''            console.log(stringValue.slice(-2,20));//'ld'console.log(stringValue.slice(-20,2));//'he'console.log(stringValue.slice(-20,-2));//'hello wor'

複製代碼

  slice()方法涉及到Number()轉型函數的隱式類型轉換,當start被轉換爲NaN時,相當於start = 0;當end被轉換爲NaN時(end爲undefined除外),則輸出空字符串

複製代碼

var stringValue = 'hello world';
console.log(stringValue.slice(NaN));//'hello world'console.log(stringValue.slice(0,NaN));//''console.log(stringValue.slice(true,[3]));//'el'console.log(stringValue.slice(null,undefined));//'hello world'console.log(stringValue.slice({}));//'hello world'console.log(stringValue.slice('2',[5]));//'llo'

複製代碼

【substring()】

  substring(start,end)方法需要兩個參數start和end,返回這個字符串中從start位置的字符到(但不包含)end位置的字符的一個子字符串;如果end爲undefined或不存在,則返回從start位置到字符串結尾的所有字符

  如果任一參數是NaN或負數,則被0取代

  如果任一參數大於字符串長度,則被字符串長度取代

  如果start 大於 end,則交換它們的值

複製代碼

var stringValue = 'hello world';
console.log(stringValue.substring());//'hello world'console.log(stringValue.substring(2));//'llo world'console.log(stringValue.substring(2,undefined));//'llo world'console.log(stringValue.substring(20));//''console.log(stringValue.substring(-2,2));//'he'console.log(stringValue.substring(NaN,2));//'he'console.log(stringValue.substring(-2,20));//'hello world'console.log(stringValue.substring(3,2));//'l'console.log(stringValue.substring(3,NaN));//'hel'console.log(stringValue.substring(-20,2));//'he'console.log(stringValue.substring(-20,-2));//''

複製代碼

  同樣地,substring()方法也涉及到Number()轉型函數的隱式類型轉換

var stringValue = 'hello world';
console.log(stringValue.substring(true,[3]));//'el'console.log(stringValue.substring(null,undefined));//'hello world'console.log(stringValue.substring({}));//'hello world'console.log(stringValue.substring('2',[5]));//'llo'

【substr()】

  substr(start,end)方法需要兩個參數start和end,end代表返回的子字符串的字符個數;該方法返回這個字符串中從start位置的字符開始的end個字符的一個子字符串;如果end爲undefined或不存在,則返回從start位置到字符串結尾的所有字符

  如果start是負數,則start = max(length + start,0)

  如果start是NaN,則相當於start = 0

  如果end是負數或NaN,則end = 0,因此會返回空字符串

  start和end無法交換位置

  [注意]該方法不是ECMAScript標準,已經被棄用

  [注意]IE8-瀏覽器在處理向substr()傳遞負值的情況時存在問題,它會返回原始的字符串

複製代碼

var stringValue = 'hello world';
console.log(stringValue.substr());//'hello world'console.log(stringValue.substr(2));//'llo world'console.log(stringValue.substr(2,undefined));//'llo world'console.log(stringValue.substr(2,NaN));//''console.log(stringValue.substr(NaN,2));//'he'console.log(stringValue.substr(20));//''console.log(stringValue.substr(-2,3));//'ld'console.log(stringValue.substr(-2,20));//'ld'console.log(stringValue.substr(-20,2));//'he'console.log(stringValue.substr(-20,-2));//''    console.log(stringValue.substr(2,5));//llo w

複製代碼

  同樣地,substr()方法也涉及到Number()轉型函數的隱式類型轉換

var stringValue = 'hello world';
console.log(stringValue.substr(true,[3]));//'el'console.log(stringValue.substr(null,undefined));//'hello world'console.log(stringValue.substr({}));//'hello world'console.log(stringValue.substr('2',[5]));//'llo w'

  [注意]對於以上三個創建子串的方法來說,如果是空字符串,則無論參數是什麼,仍然返回空字符串

var str = '';
console.log(str.slice(1));//''console.log(str.substring(1));//''console.log(str.substr(1));//''

 

大小寫轉換

  ECMAScript中涉及字符串大小寫轉換的方法有4個:toLowerCase()、toLocaleLowerCase()、toUpperCase()、toLocaleUpperCase()

  toLowerCase()和toUpperCase()是兩個經典的方法,借鑑自java.lang.String中的同名方法。而toLocaleLowerCase()和toLocaleUpperCase()方法則是針對特定地區的實現,對有些地區來說,針對地區的方法與其通用方法得到的結果相同,但少數語言(如土耳其語)會爲Unicode大小寫轉換應用特殊的規則,這時候就必須使用針對地區的方法來保證實現正確的轉換

【toUpperCase()】

  toUpperCase()方法將字符串轉換成大寫

【toLowerCase()】

  toLowerCase()方法將字符串轉換成小寫

【toLocaleUpperCase()】

  toLocaleUpperCase()方法將字符串轉換成大寫(針對地區)

【toLocaleLowerCase()】

  toLocaleLowerCase()方法將字符串轉換成小寫(針對地區)

  [注意]在不知道自己的代碼將在哪個語言環境中運行的情況下,使用針對地區的方法更穩妥

var string = 'Hello World';
console.log(string.toLowerCase());//hello worldconsole.log(string.toLocaleLowerCase());//hello worldconsole.log(string.toUpperCase());//HELLO WORLDconsole.log(string.toLocaleUpperCase());//HELLO WORLD

  這4種方法均不支持String()隱式類型轉換,只支持字符串類型

(true).toLowerCase();//報錯(2).toLocaleLowerCase();//報錯({}).toUpperCase();//報錯([]).toLocaleUpperCase();//報錯

  [注意]大小寫轉換方法可以連續使用

var string = 'Hello World';
console.log((string.toUpperCase()).toLowerCase());//hello world

   將帶有分割符的字符串轉換爲駝峯的形式

複製代碼

var txt = "border-top-left";var arr = txt.split('-');for(var i = 1; i < arr.length; i++){
    arr[i] = arr[i].charAt(0).toUpperCase() + arr[i].slice(1);
}var result = arr.join('');
console.log(result);//'borderTopLeft"

複製代碼

 

查找子串位置

  有兩個從字符串中查找子字符串位置的方法:indexOf()和lastIndexOf()。查找子串位置的方法同訪問字符方法charAt()和中括號[]方法有相反的地方,一個通過字符串查找位置,一個則是通過位置查找字符

【indexOf()】

  indexOf(searchString,start)方法接收searchString和start兩個參數,返回searchString首次出現的位置,如果沒有找到則返回-1

  該方法會隱式調用String()轉型函數,將searchString非字符串值轉換爲字符串;隱式調用Number()轉型函數,將start非數字值(undefined除外)轉換爲數值

  searchString表示要搜索的子字符串;start表示該搜索的開始位置,若忽略該參數或該參數爲undefined、NaN或負數時,start = 0

複製代碼

var string = 'hello world world';
console.log(string.indexOf('ld'));//9console.log(string.indexOf('ld',undefined));//9console.log(string.indexOf('ld',NaN));//9console.log(string.indexOf('ld',-1));//9console.log(string.indexOf('ld',10));//15console.log(string.indexOf('ld',[10]));//15console.log(string.indexOf('true',[10]));//-1console.log(string.indexOf(false,[10]));//-1

複製代碼

【lastIndexOf()】

  與indexOf()不同,lastIndexOf()從右向左查找

  lastIndexOf(searchString,start)方法接收searchString和start兩個參數,返回searchString第一次出現的位置,如果沒有找到則返回-1

  同樣地,該方法會隱式調用String()轉型函數,將searchString非字符串值轉換爲字符串;隱式調用Number()轉型函數,將start非數字值(undefined除外)轉換爲數值

  searchString表示要搜索的子字符串;start表示該搜索的開始位置,若忽略該參數或該參數爲undefined、NaN時,start = length - 1;若start爲負數,start = 0

複製代碼

var string = 'hello world world';
console.log(string.lastIndexOf('ld'));//15console.log(string.lastIndexOf('ld',undefined));//15console.log(string.lastIndexOf('ld',NaN));//15console.log(string.lastIndexOf('ld',-1));//-1console.log(string.lastIndexOf('h',-1));//0console.log(string.lastIndexOf('w',undefined));//12console.log(string.lastIndexOf('ld',10));//9console.log(string.lastIndexOf('ld',[10]));//9console.log(string.lastIndexOf('true',[10]));//-1console.log(string.lastIndexOf(false,[10]));//-1

複製代碼

  【tips】查找出字符串所有符合條件的子字符串

  可以通過循環調用indexOf()或lastIndexOf()來找到所有匹配的子字符串

複製代碼

function allIndexOf(str,value){    var result = [];    var pos = str.indexOf(value);    while(pos > -1){
        result.push(pos);
        pos = str.indexOf(value,pos+value.length);
    }    return result;
}
console.log(allIndexOf('helllhelllhelll','ll'));//[2,7,12]

複製代碼

  lastIndexOf()方法常用於獲取URL地址中的擴展名

複製代碼

var url = "http://cnblogs.com/xiaohuochai.txt";function getFileFormat(url){    var pos = url.lastIndexOf('.');    return url.slice(pos+1);
}
console.log(getFileFormat(url));//'txt'

複製代碼

 

正則匹配方法

  javascript中的一些正則操作如查找和測試等可以通過RegExp的方法實現,而切分和替換等另一些操作可以通過String類的方法實現

  String類共有match()、search()、replace()、split()這4種正則匹配方法 

【match()】

  match()方法只接受一個爲正則或字符串的參數,並以數組的形式返回匹配的內容。這個方法類似於正則表達式RegExp的exec()方法,只是調換了RegExp和String對象的位置

  若匹配失敗,則match()方法返回null

'x'.match(/y/);//null

  【1】若不設置全局標誌,match()方法和exec()方法結果相同

複製代碼

var string = 'cat,bat,sat,fat';var pattern = /.at/;var matches = string.match(pattern);
console.log(matches,matches.index,matches.input);//['cat'] 0 'cat,bat,sat,fat' var matches = string.match(pattern);
console.log(matches,matches.index,matches.input);//['cat'] 0 'cat,bat,sat,fat' var string = 'cat,bat,sat,fat';var pattern = /.at/;var exec = pattern.exec(string);
console.log(exec,exec.index,exec.input);//['cat'] 0 'cat,bat,sat,fat' var exec = pattern.exec(string);
console.log(exec,exec.index,exec.input);//['cat'] 0 'cat,bat,sat,fat'

複製代碼

  【2】設置全局標誌後,exec()方法依然返回單次的匹配結果,而match()方法會返回一個字符串數組,其中包括各次成功匹配的文本,但沒有index和input屬性

複製代碼

var string = 'cat,bat,sat,fat';var pattern = /.at/g;var matches = string.match(pattern);
console.log(matches,matches.index,matches.input);//["cat", "bat", "sat", "fat"] undefined undefined var matches = string.match(pattern);
console.log(matches,matches.index,matches.input);//["cat", "bat", "sat", "fat"] undefined undefined var string = 'cat,bat,sat,fat';var pattern = /.at/g;var exec = pattern.exec(string);
console.log(exec,exec.index,exec.input);//['cat'] 0 'cat,bat,sat,fat' var exec = pattern.exec(string);
console.log(exec,exec.index,exec.input);//['bat'] 4 'cat,bat,sat,fat'

複製代碼

  【3】match()方法作爲字符串String的方法,接受參數爲字符串,結果與不設置全局標誌的正則表達式爲參數相同,只返回第一個匹配項,且具有index和input屬性

var string = 'cat,bat,sat,fat';var matches = string.match('at');
console.log(matches,matches.index,matches.input);//['at'] 1 'cat,bat,sat,fat'var matches = string.match('at');
console.log(matches,matches.index,matches.input);//['at'] 1 'cat,bat,sat,fat'

  當不設置全局標誌時,match()方法和exec()方法都包含捕獲分組的信息;設置全局標誌後,match()方法不包含捕獲分組的信息

複製代碼

var string = 'cat,bat,sat,fat';var pattern = /(.)at/g;var matches = string.match(pattern);
console.log(matches);//['cat', 'bat', 'sat', 'fat'] var exec = pattern.exec(string);
console.log(exec);//['cat','c'] var string = 'cat,bat,sat,fat';var pattern = /(.)at/;var matches = string.match(pattern);
console.log(matches);//['cat','c']  var exec = pattern.exec(string);
console.log(exec);//['cat','c']

複製代碼

  【tips】兩種方法找出字符串中所有的數字

  【1】用charAt()方法

複製代碼

var str1 = 'j1h342jg24g234j 3g24j1';var array = [];var temp = '';for(var i = 0; i < str1.length; i++){    var value = parseInt(str1.charAt(i));//如果用Number()將無法排除空格
    if(!isNaN(value)){
        temp += str1.charAt(i);
    }else{        if(temp != ''){
            array.push(temp);
            temp = '';    
        }
    }
}if(temp != ''){
    array.push(temp);
    temp = '';    
}
console.log(array);//["1", "342", "24", "234", "3", "24", "1"]

複製代碼

  【2】用match()方法

var str1 = 'j1h342jg24g234j 3g24j1';
array = str1.match(/\d+/g);
console.log(array);//["1", "342", "24", "234", "3", "24", "1"]

【search()】

  search()方法接受一個正則或字符串的參數,返回匹配的內容在字符串中首次出現的位置,類似於不能設置起始位置的indexOf,找不到返回-1

  [注意]search()方法不執行全局匹配,忽略全局標誌g,也會忽略RegExp對象的lastIndex屬性,總是從字符串的開始位置開始搜索

'x'.search(/y/);//-1

複製代碼

var string = 'cat,bat,sat,fat';var pattern = /.at/;var pos = string.search(pattern);
console.log(pos);//0var string = 'cat,bat,sat,fat';var pattern = /.at/g;var pos = string.search(pattern);
console.log(pos);//0var string = 'cat,bat,sat,fat';var pattern = 'at';var pos = string.search(pattern);
console.log(pos);//1

複製代碼

  【tips】找出匹配的所有位置

複製代碼

function fnAllSearch(str,pattern){    var pos = str.search(pattern); 
    var length = str.match(pattern)[0].length;    var index = pos+length;    var result = [];    var last = index;
    result.push(pos);    while(true){
        str = str.substr(index);                    
        pos = str.search(pattern);        if(pos === -1){            break;
        }
        length = str.match(pattern)[0].length;
        index = pos+length;
        result.push(last+pos);
        last += index;    
    }    return result;
}    
console.log(fnAllSearch('cat23fbat246565sa3dftf44at',/\d+/));//[3,9,17,22]

複製代碼

【replace()】

  replace()方法用於替換一個或多個子字符串。它接收兩個參數:第一個是正則表達式或字符串,表示待查找的內容;第二個是字符串或函數,表示替換內容。返回替換後的字符串

  【1】字符串替換,只能替換第一個子字符串

var string = 'cat,bat,sat,fat';var result = string.replace('at','ond');
console.log(result);//'cond,bat,sat,fat'

  【2】不設置全局標誌g,也只能替換第一個子字符串

var string = 'cat,bat,sat,fat';var result = string.replace(/at/,'ond');
console.log(result);//'cond,bat,sat,fat'

  【3】設置全局標誌g,替換所有匹配的子字符串

var string = 'cat,bat,sat,fat';var result = string.replace(/at/g,'ond');
console.log(result);//'cond,bond,sond,fond'

  與match()和seartch()方法相比,replace()方法更爲強大,它可以在第二個參數中通過短屬性名來使用某些正則表達式的靜態屬性

短屬性名         說明
$&              最近一次的匹配項
$`              匹配項之前的文本
$'              匹配項之後的文本
$1,$2...        表示第N個匹配捕獲組

複製代碼

var string = 'cat-bat-sat-fat';
console.log(string.replace(/(.)(at)/g,'$&'));//'cat-bat-sat-fat'console.log(string.replace(/(.)(at)/g,'$`'));//'-cat--cat-bat--cat-bat-sat-'console.log(string.replace(/(.)(at)/g,"$'"));//'-bat-sat-fat--sat-fat--fat-'console.log(string.replace(/(.)(at)/g,'$1'));//'c-b-s-f'console.log(string.replace(/(.)(at)/g,'$2'));//'at-at-at-at'

複製代碼

var string = '2016-06-24';
console.log(string.replace(/(\d{4})-(\d{2})-(\d{2})/g,'$2/$3/$1'));//'06/24/2016'

  replace()方法的第二個參數可以是函數,這樣文本的處理更加靈活

  如果在只有一個匹配項的情況下,該方法會向這個函數傳遞3個參數:模式的匹配項、模式匹配項在字符串中的位置、原始字符串

複製代碼

var string = 'cat,bat,sat,fat';var index = 0;var matchArray = [];var posArray = [];var text = '';var result = string.replace(/at/g,function(match,pos,originalText){
    matchArray.push(match);
    posArray.push(pos);
    text = originalText;
    index++;    if(index % 2){        return 'wow';
    }else{        return '0';
    }
});
console.log(matchArray);//["at", "at", "at", "at"]console.log(posArray);//[1, 5, 9, 13]console.log(text);//'cat,bat,sat,fat'console.log(result);//'cwow,b0,swow,f0'

複製代碼

  如果正則表達式定義多個捕獲組,則該方法傳遞給函數的參數依次是模式的匹配項、第一個捕獲組的匹配項、第二個捕獲組的匹配項……第N個捕獲組的匹配項,但最後兩個參數仍然分別是模式的匹配項在字符串中的位置和原始字符串,這個函數返回一個字符串

複製代碼

var string = 'cat,bat,sat,fat';var index = 0;var matchArray = [];var m1Array = [];var posArray = [];var text = '';var result = string.replace(/(.)at/g,function(match,m1,pos,originalText){
    matchArray.push(match);
    m1Array.push(m1);
    posArray.push(pos);
    text = originalText;    return m1 + 'ta';
});
console.log(matchArray);//["cat", "bat", "sat", "fat"]console.log(m1Array);//['c','b','s','f']console.log(posArray);//[1, 5, 9, 13]console.log(text);//'cat,bat,sat,fat'console.log(result);//'cta,bta,sta,fta'

複製代碼

  【tips】首字母大寫

var text = 'one two three';var result = text.replace(/\b(\w+)\b/g,function(match,m1,pos,originalText){    return m1.charAt(0).toUpperCase()+m1.substring(1); 
})
console.log(result);

  【tips】HTML標籤轉義

複製代碼

function htmlEscape(text){    return text.replace(/[<>"&]/g,function(match,pos,originalText){        switch(match){            case '<':            return '&lt;';            case '>':            return '&gt;';            case '&':            return '&amp;';            case '\"':            return '&quot;';
        }
    });
}
console.log(htmlEscape('<p class=\"greeting\">Hello world!</p>'));//&lt;p class=&quot; greeting&quot;&gt;Hello world!&lt;/p&gt;console.log(htmlEscape('<p class="greeting">Hello world!</p>'));//同上

複製代碼

  【tips】日期格式化

複製代碼

var array = ['2015.7.28','2015-7-28','2015/7/28','2015.7-28','2015-7.28','2015/7---28'];function formatDate(date){    return date.replace(/(\d+)\D+(\d+)\D+(\d+)/,'$1年$2月$3日')
}var result = [];for(var i = 0 ; i < array.length; i++){
    result.push(formatDate(array[i]));
}
console.log(result);//["2015年7月28日", "2015年7月28日", "2015年7月28日", "2015年7月28日", "2015年7月28日", "2015年7月28日"]

複製代碼

  【tips】找出重複項最多的字符和個數

複製代碼

var str = 'aaaaabbbbbdddddaaaaaaaffffffffffffffffffgggggcccccce';var pattern = /(\w)\1+/g;var maxLength = 0;var maxValue = '';var result = str.replace(pattern,function(match,match1,pos,originalText){    if(match.length > maxLength){
        maxLength = match.length;
        maxValue = match1;
    }
})
console.log(maxLength,maxValue);//18 "f"

複製代碼

【split()】

  split()方法基於指定的分隔符將一個字符串分割成多個字符串,並將結果放在一個數組中,分隔符可以是字符串,也可以是一個RegExp

  該方法可以接受第二個參數(可選)用於指定數組的大小,如果第二個參數爲0-array.length範圍內的值時按照指定參數輸出,其他情況將所有結果都輸出

  若指定分隔符沒有出現在字符串中,則以數組的形式返回原字符串的值

  [注意]參數中的正則表達式是否使用全局標誌g對結果沒有影響

複製代碼

var colorText = 'red,blue,green,yellow';
console.log(colorText.split(''));//["r", "e", "d", ",", "b", "l", "u", "e", ",", "g", "r", "e", "e", "n", ",", "y", "e", "l", "l", "o", "w"]console.log(colorText.split(','));//["red", "blue", "green", "yellow"]console.log(colorText.split(',',2));//["red", "blue"]console.log(colorText.split(',',6));//["red", "blue", "green", "yellow"]console.log(colorText.split('-'));//["red,blue,green,yellow"]console.log(colorText.split(/\,/));//["red", "blue", "green", "yellow"]console.log(colorText.split(/e/));//["r", "d,blu", ",gr", "", "n,y", "llow"]console.log(colorText.split(/[^\,]+/));//將除去逗號以外的字符串變爲分隔符["", ",", ",", ",", ""],IE8-會識別爲[",",",",","]

複製代碼

 

去除首尾空格

【trim()】

  ECMAScript5爲所有字符串定義了trim()方法。這個方法會創建一個字符串的副本,刪除前置及後綴的所有空白字符,然後返回結果

  由於trim()方法返回的是字符串的副本,所以原始字符串中的前置及後綴空格會保持不變

  [注意]IE8-瀏覽器不支持

var string = '    hello world   ';
console.log(string.trim());//'hello world'console.log(string);//'    hello world   '

  空白字符不僅僅包括空格,還包括製表符(\t)、換行符(\n)和回車符(\r)

'\r\nabc \t'.trim() // 'abc'

  此外,firefox、safari和webkit還支持非標準的trimRight()用於刪除字符串結尾的空白字符

var string = '    hello world   ';
console.log(string.trimRight());//'    hello world';

  【tips】用trim()來判斷輸入的字符是否爲空

if(usename.trim().length){
     alert('correct');
}else{
      alert('error');
}

  【tips】用正則表達式模擬trim()

function fnTrim(str){    return str.replace(/^\s+|\s+$/,'')
}  
console.log(fnTrim('      hello world   '));//'hello world'

 

字符串比較

【localeCompare()】

  localeCompare()方法用於比較兩個字符串,遵循下列規則

  【1】如果字符串在字母表中應該排在字符串參數之前,則返回一個負數(大多數情況下爲-1)

  【2】如果字符串等於字符串參數,則返回0

  【3】如果字符串在字母表中應該排在字符串參數之後,則返回一個正數(大多數情況下爲1)

var stringValue = 'yellow';
console.log(stringValue.localeCompare('brick'));//1  'y'> 'b'console.log(stringValue.localeCompare('yellow'));//0    'yellow' == 'yellow'console.log(stringValue.localeCompare('zoo'));//-1        'yellow' < 'zoo'

  [注意]雖然在字母表中大寫字母在小寫字母的前面,所以大寫字母 < 小寫字母。但localeCompare()方法會考慮自然語言的排序情況,把'B'排在'a'的後面

console.log('B'.localeCompare('a'));//1console.log('B' > 'a');//falseconsole.log('b'.localeCompare('a'));//1console.log('b' > 'a');//true


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章