【前端系列】一文看懂JavaScript中的String字符串对象及其常用方法

当涉及到JavaScript编程时，字符串是一种常见的数据类型。JavaScript提供了String字符串对象，它具有许多有用的属性和方法。在本文中，我们将探讨JavaScript中String字符串对象的两种创建方式，以及一些常用的属性和方法。

0.String字符串对象的创建方式

在JavaScript中，我们可以使用两种方式创建String字符串对象：字面量和构造函数。

0-1.字面量方式

字面量方式是创建字符串对象的简洁方式。我们可以使用引号（单引号或双引号）将字符串文本括起来。

const str1 = "Hello, World!";
const str2 = 'Welcome to JavaScript!';

在上面的示例中创建了两个字符串对象str1和str2。

0-2.构造函数方式

构造函数方式使用new关键字和String构造函数来创建字符串对象。

const str3 = new String("Hello, World!");
const str4 = new String('Welcome to JavaScript!');

1.String length属性的介绍与使用

String对象具有一个名为length的属性，它用于获取字符串的长度。length属性返回字符串中字符的数量，包括空格和标点符号。

const str = "Hello, World!";
console.log(str.length); // 输出：13

在上面的示例中创建了一个字符串对象str，并使用length属性获取字符串的长度。输出结果为13，表示字符串中有13个字符。

为什么是13？仔细查看刚刚看过的文章您就会发现，length属性包括空格和标点符号，仔细检查代码不难发现，在字母W之前存在一个空格，所以为13，在后续的例子中W前的空格也会保留，请留意！

length属性对于处理字符串的长度以及进行循环和截取操作非常有用。

2.charAt()方法的介绍与使用

charAt()方法用于获取字符串中指定位置的字符。它接受一个参数，即要获取字符的索引位置（从0开始）。

const str = "Hello, World!";
console.log(str.charAt(0)); // 输出：H
console.log(str.charAt(7)); // 输出：W

在上面的示例中，我们使用charAt()方法获取字符串中指定位置的字符。第一个例子中，我们获取索引位置0的字符，即字符串的第一个字符，输出结果为’H’。第二个例子中，我们获取索引位置7的字符，即字符串的第8个字符，输出结果为’W’。

3.indexOf()方法的介绍与使用

indexOf()方法用于查找字符串中指定子字符串的第一个匹配位置。它接受一个参数，即要查找的子字符串。

const str = "Hello, World!";
console.log(str.indexOf("World")); // 输出：7
console.log(str.indexOf("JavaScript")); // 输出：-1

第一个例子中，我们查找子字符串”World”，它在字符串中的位置是7，输出结果为7。

第二个例子中，我们查找子字符串”JavaScript”，但它不存在于字符串中，因此返回-1。

注意索引从0开始

indexOf()方法对于查找特定子字符串的位置非常有用，可以用于条件判断和字符串处理。

4.trim()方法的介绍与使用

trim()方法用于去除字符串两端的空格。它会返回一个新的字符串，原始字符串不会被修改。

const str = "   Hello, World!   ";
console.log(str.trim()); // 输出："Hello, World!"

在上面的示例中，我们使用trim()方法去除字符串两端的空格。原始字符串中的前导空格和尾部空格被删除，返回一个新的字符串”Hello, World!”。

5.substring()方法的介绍与使用

substring()方法用于提取字符串中指定范围的子字符串。它接受两个参数，即提取子字符串的起始位置和结束位置（不包括结束位置的字符，即左闭右开）。

const str = "Hello, World!";
console.log(str.substring(0, 5)); // 输出："Hello"
console.log(str.substring(7)); // 输出："World!"

第一个例子中，我们提取从索引位置0到5（不包括索引位置5）的子字符串，输出结果为”Hello”。

第二个例子中，我们只提供起始位置7，它会提取从索引位置7到字符串的末尾的子字符串，输出结果为”World!”。