JavaScript String 对象

JavaScript 中的 String 对象让你能够处理一系列字符；它用一组辅助方法包装了 JavaScript 的字符串原始数据类型。

由于 JavaScript 自动在字符串原始数据类型和 String 对象之间进行转换，所以你可以在字符串原始数据类型上调用任何 String 对象的辅助方法。

字符串是一系列包含零个或多个字符的序列。例如，'Hello' 就是一个字符串。

语法

JavaScript 字符串可以使用 String() 构造器作为对象创建，或者使用字符串字面量作为原始数据类型创建。

使用以下语法创建一个 String 对象：

var val = new String(value);

String 参数 value 是一系列已被正确编码的字符。

我们也可以使用字符串字面量和 String() 函数来创建字符串原始数据类型，如下所示：

str1 = 'Hello World!'; // 使用单引号
str2 = "Hello World!"; // 使用双引号
str3 = `Hello World`; // 使用反引号
str4 = String('Hello World!'); // 使用 String() 函数

JavaScript String 对象属性

下面是 String 对象的属性及其描述的列表：

序号	属性	描述
1	constructor	返回创建该对象的 String 函数的一个引用。
2	length	返回字符串的长度。
3	prototype	原型属性允许你添加属性和方法到一个对象。

JavaScript String 对象方法

这里列出了 String 对象中可用的方法以及它们的描述。

静态方法

静态方法使用 String 类本身来调用。

序号	属性	描述
1	fromCharCode()	将 UTF-16 编码单位序列转换为字符串。
2	fromCodePoint()	从给定的 ASCII 值序列创建一个字符串。

实例方法

实例方法使用 String 类的实例来调用。

序号	方法	描述
1	at()	返回指定索引处的字符。
2	charAt()	返回指定索引处的字符。
3	charCodeAt()	返回给定索引处字符的 Unicode 值。
4	codePointAt()	返回给定索引处字符的 Unicode 值。
5	concat()	组合两个字符串的文本并返回一个新的字符串。
6	endsWith()	检查字符串是否以特定字符或子字符串结尾。
7	includes()	用来检查一个字符串是否存在另一个字符串中。
8	indexOf()	返回指定值在调用字符串对象中的第一次出现的索引，如果没有找到则返回 -1。
9	lastIndexOf()	返回指定值在调用字符串对象中的最后一次出现的索引，如果没有找到则返回 -1。
10	localeCompare()	返回一个指示参考字符串在排序顺序中是否位于给定字符串之前、之后或相同的位置的数字。
11	match()	用于匹配一个正则表达式与一个字符串。
12	matchAll()	用于匹配字符串中所有正则表达式模式的出现。
13	normalize()	获取字符串的 Unicode 规范化形式。
14	padEnd()	在当前字符串的末尾添加填充。
15	padStart()	在当前字符串的开头添加填充。
16	raw()	返回给定模板文字的原始字符串形式。
17	repeat()	获取包含当前字符串的 N 个副本的新字符串。
18	replace()	用于在字符串中查找与正则表达式的匹配项并替换匹配的子字符串。
19	replaceAll()	用于在字符串中查找与正则表达式的匹配项并将所有匹配的子字符串替换为新字符串。
20	search()	执行对一个正则表达式与指定字符串之间的匹配搜索。
21	slice()	提取字符串的一部分并返回一个新的字符串。
22	split()	将一个字符串分割成字符串数组。
23	substr()	返回从指定位置开始的指定数量的字符。
24	substring()	返回字符串中两个索引之间的字符。
25	toLocaleLowerCase()	转换字符串内的字符为小写，同时尊重当前地区设置。
26	toLocaleUpperCase()	转换字符串内的字符为大写，同时尊重当前地区设置。
27	toLowerCase()	返回转换为小写的调用字符串值。
28	toString()	返回表示指定对象的字符串。
29	toUpperCase()	返回转换为大写的调用字符串值。
30	toWellFormed()	返回一个复制当前字符串的新字符串。
31	trim()	移除两端的空白字符。
32	trimEnd()	移除末尾的空白字符。
33	trimStart()	移除开头的空白字符。
34	valueOf()	返回指定对象的原始值。

字符串构造器

序号	构造器	描述
1	String()	创建一个字符串对象并用提供的值进行初始化。

示例

让我们通过一些例子来理解 JavaScript 的 String 对象和字符串原始数据类型。

示例：创建 JavaScript 字符串对象

在下面的例子中，我们使用带有 new 关键字的 String() 构造器来创建一个字符串对象。

<html>
<head>
   <title> JavaScript - String Object </title>
</head>
<body>
   <p id = "output"> </p>
   <script>
      const output = document.getElementById("output");
      const str = new String("Hello World!");
      output.innerHTML += "str == " + str + "<br>";
      output.innerHTML += "typeof str == " + typeof str;
   </script>
</body>
</html>

输出

str == Hello World!
typeof str == object

访问字符串

你可以使用其索引来访问字符串字符。字符串索引从 0 开始。

示例

在下面的例子中，我们访问了字符串第 0 个和第 4 个索引处的字符。

<html>
<body>
   <p id = "output"> </p>
   <script>
      const output = document.getElementById("output");
      let str1 = new String("Welcome!");
      let str2 = "Welcome!";
      output.innerHTML += "0th character is - " + str1[0] + "<br>";
      output.innerHTML += "4th character is - " + str2[4] + "<br>";
   </script>
</body>
</html>

输出

0th character is - W
4th character is - o

JavaScript 中的字符串是区分大小写的

在 JavaScript 中，字符串是区分大小写的。这意味着小写字母和大写字母被视为不同的字符。

示例

在下面的例子中，char1 包含大写的 'S'，而 char2 包含小写的 's'。当你比较 char1 和 char2 时，因为字符串是区分大小写的，所以结果为 false。

<html>
<head>
   <title> JavaScript - 字符串区分大小写 </title>
</head>
<body>
   <p id = "output"> 
   <script>
      let char1 = 'S';
      let char2 = 's';
      let ans = char1 == char2;
      document.getElementById("output").innerHTML += "s == S " + ans;
   </script>
</body>
</html>

输出

s == S false

JavaScript 字符串是不可变的

在 JavaScript 中，你不能更改字符串中的字符。但是，你可以更新整个字符串。

示例

在下面的例子中，我们尝试更新字符串的第一个字符，但它不会被更新，这可以从输出中看出。

之后，我们更新了整个字符串，并且你可以看到字符串的变化。

<html>
<head>
   <title> JavaScript - 不可变字符串 </title>
</head>
<body>
   <p id = "output"> </p>
   <script>
      const output = document.getElementById("output");
      let str = "Animal";
      str[0] = 'j';
      output.innerHTML += "字符串是: " + str + "<br>";
      str = "Hi!";
      output.innerHTML += "更新后的字符串是: " + str;
   </script>
</body>
</html>

输出

字符串是: Animal
更新后的字符串是: Hi!

转义字符

你可以使用反斜杠 (\) 字符来在字符串中包含特殊字符。以下是特殊字符列表：

转义字符	描述
"	双引号
'	单引号
\	反斜杠
\n	新行
\t	制表符（Tab）
\b	退格
\f	换页
\v	垂直制表符
\r	回车
\uXXXX	Unicode 转义

示例

在下面的例子中，我们在 str1 字符串的字符间添加了一个单引号，并在 str2 字符串的字符间添加了一个反斜杠。

<html>
<head>
   <title> JavaScript - 转义字符 </title>
</head>
<body>
   <p id = "output"> </p>
   <script>
      const output = document.getElementById("output");
      let str1 = "Your\'s welcome!";
      let str2 = "Backslash \\";
      output.innerHTML += "str1 == " + str1 + "<br>";
      output.innerHTML += "str2 == " + str2 + "<br>";
   </script>
</body>
</html>

输出

str1 == Your's welcome!
str2 == Backslash \

字符串 HTML 包装方法

以下是一些方法，它们返回一个被适当的 HTML 标签包裹的字符串副本。

序号	方法	描述
1	anchor()	创建一个 HTML 锚点，用于超文本目标。
2	big()	创建一个字符串，显示时字体较大，如同在 `<big>` 标签内一样。
3	blink()	创建一个闪烁的字符串，如同在 `<blink>` 标签内一样。
4	bold()	创建一个字符串，显示时加粗，如同在 `<b>` 标签内一样。
5	fixed()	导致字符串以固定间距字体显示，如同在 `<tt>` 标签内一样。
6	fontcolor()	导致字符串以指定颜色显示，如同在 `<font color="color">` 标签内一样。
7	fontsize()	导致字符串以指定字号显示，如同在 `<font size="size">` 标签内一样。
8	italics()	导致字符串斜体显示，如同在 `<i>` 标签内一样。
9	link()	创建一个请求另一个 URL 的 HTML 超链接。
10	small()	导致字符串以较小字体显示，如同在 `<small>` 标签内一样。
11	strike()	导致字符串以删除线文本显示，如同在 `<strike>` 标签内一样。
12	sub()	导致字符串以下标形式显示，如同在 `<sub>` 标签内一样。
13	sup()	导致字符串以上标形式显示，如同在 `<sup>` 标签内一样。

在接下来的部分中，我们将通过几个示例来演示字符串方法的使用。