JavaScript菜鸟教程

JavaScript 对象

JavaScript 函数

JS HTML DOM

JS 浏览器BOM

AJAX 菜鸟教程

JavaScript 参考手册

JavaScript 字符串(String)

字符串是一个或多个字符的序列,可以由字母,数字或符号组成。

JavaScript中的字符串是原始数据类型,并且是不可变的,这意味着它们是不变的。

JavaScript字符串

JavaScript字符串是用引号括起来的零个或多个字符。

var x = "JavaScript教程 ";
测试看看‹/›

在JavaScript中,您可以选择单引号双引号来包裹字符串。以下两种方法都可以正常工作:

var msg1 = "Hello world";   // 使用双引号
var msg2 = 'Hello world';   // 使用单引号
测试看看‹/›

您可以在字符串内使用引号,只要它们与字符串周围的引号不匹配即可:

var str1 = 'She said "Hey" and left';  // 单引号中的双引号
var str2 = "She said 'Hey' and left";  // 双引号内的单引号
var str3 = "Let's have a cup of tea";  // 双引号内的单引号
var str4 = 'We\'ll never give up'; // 用反斜杠转义单引号
测试看看‹/›

创建字符串的最新方法称为模板常量(template literal)

模板常量(template literal)使用反引号(` `),其工作方式与常规字符串相同:

var x = `该字符串使用反引号。`;
测试看看‹/›

计算字符串长度

length属性返回字符串的长度。对于空字符串,长度为0。

var str = 'JavaScript教程 ';
str.length;// return 15
测试看看‹/›

注意:空格也算作字符。

字符串连接

串联意味着将两个或多个字符串连接在一起以创建新的字符串。

+ 运算符用于添加(连接)字符串。

var str1 = "quick brown fox";
var str2 = "over the lazy dog";

var str3 = "The " + str1 + " jumps " + str2;
测试看看‹/›

template literal功能的一个特殊功能是能够在字符串中包含表达式和变量。不必使用串联,我们可以使用${}语法来插入变量。

var str1 = "quick brown fox";
var str2 = "over the lazy dog";

var str3 = `The ${str1} jumps ${str2}.`;
测试看看‹/›

在这种情况下,使用模板常量(template literal)可能会更易于编写和方便。

转义序列

因为字符串必须用引号引起来,所以以下内容将出错,因为它会使浏览器混淆字符串的结尾:

var x = 'We'll never give up';
var y = "She said "Hey" and left";

转义序列意味着我们对它们进行操作以确保将其识别为文本,而不是代码的一部分。

在JavaScript中,我们通过在字符\前面加上反斜杠()来实现此目的。

Code结果描述
\''单引号
\"双引号
\\\反斜杠

该序列\'  在字符串中插入一个单引号:

var x = 'We\'ll never give up';
测试看看‹/›

该序列\"  在字符串中插入双引号:

var x = "She said \"Hey\" and left";
测试看看‹/›

该序列\\  在字符串中插入反斜杠:

var x = "The character \\ is called backslash";
测试看看‹/›

JavaScript中还有其他六个转义序列有效:

Code描述
\b退格键
\f换页
\n新队
\r回车
\t水平制表符
\v垂直制表符

对于要使用无法使用键盘键入的字符的情况,转义序列也很有用。

长代码换行

为了获得最佳可读性,应避免代码行超过80个字符。

如果JavaScript语句不适合一行,则打破它的最佳位置是在运算符之后:

document.getElementById("para").innerHTML = "The sum of 20 and 30 is " +
sum;
测试看看‹/›

在一行上写一个很长的字符串将很快变得很难阅读和使用。

我们可以使用串联运算符(+)在多行上显示字符串。

var str = "空气污染是化学物质进入 " +
"大气层。 它破坏环境平衡并导致 " +
"几种疾病.";
测试看看‹/›

除了使用多个字符串,我们还可以使用\转义符。

var str = "空气污染是化学物质进入 \
大气层。 它破坏环境平衡并导致 \
几种疾病.";
测试看看‹/›

注意:所述的(\)方法是不优选的,因为它可能导致某些浏览器和minifiers问题。

为了使代码更具可读性,我们可以改用模板常量(template literal)字符串。这些消除了对长字符串进行串联或转义的需要。

var str = `空气污染是化学物质进入
大气层。 它破坏环境平衡并导致
几种疾病.`;
测试看看‹/›

重要的是要知道创建跨多行的字符串的所有方法,因为不同的代码库可能使用各种标准。

字符串基元和字符串对象

通常,JavaScript字符串是从文字创建的原始值:

var city = "New Delhi";

但是,也可以使用 new关键字将字符串定义为对象:

var city = new String("New Delhi");

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

var str1 = "New Delhi";
var str2 = new String("New Delhi");

typeof str1// returns string
typeof str2// returns object
测试看看‹/›

注意:请勿将字符串创建为对象。这会降低执行速度,并会产生一些意外的结果。

使用==运算符时,相等的字符串相同:

var str1 = "New Delhi";
var str2 = new String("New Delhi");

document.write(str1 == str2); //返回 true,因为 str1和 str2的值相等
测试看看‹/›

使用===运算符时,相等的字符串不相同,因为===运算符期望值和类型都相等:

var str1 = "New Delhi";
var str2 = new String("New Delhi");

document.write(str1 === str2); //返回false,因为str1和str2的类型不同
测试看看‹/›

无法比较对象:

var str1 = new String("New Delhi");
var str2 = new String("New Delhi");

document.write(str1 == str2); //因为str1和str2是不同的对象,所以返回false
document.write(str1 === str2); //因为str1和str2是不同的对象,所以返回false
测试看看‹/›

注意(==)和(===)之间的区别。比较两个JavaScript对象将始终返回false。