JavaScript字符串基础与常用操作方法详解

作者:函数茶馆时间:2026-10-22 05:07:52浏览:614

本文详细介绍JavaScript中字符串的定义方式,包括单双引号的使用及特殊字符的转义处理。重点讲解ES6新增的多行字符串与模板字符串语法,并系统梳理获取长度、大小写转换、查找子串及截取子串等核心字符串操作方法,帮助开发者高效处理文本数据。

JavaScript字符串定义与转义

在JavaScript中,字符串是由单引号(')或双引号(")包裹的字符序列。

当字符串内容本身包含单引号时,可以使用双引号将其包裹,例如 "I'm OK" 包含 I、'、m、空格、O、K 共6个字符。

若字符串内部同时存在单引号和双引号,需使用反斜杠(\)作为转义字符进行标识,例如:


'I\'m \"OK\"!';

上述代码表示的字符串内容为:I'm "OK"!

反斜杠(\)可用于转义多种字符,如 \n 代表换行,\t 代表制表符。若需表示字符 \ 本身,则需使用 \\ 进行转义。

ASCII字符可通过 \x## 形式的十六进制代码表示,例如:


'\x41'; // 完全等同于 'A'

此外,还可以使用 \u#### 格式来表示一个Unicode字符:


'\u4e2d\u6587'; // 完全等同于 '中文'

多行字符串

使用 \n 编写多行字符串较为繁琐,ES6标准引入了反引号(` ... `)来表示多行字符串:

`这是一个

多行

字符串`;

模板字符串

连接多个字符串通常使用加号(+):

ES6多行字符串与模板字符串


var name = '小明';
var age = 20;
var message = '你好, ' + name + ', 你今年' + age + '岁了!';
alert(message);

当需要连接的变量较多时,加号拼接显得繁琐。ES6引入了模板字符串,其语法与多行字符串类似,但会自动替换字符串中的变量:


var name = '小明';
var age = 20;
var message = `你好, ${name}, 你今年${age}岁了!`;
alert(message);

操作字符串

字符串的常见操作如下:

字符串常用操作方法


var s = 'Hello, world!';
s.length; // 13

获取字符串指定位置的字符可使用类似数组的下标操作,索引从0开始:


var s = 'Hello, world!';
s[0]; // 'H'
s[6]; // ' '
s[7]; // 'w'
s[12]; // '!'
s[13]; // undefined 超出范围的索引不会报错,但一律返回undefined

需注意,字符串是不可变的。对字符串索引赋值虽不报错,但不会产生任何效果。


var s = 'Test';
s[0] = 'X';
alert(s); // s仍然为'Test'

JavaScript提供了多种字符串方法,调用这些方法不会修改原字符串,而是返回一个新字符串:

toUpperCase

toUpperCase() 方法将字符串全部转换为大写:


var s = 'Hello';
s.toUpperCase(); // 返回'HELLO'

toLowerCase

toLowerCase() 方法将字符串全部转换为小写:


var s = 'Hello';
var lower = s.toLowerCase(); // 返回'hello'并赋值给变量lower
lower; // 'hello'

indexOf


indexOf()会搜索指定字符串出现的位置:
var s = 'hello, world';
s.indexOf('world'); // 返回7
s.indexOf('World'); // 没有找到指定的子串,返回-1

substring


substring()返回指定索引区间的子串:
var s = 'hello, world'
s.substring(0, 5); // 从索引0开始到5(不包括5),返回'hello'
s.substring(7); // 从索引7开始到结束,返回'world'
作者最新文章