【JavaScript 教程】第五章 字符串02— 字符串类型

英文 | https://www.javascripttutorial.net/

译文 | 杨小爱

在上节，我们学习了JavaScript字符串的相关知识，错过的小伙伴可以点击文章《​​【JavaScript 教程】第五章 字符串01— JavaScript 字符串​​》进行学习。

那么，在今天的教程中，我们将一起来学习JavaScript String类型以及如何有效地操作字符串。

JavaScript String 类型简介

String 类型是字符串原始类型的对象包装器，可以使用 String 构造函数创建，如下所示：

let str = new String('JavaScript String Type');

String 类型有一个名为 length 的属性，用于指定字符串中的字符数。

console.log(str.length); // 22

在此示例中，length属性的值为 22，这也是 string中“JavaScript String Type”的字符数。

要获取原始字符串值，请使用字符串对象的以下方法之一：valueOf()、toString() 和 toLocaleString()。

console.log(str.valueOf());
console.log(str.toString());
console.log(str.toLocaleString())；

要访问字符串中的单个字符，请使用带有数字索引的方括号 []表示法。如本例所示，第一个字符的索引为零：

console.log(str[0]); // J

方括号[]表示法是从 ES5 开始引入的。在 ES5 之前，您使用 charAt() 方法，该方法更加冗长：

console.log(str.charAt(0)); // J

当您对原始字符串变量或文字字符串调用方法时，它会转换为该String类型的实例。例如：

'literal string'.toUpperCase();

此功能在 JavaScript 中称为原始包装器类型。

字符串操作

String 类型提供了许多有用的方法来有效地操作字符串。我们将在下一节中检查它们中的每一个。

1) 连接字符串

要连接两个或多个字符串，请使用 concat() 方法，如下所示：

let firstName = 'John';
let fullName = firstName.concat(' ','Doe');
console.log(fullName); // "John Doe"
console.log(firstName); // "John"

concat() 方法将一个或多个字符串连接到另一个字符串并返回结果字符串。请注意， concat() 方法不会修改原始字符串。

除了 concat() 方法，JavaScript 还使用加法运算符 (+) 来连接字符串。在实践中，加法运算符比 concat() 方法使用得更多。

let firstName = 'John';
let fullName = firstName + ' ' + 'Doe';
console.log(fullName); // "John Doe"

2) 提取子符串

要从字符串中提取子字符串，请使用以下substr()方法：

substr(startIndex,[length]);

substr()方法接受两个参数。

第一个参数startIndex是提取字符的位置，而第二个参数length指定要提取的字符数。

let str = "JavaScript String";


console.log(str.substr(0, 10)); // "JavaScript"
console.log(str.substr(11,6)); // "String"

如果省略该length 参数，则substr()方法会将字符提取到字符串的末尾。

有时，您希望使用开始和结束索引从字符串中提取子字符串。在这种情况下，您可以使用substring()方法：

substring(startIndex,endIndex)

请参阅以下示例：​

let str = "JavaScript String";
console.log(str.substring(4, 10)); // "Script"

3) 定位子符串

要在字符串中定位子字符串，请使用以下indexOf()方法：

string.indexOf(substring,[fromIndex]);

indexOf()方法接受两个参数：要定位的子字符串和fromIndex 方法开始在字符串中向前搜索的位置。

indexOf()返回字符串中的子字符串的第一次出现的索引。如果未找到子字符串，则该indexOf()方法返回 -1。​

let str = "This is a string";
console.log(str.indexOf("is")); // 2

以下示例使用fromIndex参数：

console.log(str.indexOf('is', 3)); //5

要查找字符串中子字符串最后一次出现的位置，请使用lastIndexOf()方法。

string.lastIndexOf(substring,[fromIndex])

与indexOf()方法不同，方法lastindexOf()从fromIndex参数向后搜索。

console.log(str.lastIndexOf('is')); // 5

如果在字符串中找不到子字符串，lastIndexOf()方法也会返回-1，如下例所示：​

console.log(str.lastIndexOf('are')); // -1

4) 去除空白字符串

要删除字符串的所有前导和尾随空白字符，请使用该trim()方法。​

let rawString = ' Hi  ';
let strippedString = rawString.trim();
console.log(strippedString); // "Hi"

请注意，trim() 方法创建了原始字符串的副本，并删除了空白字符，它不会更改原始字符串。

请注意，trim() 方法仅从 ES5 开始可用。

ES6 引入了两种从字符串中删除空白字符的新方法：

• trimStart() 返回一个字符串，其中从字符串的开头去除了空白字符。
• trimEnd() 返回一个字符串，其中从字符串的末尾去除了空白字符。

5) 变更案例

要更改字符串的大小写，您可以使用 toLowerCase() 和 toUpperCase() 方法：

let greeting = 'Hello';
console.log(greeting.toLowerCase()); // 'hello'
console.log(greeting.toUpperCase()); // 'HELLO';

在某些语言中，将字符串转换为小写和大写的规则非常具体。因此，使用 toLocaleLowerCase() 和 toLocaleUpperCase() 方法更安全，尤其是当您不知道代码将处理哪种语言时。

6) 比较字符串

要比较两个字符串，请使用 localeCompare() 方法：

first.localeCompare(second);

localeCompare() 返回三个值之一：-1、0 和 1。

• 如果第一个字符串按字母顺序排在第二个字符串之前，则该方法返回 -1。
• 如果第一个字符串按字母顺序排在第二个字符串之后，则该方法返回 1。
• 如果两个字符串相等，则该方法返回 0。

例如：

console.log('A'.localeCompare('B')); // -1
console.log('B'.localeCompare('B')); // 0
console.log('C'.localeCompare('B')); // 1

7) 匹配模式

match() 方法允许您将字符串与指定的正则表达式匹配并获得结果数组。

如果 match() 方法找不到任何匹配项，则返回 null。否则，它返回一个包含整个匹配项和任何括号捕获匹配结果的数组。

如果未设置全局标志 (g)，则数组的元素零包含整个匹配项。下面是一个例子：

let expr = "1 + 2 = 3";
let matches = expr.match(/\d+/);
console.log(matches[0]); // "1"

在这个例子中，模式匹配 expr 字符串中的任何数字。

如果设置了全局标志 (g)，则结果数组的元素包含所有匹配项，如下所示：

matches = expr.match(/\d+/g);
matches.forEach(function(m) {
    console.log(m);
});
// "1"
// "2"
// "3"

在此示例中，matches 数组包含 expr 字符串中的所有匹配项，包括 1、2 和 3。

如果您只需要找出字符串是否与正则表达式匹配，则可以使用 search() 方法。

与 match() 方法类似，search() 方法接受一个正则表达式并返回找到第一个匹配项的字符串的位置。如果未找到匹配项，则返回 -1。

let str = "This is a test of search()";
let pos = str.search(/is/);
console.log(pos); // 2

8) 替换子符串

要替换字符串中的子字符串，请使用replace()方法。

string.replace(regularExpression, replaceText)

replace() 方法的第一个参数可以是正则表达式或字符串。如果是正则表达式，replace() 方法将查找匹配项并将其替换为第二个参数 (replaceText)。如果是字符串，replace() 方法将执行精确搜索并进行替换。

replace() 方法在进行替换后返回原始字符串的副本。

以下示例说明了如何使用正则表达式将 the替换为 a：

let str = "the baby kicks the ball";
// replace "the" with "a"
let newStr = str.replace(/the/g, "a");
console.log(newStr); // "a baby kicks a ball"
console.log(str); // "the baby kicks the ball"

以下示例显示了如何通过将第一个参数用作文字字符串来替换kickswith holds。

下面的示例展示了如何通过将第一个参数用作文字字符串来将 kicks 替换为 Hold。

newStr = str.replace('kicks', 'holds');
console.log(newStr); // "the baby holds the ball"

总结

在今天的教程中，我们学习了 JavaScript 字符串类型以及如何有效地操作字符串。

如果您觉得今天内容，对您有帮助，请记得分享给您对编程感兴趣的朋友，也许对他也有所帮助。

​

学习更多技能

请点击下方公众号

​