二维码

JavaScript 字符串方法

JavaScript 字符串方法

String length
String slice()
String substring()
String substr()
String replace()
String replaceAll()
String toUpperCase()
String toLowerCase()
String concat()
String trim()
String trimStart()
String trimEnd()
String padStart()
String padEnd()
String charAt()
String charCodeAt()
String split()

注意

String search方法将在下一章中介绍。


JavaScript String length

length属性返回字符串的长度:

1
2
let text = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";  
let length = text.length;


提取String部分

有 3 种方法可以提取字符串的一部分:

  • slice(*start*, *end*)
  • substring(*start*, *end*)
  • substr(*start*, *length*)

JavaScript String slice()

slice()提取字符串的一部分并返回 在新字符串中提取部分。

该方法有 2 个参数:开始位置和结束位置(不包括结束)。

从位置 7 到位置 13 切出字符串的一部分:

1
2
let text = "Apple, Banana, Kiwi";  
let part = text.slice(7, 13);

注意

JavaScript 从零开始计算位置。

第一个位置是 0。

第二个位置是 1。

如果省略第二个参数,该方法将切除字符串的其余部分:

1
2
let text = "Apple, Banana, Kiwi";  
let part = text.slice(7);

如果参数为负数,则从字符串末尾开始计算位置:

1
2
let text = "Apple, Banana, Kiwi";  
let part = text.slice(-12);

此示例将字符串的一部分从位置 -12 切成位置 -6:

1
2
let text = "Apple, Banana, Kiwi";  
let part = text.slice(-12, -6);


JavaScript String substring()

substring()类似于 slice()

区别在于,小于 0 的起始值和结束值在substring()中被视为 0。

1
2
let str = "Apple, Banana, Kiwi";  
let part = str.substring(7, 13);

如果省略第二个参数,则将切除其余的 字符串。substring()


JavaScript String substr()

substr()类似于 slice()

区别在于第二个参数指定提取零件的长度

1
2
let str = "Apple, Banana, Kiwi";  
let part = str.substr(7, 6);

如果省略第二个参数,则substr()将分割字符串的其余部分。

1
2
let str = "Apple, Banana, Kiwi";  
let part = str.substr(7);

如果第一个参数为负,则位置从字符串的末尾开始计数。

1
2
let str = "Apple, Banana, Kiwi";  
let part = str.substr(-4);


替换String内容

replace()方法的作用是:用字符串中的另一个值替换指定的值:

1
2
let text = "Please visit Microsoft!";  
let newText = text.replace("Microsoft", "Yadu");

注意

replace()方法不会更改调用它的字符串。

replace()方法返回一个新字符串。

replace()方法仅替换第一个匹配项

如果要替换所有匹配项,请使用设置了/g标志的正则表达式。请参阅以下示例。

默认情况下,replace()方法仅替换第一个匹配项

1
2
let text = "Please visit Microsoft and Microsoft!";  
let newText = text.replace("Microsoft", "Yadu");

默认情况下,replace()方法区分大小写。编写 MICROSOFT(使用 大写)将不起作用:

1
2
let text = "Please visit Microsoft!";  
let newText = text.replace("MICROSOFT", "Yadu");

若要替换不区分大小写,请使用带有/i标志(不区分)的正则表达式

1
2
let text = "Please visit Microsoft!";  
let newText = text.replace(/MICROSOFT/i, "Yadu");

注意

正则表达式的编写不带引号。

要替换所有匹配项,请使用带有 /g 标志的正则表达式(全局匹配):

1
2
let text = "Please visit Microsoft and Microsoft!";  
let newText = text.replace(/Microsoft/g, "Yadu");


JavaScript String ReplaceAll()

2021 年,JavaScript 引入了 string 方法replaceAll()

1
2
text = text.replaceAll("Cats","Dogs");  
text = text.replaceAll("cats","dogs");

replaceAll()方法允许您指定 正则表达式,而不是要替换的字符串。

如果参数是正则表达式,则必须设置全局标志 (g),否则抛出TypeError

1
2
text = text.replaceAll(/Cats/g,"Dogs");  
text = text.replaceAll(/cats/g,"dogs");

注意

replaceAll()是 [ES2021] 的一项功能。

replaceAll()在 Internet Explorer 中不起作用。


转换为大写和小写

使用toUpperCase()将字符串转换为大写:

使用toLowerCase()将字符串转换为小写:


JavaScript String toUpperCase()

1
2
let text1 = "Hello World!";  
let text2 = text1.toUpperCase();

JavaScript String toLowerCase()

1
2
let text1 = "Hello World!";       // String  
let text2 = text1.toLowerCase();  // text2 is text1 converted to lower


JavaScript String concat()

concat()联接两个或多个字符串:

1
2
3
let text1 = "Hello";  
let text2 = "World";
let text3 = text1.concat(" ", text2);

可以使用concat()方法代替加号运算符。 这两行执行相同的操作:

1
2
text = "Hello" + " " + "World!";  
text = "Hello".concat(" ", "World!");

注意

所有字符串方法都返回一个新字符串。它们不会修改原始字符串。

正式表示:

字符串是不可变的:字符串不能更改,只能替换。


JavaScript String trim()

trim()方法从字符串的两边删除空格:

1
2
let text1 = "      Hello World!      ";  
let text2 = text1.trim();


JavaScript String trimStart()

[ECMAScript 2019]在 JavaScript 中添加了 String 方法trimStart()

trimStart()方法的工作方式类似于trim(),但仅从字符串的开头删除空格。

1
2
let text1 = "     Hello World!     ";  
let text2 = text1.trimStart();

自2020年1月起,所有现代浏览器都支持 JavaScript String trimStart()

Chrome 66 Edge 79 Firefox 61 Safari 12 Opera 50
Apr 2018 Jan 2020 Jun 2018 Sep 2018 May 2018

JavaScript String trimEnd()

[ECMAScript 2019]在 JavaScript 中添加了字符串方法trimEnd()

TRIMEND()方法的工作方式与TRIM()类似,但仅删除字符串末尾的空格。

1
2
let text1 = "     Hello World!     ";  
let text2 = text1.trimEnd();

自2020年1月起,所有现代浏览器都支持 JavaScript String trimEnd()

Chrome 66 Edge 79 Firefox 61 Safari 12 Opera 50
Apr 2018 Jan 2020 Jun 2018 Sep 2018 May 2018

JavaScript String填充

[ECMAScript 2017] 向 JavaScript 添加了两个新的字符串方法:支持在字符串的开头padStart()和结尾padEnd()进行填充。


JavaScript String padStart()

padStart()方法从一开始就填充字符串。

它将一个字符串与另一个字符串(多次)填充,直到达到给定的长度。

用“0”填充字符串,直到它达到长度 4:

1
2
let text = "5";  
let padded = text.padStart(4,"0");

用“x”填充字符串,直到它达到长度 4:

1
2
let text = "5";  
let padded = text.padStart(4,"x");

注意

padStart()方法是字符串方法。

要填充数字,请先将数字转换为字符串。

请参阅下面的示例。

1
2
3
let numb = 5;  
let text = numb.toString();
let padded = text.padStart(4,"0");

浏览器支持

padStart()是 [ECMAScript 2017] 的一项功能。

所有现代浏览器都支持它:

Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

padStart()在 Internet Explorer 中不受支持。


JavaScript String padEnd()

padEnd()方法从末尾填充一个字符串。

它将一个字符串与另一个字符串(多次)填充,直到达到给定的长度。

1
2
let text = "5";  
let padded = text.padEnd(4,"0");

1
2
let text = "5";  
let padded = text.padEnd(4,"x");

注意

padEnd()方法是字符串方法。

要填充数字,请先将数字转换为字符串。

请参阅下面的示例。

1
2
3
let numb = 5;  
let text = numb.toString();
let padded = text.padEnd(4,"0");

浏览器支持

padEnd() [ECMAScript 2017]的一项功能。

所有现代浏览器都支持它:

Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

padEnd()在 Internet Explorer 中不受支持。


提取String字符

提取字符串字符有 3 种方法:

  • charAt(*position*)
  • charCodeAt(*position*)
  • Property access [ ]

JavaScript String charAt()

charAt()方法返回指定位置的字符 字符串中的索引(位置):

1
2
let text = "HELLO WORLD";  
let char = text.charAt(0);


JavaScript String charCodeAt()

charCodeAt()方法返回字符的 unicode 在字符串中的指定索引处:

该方法返回 UTF-16 代码(介于 0 和 65535 之间的整数)。

1
2
let text = "HELLO WORLD";  
let char = text.charCodeAt(0);


物业访问

ECMAScript 5 (2009)允许对字符串进行属性访问 [ ]:

1
2
let text = "HELLO WORLD";  
let char = text[0];

注意

属性访问可能有点难以预测:

  • 它使字符串看起来像数组(但事实并非如此)
  • 如果未找到任何字符,则 [ ] 返回undefined,而charAt()返回空字符串。
  • 它是只读的。 str[0] = "A" 没有给出错误(但不起作用!)
1
2
let text = "HELLO WORLD";  
text[0] = "A";    // Gives no error, but does not work


将String转换为数组

如果您想将字符串作为数组使用,可以将其转换为数组。

JavaScript String split()

可以使用split()方法将字符串转换为数组:

1
2
3
text.split(",")    // Split on commas  
text.split(" ")    // Split on spaces
text.split("|")    // Split on pipe

如果省略分隔符,则返回的数组将包含索引 [0] 中的整个字符串。

如果分隔符为“”,则返回的数组将是单个字符的数组:

1
text.split("")