JavaScript 字符串方法
基本字符串方法
Javascript 字符串是原始的且不可变的：所有字符串方法都会产生一个新的字符串，而不会改变原始字符串。
JavaScript 字符串长度
The length 属性返回字符串的长度
提取字符串字符
有 4 种方法可以提取字符串字符
- The
at(position)方法 - The
charAt(position)方法 - The
charCodeAt(position)方法 - 像数组一样使用属性访问 []
JavaScript 字符串 charAt()
The charAt() 方法返回字符串中指定索引（位置）处的字符
JavaScript 字符串 charCodeAt()
The charCodeAt() 方法返回字符串中指定索引处的字符的代码
该方法返回一个 UTF-16 代码（介于 0 和 65535 之间的整数）。
JavaScript 字符串 at()
ES2022 引入了字符串方法 at()
示例
获取 name 的第三个字母
const name = "W3Schools";
let letter = name.at(2);
自己尝试 »
获取 name 的第三个字母
const name = "W3Schools";
let letter = name[2];
自己尝试 »
The at() 方法返回字符串中指定索引（位置）处的字符。
The at() 方法自 2022 年 3 月起在所有现代浏览器中受支持
注意
The at() 方法是 JavaScript 的新增功能。
它允许使用负索引，而 charAt() 不允许。
myString.at(-2) 代替 charAt(myString.length-2)。浏览器支持
at() 是 ES2022 功能。
自 2023 年 3 月起，所有现代浏览器都支持 JavaScript 2022（ES2022）。
| Chrome 94 | Edge 94 | Firefox 93 | Safari 16.4 | Opera 79 |
| 2021 年 9 月 | 2021 年 9 月 | 2021 年 10 月 | 2023 年 3 月 | 2021 年 10 月 |
属性访问 [ ]
注意
属性访问可能有点不可预测：
- 它使字符串看起来像数组（但它们不是）
- 如果找不到字符，[ ] 返回 undefined，而 charAt() 返回空字符串。
- 它是只读的。str[0] = "A" 不会报错（但不起作用！）
提取字符串部分
有 3 种方法可以提取字符串的一部分
slice(start, end)substring(start, end)substr(start, length)
JavaScript String slice()
slice() 提取字符串的一部分，并将提取的部分返回到一个新的字符串中。
该方法接受 2 个参数：起始位置和结束位置（不包括结束位置）。
注意
JavaScript 从零开始计数位置。
第一个位置是 0。
第二个位置是 1。
示例
如果省略第二个参数，该方法将切出字符串的剩余部分
let text = "Apple, Banana, Kiwi";
let part = text.slice(7);
自己尝试 »
如果参数为负数，则从字符串末尾开始计数位置
let text = "Apple, Banana, Kiwi";
let part = text.slice(-12);
自己尝试 »
此示例从位置 -12 到位置 -6 切出字符串的一部分
let text = "Apple, Banana, Kiwi";
let part = text.slice(-12, -6);
自己尝试 »
JavaScript String substring()
substring() 与 slice() 类似。
区别在于，在 substring() 中，小于 0 的起始值和结束值将被视为 0。
如果省略第二个参数，substring() 将切出字符串的剩余部分。
JavaScript String substr()
substr() 与 slice() 类似。
区别在于，第二个参数指定了提取部分的长度。
如果省略第二个参数，substr() 将切出字符串的剩余部分。
如果第一个参数为负数，则从字符串末尾开始计数位置。
转换为大写和小写
使用 toUpperCase() 将字符串转换为大写
使用 toLowerCase() 将字符串转换为小写
JavaScript String toUpperCase()
JavaScript String toLowerCase()
JavaScript String concat()
concat() 连接两个或多个字符串
可以使用 concat() 方法代替加号运算符。这两行代码的功能相同
示例
text = "Hello" + " " + "World!";
text = "Hello".concat(" ", "World!");
注意
所有字符串方法都返回一个新的字符串。它们不会修改原始字符串。
正式地说
字符串是不可变的：字符串不能改变，只能替换。
JavaScript String trim()
The trim() method removes whitespace from both sides of a string
JavaScript String trimStart()
ECMAScript 2019 added the String method trimStart() to JavaScript.
The trimStart() method works like trim(), but removes whitespace only from the start of a string.
JavaScript String trimStart() is supported in all modern browsers since January 2020
| Chrome 66 | Edge 79 | Firefox 61 | Safari 12 | Opera 50 |
| 2018 年 4 月 | 2020 年 1 月 | 2018 年 6 月 | 2018 年 9 月 | 2018 年 5 月 |
JavaScript String trimEnd()
ECMAScript 2019 added the string method trimEnd() to JavaScript.
The trimEnd() method works like trim(), but removes whitespace only from the end of a string.
JavaScript String trimEnd() is supported in all modern browsers since January 2020
| Chrome 66 | Edge 79 | Firefox 61 | Safari 12 | Opera 50 |
| 2018 年 4 月 | 2020 年 1 月 | 2018 年 6 月 | 2018 年 9 月 | 2018 年 5 月 |
JavaScript String Padding
ECMAScript 2017 added two new string methods to JavaScript: padStart() and padEnd() to support padding at the beginning and at the end of a string.
JavaScript String padStart()
The padStart() method pads a string from the start.
It pads a string with another string (multiple times) until it reaches a given length.
示例
Pad a string with "0" until it reaches the length 4
let text = "5";
let padded = text.padStart(4,"0");
自己尝试 »
Pad a string with "x" until it reaches the length 4
let text = "5";
let padded = text.padStart(4,"x");
自己尝试 »
注意
The padStart() method is a string method.
To pad a number, convert the number to a string first.
See the example below.
浏览器支持
padStart() is an ECMAScript 2017 feature.
ES2017 is supported in all modern browsers since September 2017
| Chrome 58 | Edge 15 | Firefox 52 | Safari 11 | Opera 45 |
| 2017 年 4 月 | 2017 年 4 月 | 2017 年 3 月 | 2017 年 9 月 | 2017 年 5 月 |
padStart() is not supported in Internet Explorer.
JavaScript String padEnd()
The padEnd() method pads a string from the end.
It pads a string with another string (multiple times) until it reaches a given length.
示例
let text = "5";
let padded = text.padEnd(4,"0");
自己尝试 »
let text = "5";
let padded = text.padEnd(4,"x");
自己尝试 »
注意
The padEnd() method is a string method.
To pad a number, convert the number to a string first.
See the example below.
浏览器支持
padEnd() is an ECMAScript 2017 feature.
ES2017 is supported in all modern browsers since September 2017
| Chrome 58 | Edge 15 | Firefox 52 | Safari 11 | Opera 45 |
| 2017 年 4 月 | 2017 年 4 月 | 2017 年 3 月 | 2017 年 9 月 | 2017 年 5 月 |
padEnd() is not supported in Internet Explorer.
JavaScript String repeat()
The repeat() method returns a string with a number of copies of a string.
The repeat() method returns a new string.
The repeat() method does not change the original string.
示例
Create copies of a text
let text = "Hello world!";
let result = text.repeat(2);
自己尝试 »
let text = "Hello world!";
let result = text.repeat(4);
自己尝试 »
语法
string.repeat(count)
参数
| 参数 | 描述 |
| count | 必需。 所需副本数。 |
返回值
| 类型 | 描述 |
| 字符串 | 包含副本的新的字符串。 |
浏览器支持
repeat() is an ES6 feature (JavaScript 2015).
ES6 is fully supported in all modern browsers since June 2017
| Chrome 51 | Edge 15 | Firefox 54 | Safari 10 | Opera 38 |
| 2016 年 5 月 | 2017 年 4 月 | 2017 年 6 月 | 2016 年 9 月 | 2016 年 6 月 |
repeat() is not supported in Internet Explorer.
替换字符串内容
The replace() method replaces a specified value with another value in a string
示例
let text = "Please visit Microsoft!";
let newText = text.replace("Microsoft", "W3Schools");
自己尝试 »
注意
The replace() method does not change the string it is called on.
The replace() method returns a new string.
The replace() method replaces only the first match
If you want to replace all matches, use a regular expression with the /g flag set. See examples below.
By default, the replace() method replaces only the first match
示例
let text = "Please visit Microsoft and Microsoft!";
let newText = text.replace("Microsoft", "W3Schools");
By default, the replace() method is case sensitive. Writing MICROSOFT (with upper-case) will not work
示例
let text = "Please visit Microsoft!";
let newText = text.replace("MICROSOFT", "W3Schools");
To replace case insensitive, use a regular expression with an /i flag (insensitive)
示例
let text = "Please visit Microsoft!";
let newText = text.replace(/MICROSOFT/i, "W3Schools");
注意
Regular expressions are written without quotes.
To replace all matches, use a regular expression with a /g flag (global match)
示例
let text = "Please visit Microsoft and Microsoft!";
let newText = text.replace(/Microsoft/g, "W3Schools");
注意
You will learn a lot more about regular expressions in the chapter JavaScript Regular Expressions.
JavaScript String ReplaceAll()
In 2021, JavaScript introduced the string method replaceAll()
The replaceAll() method allows you to specify a regular expression instead of a string to be replaced.
If the parameter is a regular expression, the global flag (g) must be set, otherwise a TypeError is thrown.
将字符串转换为数组
If you want to work with a string as an array, you can convert it to an array.
JavaScript String split()
A string can be converted to an array with the split() method
If the separator is omitted, the returned array will contain the whole string in index [0].
If the separator is "", the returned array will be an array of single characters
完整的字符串参考
For a complete String reference, go to our
The reference contains descriptions and examples of all string properties and methods.
