JavaScript String 字符串方法

JavaScript String 字符串方法彙總

 

1.str.indexOf() 方法 查找字符串中的字符串   返回   字符串中指定文本首次出現的索引（位置）

      JavaScript 從零計算位置。0 是字符串中的第一個位置，1 是第二個，2 是第三個 ...

      沒法設置更強大的搜索值（正則表達式）

var str = "The full name of China is the People's Republic of China.";
var pos = str.indexOf("China");
document.getElementById("demo").innerHTML = pos;

 

2.str.lastIndexOf() 方法向後進行檢索（從尾到頭）  返回指定文本在字符串中最後一次出現的索引

 var str = "The full name of China is the People's Republic of China.";
 var pos = str.lastIndexOf("China");
 document.getElementById("demo").innerHTML = pos;

 

3.str.search() 方法檢索字符串中的字符串    搜索特定值的字符串，並返回匹配的位置

     沒法設置第二個開始位置參數

 

var str = "The full name of China is the People's Republic of China.";
var pos = str.search("China");
document.getElementById("demo").innerHTML = pos;

 

4.str 提取部分字符串

   (1)     slice(start, end)

   (2)     substring(start, end)

   (3)     substr(start, length)

 

(1) slice() 方法

var str="Hello World";
var str1=str.slice(2); //若是隻有一個參數，則提取開始下標到結尾處的全部字符串
var str2=str.slice(2,7); //兩個參數，提取下標爲2，到下標爲7但不包含下標爲7的字符串
var str3=str.slice(-7,-2); //若是是負數，-1爲字符串的最後一個字符。提取從下標-7開始到下標-2但不包含下標-2的字符串。前一個數要小於後一個數，不然返回空字符串

console.log(str1); //llo World
console.log(str2); //llo W
console.log(str3); //o Wor

（2）substring() 方法 

substring() 相似於 slice()

不一樣之處在於 substring() 沒法接受負的索引 

若是省略第二個參數，則該 substring() 將裁剪字符串的剩餘部分。

var str="Hello World";
var str1=str.substring(2)
var str2=str.substring(2,2);
var str3=str.substring(2,7);
console.log(str1); //llo World
console.log(str2); //若是兩個參數相等，返回長度爲0的空串
console.log(str3); //llo W

（3） substr() 方法

substr() 相似於 slice()

不一樣之處在於第二個參數規定被提取部分的長度

若是首個參數爲負，則從字符串的結尾計算位置

var str = "Apple, Banana, Mango";
var res = str.substr(7,6);

結果： 
     Banana

 

5.str. replace() 方法用另外一個值替換在字符串中指定的值 替換字符串內容

var str="hello WORLD";
var reg=/o/ig; //o爲要替換的關鍵字，不能加引號，不然替換不生效，i忽略大小寫，g表示全局查找。
var str1=str.replace(reg,"**")
console.log(str1); //hell** W**RLD

6.str.toLowerCase(): 把字符串轉爲小寫，返回新的字符串

var str="Hello World";
var str1=str.toLowerCase();
console.log(str); //Hello World
console.log(str1); //hello world

7.str.toUpperCase(): 把字符串轉爲大寫，返回新的字符串

var str="hello world";
var str1=str.toUpperCase();
console.log(str); //hello world
console.log(str1); //HELLO WORLD

8.str.charAt(): 返回指定下標位置的字符。若是index不在0-str.length(不包含str.length)之間，返回空字符串

var str="hello world";
var str1=str.charAt(6);
console.log(str1);

9.str.charCodeAt(): 返回指定下標位置的字符的unicode編碼,這個返回值是 0 - 65535 之間的整數

var str="hello world";
var str1=str.charCodeAt(1);
var str2=str.charCodeAt(-2); //NaN
console.log(str1); //101

10.str.split(): 把字符串分割成字符串數組

var str="AA BB CC DD";
var string1="1:2:3:4:5";
var str1=str.split("");//若是把空字符串 ("")用做分割符，那麼字符串的每一個字符之間都會被分割
var str2=str.split(" "); //以空格爲分隔符
var str3=str.split("",4); //4指定返回數組的最大長度
var str4=string1.split(":");
console.log(str1); // ["A", "A", " ", "B", "B", " ", "C", "C", " ", "D", "D"]
console.log(str2); //["AA" "BB" "CC" "DD"]
console.log(str3); //["A", "A", " ", "B"]
console.log(str4); // ["1", "2", "3", "4", "5"]

11.str.match(): 返回全部查找的關鍵字內容的數組

var str="To be or not to be";
var reg=/to/ig;
var str1=str.match(reg);
console.log(str1); //["To", "to"]
console.log(str.match("Hello")); //null

12. str.fromCharCode方法 

是接收一或多個字符編碼，而後將其轉換爲字符串

是String構造函數的一個靜態方法

console.log(String.fromCharCode(104,101,108,108,111));//hello

 

13.str.localeCompare方法

用於比較兩個字符串 
    1.若是字符串在字母表中應該排在字符串參數以前，則返回一個負數 
    1.若是字符串等於字符串參數，則返回0 
    1.若是字符串在字母表中應該排在字符串參數以後，則返回一個正數

var str="yellow"; 
    console.log(str.localeCompare("brick"));//1 
    console.log(str.localeCompare("yellow"));//0 
    console.log(str.localeCompare("zoo"));//-1

14.big()  用大號字體顯示字符串

15.blink()  顯示閃動字符串

16.bold()  字符串粗體顯示

17.link()   將字符串顯示爲連接

18.fontcolor()  指定顏色顯示

19.fontsize()  指定尺寸顯示

20.concat()  鏈接字符串

.......

ES6新增

 

1.str.trim() 用來刪除字符串先後的空格 

 

var str="   hello world   "; 
    console.log('('+str.trim()+')');//(hello world) 
    console.log('('+str+')');//(   hello world   )

2.str.repeat()  返回一個新字符串，表示將原字符串重複n次

  var str = 'helloworld';

  str.repeat( n );//該字符串就會重複n遍；

3.str.padStart （）用於頭部補全

 

   var  str = '20199'; //長度達不到 指定位 ，

   str.padStart （8，‘ab’）；

   //abab2019

4.str.padEnd （）用於尾部補全

 

   var  str = '2019'; //長度達不到 指定位 ，

   str.padEnd（8，‘ab’）；

   //2019abab

5.str.raw()    每每用來充當模板字符串的處理函數，返回一個斜槓都被轉義（即斜槓前面再加一個斜槓）的字符串，對應於替換變量後的模板字符串

   

   String.raw = function (strings, ...values) {

   var output = "";

   for (var index = 0; index < values.length; index++) {

   output += strings.raw[index] + values[index];

   }

   output += strings.raw[index]

   return output;

   }

   //t0e1s2t

6.str.codePointAt()   正確解析四個字節的字符

      這兩個字符在UTF-16中編碼爲 0xD842   和  0xDFB9 儲存起來須要四個字節，那麼對於這樣四個字節的東西javascript 沒法正確判斷，而是將其解析爲兩個字符；

     charCodeAt會分別返回前兩個字節和後兩個字節的值; 而charAt壓根就沒法識別;

     在ES6中提供給咱們一個新的方法codePointAt(); 這個方法能夠正確解析四個字節的字符。

     var s = "𠮹";

     console.log(s.codePointAt()) // 134073

7.String.fromCodePoint()   

 至關於ES5內的String.fromCharCode()

        先說說 String.fromCharCode()方法；這個方法沒法正確識別 32位的 UTF-16字符（也就是上面提到的四個字節的字符 Unicode編碼 大於 0xFFFF）;

        console.log(String.fromCharCode(0x20BB9 )) //  出現了一個奇怪的字符

        緣由是什麼那？ 由於fromCharCode不識別四個字節的字符， 他會將第一位省略掉 ， 也就是將 0x20BB9 去掉開頭 變成了0x0BB9;因此出現的結果不正確;

        可是ES6中的String.fromCodePoint()能夠正確識別這樣的編碼; 

        console.log(String.fromCodePoint(0x20BB9)) //𠮹 顯示正確;

  console.log(String.fromCharCode(134066))//ல

8.includes() startsWith() endsWith() 判斷字符串中是否存在某個字符串

 var s = 'Hello world!';

   s.startsWith('Hello')   // true       以參數開頭

   s.endsWith('!')         // true       以參數結尾

   s.includes('o')         // true       包括參數;

8.ES6爲字符串添加了遍歷器接口，使得字符串能夠被for...of循環遍歷。這個遍歷器最大的優勢是能夠識別大於0xFFFF的碼點，傳統的for循環沒法識別這樣的碼點,可是不能遍歷object

var text = String.fromCodePoint(0x20BB7);

for (let i = 0; i < text.length; i++) {
  console.log(text[i]);
}
// " "
// " "

for (let i of text) {
  console.log(i);
}
// "𠮷"

9.模板字符串（template string）是加強版的字符串，用反引號（`）標識。它能夠看成普通字符串使用，也能夠用來定義多行字符串，或者在字符串中嵌入變量

// 字符串中嵌入變量
var name = "Bob", time = "today";
`Hello ${name}, how are you ${time}?`

 

........