JavaScript 筆記之字符串

目錄

一、字符串基礎

1、格式寫法

     特殊字符

     長代碼行換行

     字符串對象

2、字符串長度

二、字符串方法

1、indexOf(subStr, [startPos]) 查找子串位置

     lastIndexOf(subStr, [startPos]) 反向查找子串位置

2、search(regex|subStr) 正則搜索,返回位置

3、slice(startPos[, endPos]) 、substring(同前)、substr(startPos[, length]) 截取子串

4、replace(regex|subStr, anotherSubStr) 正則替換子串

5、toUpperCase()、toLowerCase() 大小寫轉換

6、concat(str1[, str2, ...]) 連接字符串

7、trim() 清除兩頭空格

8、charAt(pos)、charCodeAt(pos) 提取字符

     使用下標 [ ] 訪問


一、字符串基礎

1、格式寫法

JavaScript 字符串是引號中的零個或多個字符。示例如下: 

var answer = "It's good to see you again!";
var answer = "He is called 'Bill'";
var answer = 'He is called "Bill"';
var x = "中國是瓷器的故鄉,因此 china 與\"China(中國)\"同名。"

    特殊字符

代碼 結果 描述
\' ' 單引號
\" " 雙引號
\\ \ 反斜槓
\b 退格鍵  
\f 換頁 換頁
\n 新行 新行
\r 回車 回車
\t 水平製表符 水平製表符
\v 垂直製表符 垂直製表符

     長代碼行換行

document.getElementById("demo").innerHTML = "Hello \
Kitty!"; //某些瀏覽器也不允許 \ 字符之後的空格
document.getElementById("demo").innerHTML = "Hello" + 
"Kitty!"; //更靠譜的做法

     字符串對象

之前,是通過字面方式創建字符串原始值,也可以new Sting("...")創建字符串對象。

請不要把字符串創建爲對象,它會拖慢執行速度。new 關鍵字使代碼複雜化。也可能產生一些意想不到的結果:

var x = "Bill";
var y = new String("Bill");
// typeof x 將返回 string
// typeof y 將返回 object
// (x == y) 爲 true,因爲 x 和 y 的值相等
// (x === y) 爲 false,因爲 x 和 y 的類型不同(字符串與對象)

var x = new String("Bill");             
var y = new String("Bill");

// (x == y) 爲 false,因爲 x 和 y 是不同的對象

2、字符串長度

var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var sz = txt.length; // 26

二、字符串方法

1、indexOf(subStr, [startPos]) 查找子串位置

var str = "The full name of China is the People's Republic of China.";
var pos = str.indexOf("China"); // 17

     lastIndexOf(subStr, [startPos]) 反向查找子串位置

var str = "The full name of China is the People's Republic of China.";
var pos = str.lastIndexOf("China"); // 51 方法返回指定文本在字符串中最後一次出現的索引:

如果未找到文本, indexOf() 和 lastIndexOf() 均返回 -1。

2、search(regex|subStr) 正則搜索,返回位置

var str="Mr. Blue has a blue house";
subStr1 = str.search("blue");  // 15
subStr2 = str.search(/blue/i); // 4

3、slice(startPos[, endPos]) 、substring(同前)、substr(startPos[, length]) 截取子串

var str = "Apple, Banana, Mango";
var sub1  = str.slice(7,13);   //"Banana"
var sub2  = str.slice(-13,-7); //"Banana"
var left1 = str.slice(7);      //"Banana, Mango"
var left1 = str.slice(-13);    //"Banana, Mango"
//提示:負值位置不適用 Internet Explorer 8 及其更早版本
/* substring() 類似於 slice()
   不同之處在於 substring() 無法接受負的索引

   substr() 類似於 slice()
   不同之處在於 第二個參數規定被提取部分的長度
   如果省略第二個參數,則該 substr() 將裁剪字符串的剩餘部分
   如果首個參數爲負,則從字符串的結尾計算位置。
*/

var res1 = str.substr(7);  //"Banana, Mango"
var res2 = str.substr(-5); //"Mango"

4、replace(regex|subStr, anotherSubStr) 正則替換子串

var str = "Please visit Microsoft and Microsoft!";
var n = str.replace("Microsoft", "W3School"); //"Please visit W3School and Microsoft!" 默認只替換第一個

str = "Please visit Microsoft!";
var n = str.replace("MICROSOFT", "W3School"); //"Please visit Microsoft!" 默認大小寫敏感

str = "Please visit Microsoft!";
var n = str.replace(/MICROSOFT/i, "W3School"); //"Please visit W3School!" 大小寫不敏感

str = "Please visit Microsoft and Microsoft!";
var n = str.replace(/Microsoft/g, "W3School"); //"Please visit W3School and W3School!" 替換所有

5、toUpperCase()、toLowerCase() 大小寫轉換

var text1 = "Hello World!";   // 字符串
text2 = text1.toUpperCase();  // "HELLO WORLD!"
text3 = text1.toLowerCase();  // "hello world!"

6、concat(str1[, str2, ...]) 連接字符串

var text = "Hello" + " " + "World!";
var text = "Hello".concat(" ","World!"); //兩者等效

7、trim() 清除兩頭空格

/*警告:Internet Explorer 8 或更低版本不支持 trim() 方法。*/
var str = "       Hello World!        ";
alert(str.trim());

/*如需支持 IE 8,您可搭配正則表達式使用 replace() 方法代替:*/
var str = "       Hello World!        ";
alert(str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ''));

/* 您還可以使用上面的 replace 方案把 trim 函數添加到 JavaScript String.prototype:*/
if (!String.prototype.trim) {
  String.prototype.trim = function () {
    return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
};
var str = "       Hello World!        ";
alert(str.trim());

8、charAt(pos)、charCodeAt(pos) 提取字符

var str = "HELLO WORLD";
str.charAt(0);             // 返回 H

str.charCodeAt(0);         // 返回 72 字符 H 的 unicode 編碼

     使用下標 [ ] 訪問

  • 不適用 Internet Explorer 7 或更早的版本
  • 它讓字符串看起來像是數組(其實並不是)
  • 如果找不到字符,[ ] 返回 undefined,而 charAt() 返回空字符串
  • 它是隻讀的。str[0] = "A" 不會產生錯誤(但也不會工作!)
var str = "HELLO WORLD";
str[0];                   // 返回 H
str[0] = "A";             // 不產生錯誤,但不會工作
typeof str[100] == 'undefined'; // true
str.charAt(100) == '';          // true

9、轉換爲數組

var txt = "a,b,c,d,e";   // 字符串
txt.split(",");          // 用逗號分隔 ["a", "b", "c", "d", "e"]

var txt = "a b c d e";   // 字符串
txt.split(" ");          // 用空格分隔 ["a", "b", "c", "d", "e"]

var txt = "a|b|c|d|e";   // 字符串
txt.split("|");          // 用豎線分隔 ["a", "b", "c", "d", "e"]

txt.split("");           // 分隔爲字符 ["a", ",", "b", ",", "c", ",", "d", ",", "e"]

txt.split();             // 分隔失敗 ["a,b,c,d,e"]

 

參考:https://www.w3school.com.cn/js/js_strings.asp

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