字符串是 JavaScript 中的一种数据类型。用于表示零个或多个字符的序列,例如“Hello”或“Hello”。使用字符串创建和显示句子,例如当您想在屏幕上显示文本或在警报中显示消息时。在本文中,我将解释如何在 JavaScript 中使用字符串。
目录
6-1 如何编写字符串文字
6-2 输入特殊字符(转义序列)
6-3 使用模板文字表示字符串
6-4 字符串对象
6-5 什么是 JavaScript 中的代理对
6-6 获取字符串的长度(length)
6-7 用指定的分隔符分割字符串(split)
6-8 替换字符串
6-9 连接字符串
6-10 获取一个重复指定次数(repeat)的新字符串
6-1 如何编写字符串文字
要在程序中使用字符串类型值,请按原样编写作为字符串值的字符串文字。在这里,我将解释如何在 JavaScript 中编写字符串文字。
JavaScript 中的字符串
在 JavaScript 中作为字符串编写的每个字符都存储为 16 位 Unicode (UTF-16) 字符。除了字母数字字符和日语字符之外,您还可以书写许多字符。通常情况下,我们不太关注内部使用的是什么字符编码,但我们打算在每次需要了解的时候解释一下。
注意,在描述JavaScript程序的文件中使用的字符代码可以使用UTF-8等来存储。
如何编写字符串文字
字符串是零个或多个字符的序列。在程序中编写字符串文字时,将整个字符串用单引号(’)或双引号(”)括起来。
let nama = 'Shangdong Qingdao';
let address = "山东省青岛市";
单引号和双引号没有区别。两者是相同的字符串。
空字符(具有 0 个字符的字符串)仅描述单引号或双引号。
let nama = '';
let address = "";
在字符串中写单引号和双引号
如果要在字符串中使用单引号,或在字符串中使用双引号,则必须更加小心。两者都是作为字符来表示字符串的开始和结束的,所以如果将它们原样写在字符串中,将无法确定字符串的结束位置,会出现错误。
let msg = 'Tom's watch';
>> Uncaught SyntaxError: Unexpected identifier
如果在字符串中写单引号,请用双引号将字符串括起来。
let msg = "Tom's watch";
同样,如果您在字符串中写双引号,请用单引号将字符串括起来。
let msg = '今天是"星期天"';
另一种方法是使用转义序列。这是当要写换行符等特殊字符时的描述方法。要将单引号或双引号写成简单字符,加一个反斜杠(\)(Windows环境下为反斜杠),写成\’或\” . 如果使用转义序列,则可以在被单引号包围的字符串内使用单引号。
let msg = 'Tom\'s watch';
console.log(msg);
>> Tarou's watch
let msg2 = "今天是\"星期天\"";
console.log(msg2);
>> 今天是"星期天"
在字符串中间插入一个换行符
在输入字符串时,中途如果想改行,按【 Enter】健也不能够改行。
let msg = '你好。
遇见您很高兴';
>> Uncaught SyntaxError: Invalid or unexpected token
如果要在字符串中间换行,在要换行的位置输入\n,代表换行的转义序列。
let msg = '你好。\n遇见您很高兴';
console.log(msg);
>> 你好。
>> 遇见您很高兴
6-2 输入特殊字符(转义序列)
一些字符,例如换行符和制表符,不能作为字符输入。提供转义序列作为在字符串中表达此类特殊字符的一种方式。转义序列可以通过组合反斜杠 (\) 和字母来表示特殊字符。在这里,我将解释如何在 JavaScript 中使用转义序列输入特殊字符。
什么是转义序列
您可以使用转义序列在字符串文字中输入特殊字符,例如换行符。转义序列可以用反斜杠 ()(在 Windows 上为反斜杠)和字母组合编写。
例如,当你想在一个字符串中插入一个换行符时,如果你像普通文本输入一样回车,程序会按如下方式换行,但换行符不会被包含在字符串中。(将导致错误)。
let msg = '你好。
今天天气不错吧。';
要在字符串中换行,请使用换行转义序列。表示换行符的转义序列是\n,所以在你想要换行符的地方输入\n。
let msg = '你好。\n今天天气不错。';
如果你真的把前面的字符串输出到控制台,可以看到换行符在写\n的位置。
let msg = '你好。\n今天天气不错。';
console.log(msg);
--> 你好。
今天天气不错吧。
以这种方式使用转义序列允许在字符串中写入特殊字符。
转移列表
转义序列列表
转义序列 | 意思 |
\b | 退格键 |
\t | 水平制表符 |
\v | 垂直制表符 |
\n | 换行 |
\r | 返回 |
\f | 换新一页 |
\’ | 单引号 |
\” | 双引号 |
\` | 反引号 |
\\ | 反斜杠 |
\0 | 空字符 |
\xXX | 由两个十六进制数字表示的 Latin-1 字符 |
\uXXXX | 由四个十六进制数字表示的 Unicode 字符 |
\u{XXXXXX} | 由十六进制代码点表示的 Unicode 字符 |
提供转义序列是因为无法从键盘输入换行符和水平制表符。通过将字符串文字括在双引号中来描述字符串文字时,在字符串中使用双引号时描述了About。
let msg = 'Tom\'s Movie';
console.log(msg);
>> Tom's Movie
另外,在字符串文字中,反斜杠(\)是一个具有特殊含义的字符,构成转义序列。写一个序列。
let msg = '换行符写成\\n';
console.log(msg);
>>换行符写成\n
可以使用转义序列,例如 \xXX 使用两个十六进制数字表示字符,使用 \uXXXX 使用四个十六进制数字表示字符。
let msg1 = '\x48\x65\x79';
console.log(msg1);
>> Hey
let msg2 = '\u82b1\u675f';
console.log(msg2);
>> 花束
\u{XXXXXX},通过指定 Unicode 代码点来表示字符,是自 ECMAScript 2015 (ES 6) 以来可用的转义序列。
let msg = '\u{57FA}\u{790E}';
console.log(msg);
>> 基礎
6-3 使用模板文字表示字符串
模板文字是表示字符串的一种方式,它是通过用反引号 (`) 括起一系列字符来编写的。在模板字面量中,可以原样输入换行符,也可以在字符串中嵌入表达式和变量值。这里我们将讨论如何在 JavaScript 中使用模板文字。
使用模板文字编写字符串
要在 JavaScript 中编写字符串文字,请将整个字符串括在单引号 (‘) 或双引号 (“) 中。
let nama = 'Shandongsheng Qingdaoshi';
let address = "山东省青岛市";
从 ECMAScript 2015 (ES 6) 开始,现在即使整个都包含在反引号 (`) 中也可以编写。基本用法与用单引号括起来时相同。
let msg = `你好。今天天气不错吧。`;
console.log(msg);
>> 你好。今天天气不错吧。
用反引号编写的字符串称为模板文字。
模板文字和其他字符串之间的主要区别在于换行符被视为换行符。如果您使用单引号等编写字符串,则必须编写转义序列 \n 来换行。在模板文字中,只需在需要换行符的地方键入 Enter即可。
let msg = `你好。
今天天气很好。
散步的感觉真好。`;
console.log(msg);
>> 你好。
>> 今天天气很好。
>> 散步的感觉真好。
通过像这样使用模板文字,您可以编写跨越多行的字符串。
转义序列也可以写在模板文字中。使用 \n 表示换行符,或者如果要将反引号用作字符串中的字符,则编写 \`。
let msg = `在模板文字中使用 \`。\n还可以使用其他转义序列。`;
console.log(msg);
>> 在模板文字中使用 \`。
>> 还可以使用其他转义序列。
在字符串中嵌入表达式
模板文字的另一个特性是能够在字符串中嵌入表达式。模板字面量允许您在字符串中编写表达式,如下所示:
${表达式}
如果在表达式部分写一个变量,存储在变量中的值将嵌入到字符串中。如果在表达式部分写入操作,则计算表达式并嵌入结果。
看看下面的示例。
let name = '橘子';
let cost = 100;
let msg = `今天 ${name}的价格是${Math.trunc(cost*1.1)}元。`;
console.log(msg);
>> 今天橘子的价格是110元。
此示例在一个字符串中嵌入了两个表达式。第一个 ${name} 部分替换为变量名称的值。第二个 ${Math.trunc(cost*1.1)} 部分被替换为首先执行 cost*1.1 操作,然后使用 Math.trunc 方法获取整数部分。
在其他字符串的情况下,我们也可以使用字符串连接通过连接字符串和变量的值来创建字符串,但是使用模板文字更直观的是可以填充变量和表达式。
6-4 字符串对象
String 对象是字符串的包装类。您不仅可以从 String 对象的实例中调用方法和访问 String 对象的属性,还可以从数字中调用方法和访问 String 对象的属性。在这里,我将解释JavaScript的String对象。
字符串对象构造器
String 对象是字符串的包装对象。当您在字符串上调用 String 对象的方法时,该字符串会自动转换为 String 对象并调用该方法。
通常不需要直接创建 String 对象,而是使用 String 对象的构造函数来创建。格式如下。
new String(value)
为参数指定 String 对象的值。如果您指定的不是字符串,它将在转换为字符串后设置为值。该值被设置为由 String 对象包装的原始值。
看看下面的示例。
let obj1 = new String('Hello');
console.log(obj1);
>> String {"Hello"}
let obj2 = new String(365);
console.log(obj2);
>> String {"365"}
let obj3 = new String(0xF3);
console.log(obj3);
>> String {"243"}
如果您指定一个非字符串值作为参数,请注意它是如何转换为字符串的。例如,如果数值以非十进制格式写入,则字符串将转换为十进制格式。
获取String对象的原始值
要获取 String 对象的原始值,请使用 valueof 方法,该方法是 String 对象提供的实例方法。格式如下。
strObj.valueOf()
返回指定 String 对象的原始值。
看看下面的示例。
let obj = new String('青岛市');
console.log(obj.valueOf());
>> 青岛市
能够获得 String 对象的原始值。
也可以通过String对象提供的实例方法的toString方法获取表示指定对象的字符串。格式如下。
strObj.toString()
获取表示指定 String 对象的字符串。
看看下面的示例。
let obj = new String('青岛市');
console.log(obj.toString());
>> 青岛市
能够获得与 valueOf 方法相同的值。
6-5 什么是 JavaScript 中的代理对
代理对作为在JavaScript中处理字符时需要注意的一项。代理对是使用两个字符代码表示一个字符的字符。下面是对 JavaScript 中代理项对的简要说明。
关于代理对
JavaScript 在内部以 UTF-16 字符代码存储字符。UTF-16 中的大部分字符都可以用单个字符代码表示,但随着 Unicode 处理的字符数量增加,16 位字符代码无法支持所有字符。字符已增强为使用两个字符代码。
像这样使用两个字符代码表示字符的方法称为代理对,因为字符是通过组合高代理项和低代理项来表示的。Surrogate在英语中是替代的意思。
这样,JavaScript中的一些字符可能会用两个字符码来表示,所以一定要小心。例如,String 对象的 length 属性返回一个字符中字符代码的个数,因此用代理对表示的字符将返回 2 个字符。日本的常用字符应该不多,但像𪛊这样的字符和🌞🌞这样的表情符号就是。
let word1 = '蓝'
console.log(word1.length);
>> 1
let word2 = '𪛊';
console.log(word2.length);
>> 2
let word3 = '🌞';
console.log(word3.length);
>> 2
‘蓝’有1个字符,而’𪛊’和’🌞’有1个字符但有2个字符。
当可能包含由代理对表示的字符时要小心。
代理对中使用的字符代码
UTF-16 使用从 0x0000 到 0xFFFF 的值作为字符编码。其中0xD800到0xDBFF,原来没有用到,用作高代理,0xDC00到0xDFFF,用作低代理。
使用 String 对象的 charCodeAt 方法获取使用代理项对表示的字符的 UTF-16 字符代码,第一个给出高代理项范围的字符代码,第二个给出低代理项范围的字符代码。
看看下面的示例。
let word = '蓝';
let code;
code = word.charCodeAt(0);
console.log('0x' + code.toString(16));
>> 0xd869
code = word.charCodeAt(1);
console.log('0x' + code.toString(16));
>> 0xdeca
这样我么就得到了’蓝’中使用的两个字符代码中的每一个。
6-6 获取字符串的长度(length)
String 对象的 length 属性返回字符串中的字符数。但是,根据字符的不同,有一个字符返回 2 的字符,所以要小心。本节介绍如何使用 String 对象的 length 属性。
获取字符串的长度(length)
String 对象的 length 属性返回目标字符串中的字符数。格式如下。
字符串.length
JavaScript 在内部以 UTF-16 字符代码存储字符。许多字符由每个字符一个字符代码表示。length 属性返回字符串中每个字符的字符代码总数。返回结果字符串中的字符数。
看看下面的示例。
let foods = "Qingdao";
let address = "青岛市";
console.log(foods.length);
>> 6
console.log(address.length);
>> 3
我们能够通过参考长度属性来获取字符数。(全角字符和半角字母数字字符在 Unicode 中没有区别。)
![](https://www.flashyonder.com/wp-content/uploads/2023/04/javascript_6_101-1024x439.png)
代理对的长度属性的值
请注意,JavaScript 在内部以 UTF-16 格式存储字符,因此需要考虑代理项对。代理项对是由两个字符代码表示的一个字符,对于由代理项对表示的字符,长度属性返回 2。
let word = "𪛊";
console.log(word.length);
>> 2
6-7 用指定的分隔符分割字符串(split)
String 对象实例方法 split 用指定的分隔符分割字符串,并返回一个包含每个元素的数组作为返回值。这里我们将说明如何使用String对象的split方法。
拆分字符串
String 对象的 split 方法用指定的分隔符分割目标字符串,并返回一个包含每个分割字符串作为元素的数组。格式如下。
字符串.split([分隔符[, 最大分割数]])
指定字符串或正则表达式对象作为参数定界符。您不仅可以指定一个字符,还可以指定多个字符的序列。返回一个包含每个拆分子字符串作为元素的数组。如果省略分隔符,则返回一个包含整个字符串作为元素的数组。
如果指定最大分割数,则当分隔符出现指定次数时分割结束。请注意,最后一个拆分子字符串存储在返回数组中,但最后一个分隔符之后的字符串不包含在返回值中。
看看下面的示例。
let months = 'Jan..Feb..Mar..Apr..May..Jun';
let monthAry = months.split('..');
console.log(monthAry);
>> (6) ["Jan", "Feb", "Mar", "Apr", "May", "Jun"]
使用 ‘..’ 作为分隔符拆分字符串。我能够得到一个数组,其中每个除以定界符的子字符串都存储为一个元素。
如果字符串开头包含定界符,则返回值数组的第一个元素将包含一个空字符串。同样,如果字符串末尾包含定界符,则最后一个元素将为空。看看下面的示例。
let months = '/Jan/Feb/Mar/Apr/May/Jun/';
let monthAry = months.split('/');
console.log(monthAry);
>> (8) ["", "Jan", "Feb", "Mar", "Apr", "May", "Jun", ""]
这次字符串在开头和结尾包含分隔符,因此返回的数组包含开头和结尾为空字符串的元素。
接下来,让我们指定字符串的最大拆分数。看看下面的示例。
let months = 'Jan..Feb..Mar..Apr..May..Jun';
let monthAry = months.split('..', 3);
console.log(monthAry);
>> ["Jan", "Feb", "Mar"]
由于最大分割数指定为 3,因此分割会一直进行到分界符出现 3 次为止。最后一个定界符后的字符串不包含在返回值中。
6-8 替换字符串
String 对象实例方法 replace 将字符串中的指定字符串替换为另一个字符串并返回新字符串。在这里,我将解释如何使用 String 对象的 replace 方法。
替换字符串
String 对象的 replace 方法将目标字符串中的指定字符串替换为另一个字符串。格式如下。
字符串.replace(要替换的字符串,新字符串)
在自变量中指定要替换的字符串的字符串或正则表达式对象。用第二个指定字符串替换目标字符串中的第一个指定字符串。不修改目标字符串,返回替换后的新字符串。
请注意,即使有多个目标字符串与第一个参数中指定的字符串匹配,也只会替换找到的第一个字符串。
看看下面的示例。
let str = 'blue bird and blue flower';
let newstr = str.replace('blue', 'Red');
console.log(newstr);
>> Red bird and red flower
字符串中的“blue”被替换为“Red”。请注意,字符串中有多个“blue”,但只替换了第一个“red”。
使用 $ 符号替换为特殊值
您可以使用美元符号 ($) 编写特殊值作为要替换的新字符串。如果第一个参数是字符串而不是正则表达式,它可能不会经常使用,但众所周知以 $ 开头的字符在第二个参数中具有特殊含义。请保留
$& 匹配的子串
$` 匹配部分之前的字符串
$' 匹配部分之后的字符串
$$ $字符
$1, $2, ... 用于正则表达式
看看下面的示例。
let str = 'BananaLemonOrange';
console.log(str.replace('Lemon', '[$&]'));
>> Banana[Lemon]Orange
console.log(str.replace('Lemon', '[$`]'));
>> Banana[Banana]Orange
console.log(str.replace('Lemon', '[$\']'));
>> Banana[Orange]Orange
在这个例子中,要替换的字符串是’Lemon’,所以’$&’变成’Lemon’,’$`’在’Lemon’之前变成’Banana’,’$\”在’Lemon’之后变成’Orange ‘.
6-9 连接字符串
String 对象实例方法 concat 返回一个新字符串,它是多个字符串的串联。这里我们将解释如何使用 String 对象的 concat 方法。
连接字符串
String 对象的 concat 方法通过按顺序将目标字符串与一个或多个指定字符串连接起来,返回一个新字符串。格式如下。
文字列.concat(字符串[, 字符串, ...])
返回一个新字符串,它将参数中指定的字符串连接到目标字符串作为返回值。目标字符串不变。
看看下面的示例。
let pref = '山东省';
let address;
address = pref.concat('青岛市', '市南区');
console.log(address);
>> 山东省岛市市南区
console.log(pref);
>> 山东省
通过将参数中指定的两个字符串按顺序连接到目标字符串,返回一个新字符串。没有对原始字符串进行任何更改。
如果您指定字符串以外的其他内容作为 concat 方法的参数,它将被转换为字符串然后连接起来。您还可以将变量指定为参数。
let point = 56;
let msg = '分数是'.concat(point, '分。');
console.log(msg);
>> 分数是56点分。
变量被指定为 concat 方法的参数。由于变量包含一个数字,它被转换为一个字符串,然后连接到目标字符串。
也可以使用加法运算符 (+) 连接字符串。
let point = 84;
let msg = '分数是' + point + '分。';
console.log(msg);
>> 分数是84点分。
6-10 获取一个重复指定次数(repeat)的新字符串
String 对象的实例方法 repeat 检索一个新字符串,该字符串是目标字符串的指定重复次数。这里我们将解释如何使用String对象的repeat方法。
String 对象的 repeat 方法返回一个新字符串,该字符串是目标字符串重复指定次数。格式如下。
字符串.repeat(次数)
为参数指定一个大于或等于 0 的正数。如果指定 0,则它变为空字符串。指定负值将引发 RangeError。
看看下面的示例。
let str = 'hello!';
console.log(str.repeat(4));
>> hello!hello!hello!hello!
console.log(str.repeat(0));
>> (空字符串)