如何索引，拆分和操作JavaScript中的字符串

介绍

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

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

字符串原语和字符串对象

首先，我们将说明两种类型的字符串。 JavaScript区分字符串原语 ，不可变数据类型和String对象。

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

// Initializing a new string primitive
const stringPrimitive = "A new string.";

// Initializing a new String object
const stringObject = new String("A new string.");  

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

typeof stringPrimitive;

Outputstring

在第二个例子中，我们使用new String()来创建一个字符串对象并将其分配给一个变量。

typeof stringObject;

Outputobject

大多数时候你会创建字符串原语。 JavaScript可以访问和利用String对象包装器的内置属性和方法，而不必将您创建的字符串基元改为对象。

首先这个概念有点挑战，你应该意识到原始和对象之间的区别。 基本上，所有字符串都有可用的方法和属性，在后台，每次调用一个方法或属性时，JavaScript都将执行对象的转换并返回原始形式。

字串如何索引

字符串中的每个字符对应于索引号，从0开始。

为了演示，我们将创建一个带有值的字符串How are you? 。

字符串中的第一个字符是H ，它对应于索引0 。 最后一个字符是? ，对应于11 。 空格字符也有一个索引，在3和7 。

能够访问字符串中的每个字符都可以使用多种方式来处理和操作字符串。

访问人物

我们将演示如何使用“ How are you? ”来访问字符和索引 串。

"How are you?";

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

"How are you?"[5];

Outputr

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

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

Outputr

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

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

Output1

虽然“o”在How are you?出现两次How are you? string， indexOf()将获取第一个实例。

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

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

Output9

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

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

Output4

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

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

Outputyou

请注意， 11是? 但是? 不是返回的输出的一部分。 slice()将返回最后一个参数之间但不包括的内容。

如果不包括第二个参数，则slice()将返回从参数到字符串末尾的所有内容。

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

Outputyou?

总而言之， charAt()和slice()将帮助返回基于索引号的字符串值，而indexOf()和lastIndexOf()将根据提供的字符串字符执行相反的返回索引号。

查找字符串的长度

使用length属性，我们可以返回字符串中的字符数。

"How are you?".length;

Output12

请记住， length属性返回从1开始的实际字符数，其出现为12，而不是最终索引号，从0开始，以11结尾。

转换为大写或小写

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

toUpperCase()将所有字符转换为大写字符。

"How are you?".toUpperCase();

OutputHOW ARE YOU?

toLowerCase()将所有字符转换为小写字符。

"How are you?".toLowerCase();

Outputhow are you?

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

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

拆分字符串

JavaScript有一个非常有用的方法来分割一个字符串，并创建一个新的数组。 我们将使用split()方法将数组分隔为以" "表示的空格字符。

const originalString = "How are you?";

// Split string by whitespace character
const splitString = originalString.split(" ");

console.log(splitString);

Output[ 'How', 'are', 'you?' ]

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

splitString[1];

Outputare

如果给出一个空参数， split()将创建一个逗号分隔的数组，其中每个字符都包含在字符串中。

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

修剪空白

JavaScript trim()方法从字符串的两端删除空格，但不会在任何位置。 空格可以是制表符或空格。

const tooMuchWhitespace = "     How are you?     ";

const trimmed = tooMuchWhitespace.trim();

console.log(trimmed);

OutputHow are you?

trim()方法是执行删除多余空格的常见任务的简单方法。

查找和替换字符串值

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

const originalString = "How are you?"

// Replace the first instance of "How" with "Where"
const newString = originalString.replace("How", "Where");

console.log(newString);

OutputWhere are you?

除了能够用另一个字符串值替换值之外，我们还可以使用正则表达式来使replace()更强大。 例如， replace()仅影响第一个值，但是我们可以使用g （全局）标志来捕获值的所有实例，并且i （不区分大小写）的标志忽略大小写。

const originalString = "Javascript is a programming language. I'm learning javascript."

// Search string for "javascript" and replace with "JavaScript"
const newString = originalString.replace(/javascript/gi, "JavaScript");

console.log(newString);

OutputJavaScript is a programming language. I'm learning JavaScript.

这是一个非常常见的使用正则表达式的任务。 访问Regexr来练习更多的RegEx示例。

结论

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

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

有关字符串的更一般概述，请阅读“ 如何使用JavaScript中的字符串 ”教程。