如何在 JavaScript 中索引、拆分和操作字符串

介绍

一个 ** string 是一个或多个字符的序列,可以由字母,数字或符号组成,JavaScript 字符串中的每个字符都可以通过索引号访问,所有字符串都有可用的方法和属性。

在本教程中,我们将了解字符串原理和字符串对象之间的区别,如何索引字符串,如何访问字符串中的字符,以及用于字符串的常见属性和方法。

字符串原始和字符串对象

首先,我们将澄清两种类型的字符串。JavaScript区分 字符串原始,一个不可变的数据类型,和字符串对象。

为了测试两者之间的差异,我们将初始化一个字符串原始和一个字符串对象。

1// Initializing a new string primitive
2const stringPrimitive = "A new string.";
3
4// Initializing a new String object
5const stringObject = new String("A new string.");

我们可以使用typeof运算符来确定一个值的类型. 在第一个示例中,我们简单地将字符串分配给一个变量。

1typeof stringPrimitive;

1[secondary_label Output]
2string

在第二个示例中,我们使用新字符串()创建一个字符串对象并将其分配给一个变量。

1typeof stringObject;

1[secondary_label Output]
2object

大多数时候,你会创建字符串原始字符串。JavaScript可以访问并利用字符串对象包装器的内置属性和方法,而不会真正改变你创建的字符串原始字符串为对象。

虽然这个概念起初有点困难,但你应该知道原始和对象之间的区别,基本上,有方法和属性可用于所有字符串,并且在背景中,JavaScript将执行对象转换,并每次呼叫方法或属性时返回原始。

如何索引字符串

字符串中的每一个字符都与一个索引数相匹配,从0开始。

为了演示,我们将创建一个字符串,其值是你怎么样?。

字符串中的第一个字符是H,这对应于索引0。最后一个字符是?,这对应于11。

能够访问字符串中的每一个字符串给了我们一些方法来工作和操纵字符串。

访问人物

我们将展示如何使用你怎么样?字符串访问字符和索引。

1"How are you?";

使用方块符号,我们可以访问字符串中的任何字符。

1"How are you?"[5];

1[secondary_label Output]
2r

我们还可以使用charAt()方法返回使用索引数作为参数的字符。

1"How are you?".charAt(5);

1[secondary_label Output]
2r

或者,我们可以使用indexOf()来返回一个字符的第一个实例的索引号。

1"How are you?".indexOf("o");

1[secondary_label Output]
21

虽然o在你是如何?字符串中出现两次,但indexOf()将获得第一个实例。

lastIndexOf()用于查找最后一个实例。

1"How are you?".lastIndexOf("o");

1[secondary_label Output]
29

对于这两种方法,您也可以在字符串中搜索多个字符,它会返回实例中的第一个字符的索引号。

1"How are you?".indexOf("are");

1[secondary_label Output]
24

另一方面,slice()方法将返回两个索引数之间的字符,第一个参数将是开始索引数,第二个参数将是应该结束的索引数。

1"How are you?".slice(8, 11);

1[secondary_label Output]
2you

请注意,11是?,但?不是返回输出的一部分。

如果没有包含第二个参数,则slice()将返回从参数到字符串的尽头的所有内容。

1"How are you?".slice(8);

1[secondary_label Output]
2you?

总之,charAt()和slice()将有助于返回基于索引数的字符串值,而indexOf()和lastIndexOf()则相反,返回基于所提供的字符串的索引数。

查找一个字符串的长度

使用长度属性,我们可以返回字符串中的字符数。

1"How are you?".length;

1[secondary_label Output]
212

请记住,长度属性返回从 1 开始的实际字符数,而不是从 0 开始和 11 结束的最终索引数。

转换为上方或下方案例

两种内置方法 toUpperCase() 和 toLowerCase() 是用于格式化文本和在 JavaScript 中进行文本比较的有用的方法。

toUpperCase() 将所有字符转换为高级字符。

1"How are you?".toUpperCase();

1[secondary_label Output]
2HOW ARE YOU?

toLowerCase() 将所有字符转换为下方字符。

1"How are you?".toLowerCase();

1[secondary_label Output]
2how are you?

这两种格式化方法不需要额外的参数。

值得注意的是,这些方法不会改变原始字符串。

分裂的弦

JavaScript 有一个非常有用的方法来将字符串划分成一个字符串,并从部分中创建一个新的 array。

1const originalString = "How are you?";
2
3// Split string by whitespace character
4const splitString = originalString.split(" ");
5
6console.log(splitString);

1[secondary_label Output]
2[ 'How', 'are', 'you?' ]

现在我们在splitString变量中有一个新的数组,我们可以使用索引号访问每个部分。

1splitString[1];

1[secondary_label Output]
2are

如果给出一个空的参数,则split()将创建一个与字符串中的每个字符串分离的数组。

通过分割字符串,您可以确定句子中有多少单词,并使用该方法来确定人们的姓名和姓名,例如。

清洁空间

JavaScript trim() 方法会从字符串的两端删除白色空间,但不会在其间任何地方。

1const tooMuchWhitespace = "     How are you?     ";
2
3const trimmed = tooMuchWhitespace.trim();
4
5console.log(trimmed);

1[secondary_label Output]
2How are you?

trim()方法是一种简单的方式来执行消除过剩白空间的常见任务。

查找和替换字符串值

我们可以搜索一个值的字符串,并使用代替()方法将其替换为新的值,第一个参数将是要找到的值,第二个参数将是要替换的值。

1const originalString = "How are you?"
2
3// Replace the first instance of "How" with "Where"
4const newString = originalString.replace("How", "Where");
5
6console.log(newString);

1[secondary_label Output]
2Where are you?

除了能够用另一个字符串值来替换一个值之外,我们还可以使用 Regular Expressions来使‘replace()’更强大,例如,‘replace()’只影响第一个值,但我们可以使用‘g’(全球)旗来捕捉一个值的所有实例,而‘i’(案例不敏感)旗来忽略案例。

1const originalString = "Javascript is a programming language. I'm learning javascript."
2
3// Search string for "javascript" and replace with "JavaScript"
4const newString = originalString.replace(/javascript/gi, "JavaScript");
5
6console.log(newString);

1[secondary_label Output]
2JavaScript is a programming language. I'm learning JavaScript.

这是一个非常常见的任务,使用常规表达式. 访问 Regexr(http://regexr.com/) 练习更多的例子 RegEx。

结论

字符串是最常用的数据类型之一,我们可以用它们做很多事情。

在本教程中,我们了解了字符串原始和字符串对象之间的区别,如何索引字符串,以及如何使用内置的方法和字符串的属性来访问字符,格式文本,并找到和替换值。

有关字符串的更一般概述,请阅读教程如何在JavaScript中使用字符串(LINK0)。