一篇文章带你了解JavaScript字符串

开发 前端
本文基于JavaScript,介绍了字符串相关操作 。对字符在实际应用的时,需要注意什么,应该怎么去运用,做了详细的讲解。

一、什么是字符串?

一个JavaScript字符串简单的存储一系列字符像 "John Doe"。一个字符串可以是任何引号内的文本。可以使用单引号或双引号:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>项目</title>
</head>
<body style="background-color: aqua;">


<p id="demo"></p>


<script>


var carName1 = "Volvo XC60";
var carName2 = 'Volvo XC60';


document.getElementById("demo").innerHTML =
carName1 + "<br>" + carName2;
</script>


</body>
</html>

图片

可以在字符串中使用引号,只要不匹配字符串周围的引号。

var answer1 = "It's alright";
var answer2 = "He is called 'Johnny'";
var answer3 = 'He is called "Johnny"';

图片

二、String 长度

使用内建的字符串长度属性判断长度:

<script>
var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
document.getElementById("demo").innerHTML = txt.length;
</script>

图片

三、特殊字符

因为字符串必须用引号,JavaScript会误解这样的字符串:

var y = "We are the so-called "Vikings" from the north."

字符串将被截断到 "We are the so-called "。避免这个问题的解决方案, 是使用 ​​\​​ 字符。

反斜杠转义字符,将字符转义:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>项目</title>
</head>
<body style="background-color: aqua;">


<p id="demo"></p>


<script>


var x = 'It\'s alright';
var y = "We are the so-called \"Vikings\" from the north.";


document.getElementById("demo").innerHTML = x + "<br>" + y;
</script>


</body>
</html>

图片

1. 转义符

转义符也可以用来在字符串中插入其他的特殊字符,这些都是常用的特殊字符,可以在特殊本文前面插入一个反斜线。

代码

输出

'

单引号

"

双引号

\

反斜线

五种其他转义字符在JavaScript中是有效的:

代码

输出

\b

退格

\r

回车

\f

表单反馈

\t

水平制表符号

\v

垂直制表符号

以上的转义字符最初是用于控制打字机,电传,传真机。他们在HTML中不再有的任何意义.

四、代码换行

为了达到最佳的可读性,通常喜欢避免超过80个字符的代码行,如果一个JavaScript语句不适合写在一行,最好在操作符的地方换行:

document.getElementById("demo").innerHTML =
"Hello Dolly.";

图片

也可以把代码写在一个有反斜杠的文本字符串内。

document.getElementById("demo").innerHTML =
"Hello Dolly.";

​\​​​方法不是首选方法,它可能没有普遍支持,有些浏览器不允许字符 ​​\​​ 后面的空格。

图片

一个更安全的方法来换行一个字符串,是使用字符串加法:

document.getElementById("demo").innerHTML = "Hello" + 
"Dolly!";

图片

不能在一个代码行加上一个反斜杠来实现换行:

document.getElementById("demo").innerHTML = \
"Hello Dolly!";
/*不能在一个代码行加上一个反斜杠来实现换行,会显示不出来 */

图片

五、总结

本文基于JavaScript,介绍了字符串相关操作 。对字符在实际应用的时,需要注意什么,应该怎么去运用,做了详细的讲解。

对于那些特殊的字符( 转义符),用丰富的效果图 讲解了JavaScript中什么是有效的字符,能够让读者更好的理解。

责任编辑:武晓燕 来源: 前端进阶学习交流
相关推荐

2021-01-29 18:41:16

JavaScript函数语法

2020-11-10 10:48:10

JavaScript属性对象

2021-02-02 18:39:05

JavaScript

2021-06-04 09:56:01

JavaScript 前端switch

2024-01-30 13:47:45

2023-09-06 14:57:46

JavaScript编程语言

2021-01-26 23:46:32

JavaScript数据结构前端

2021-05-18 08:30:42

JavaScript 前端JavaScript时

2024-04-19 14:23:52

SwitchJavaScript开发

2023-07-30 15:18:54

JavaScript属性

2021-03-09 14:04:01

JavaScriptCookie数据

2021-03-05 18:04:15

JavaScript循环代码

2021-06-24 09:05:08

JavaScript日期前端

2023-07-25 16:06:57

JavaScript对象

2023-06-01 17:10:12

HTMLJavaScript

2021-11-26 11:10:07

JavaScript 节点导航

2021-05-07 14:17:01

JavaScript元素网页

2024-07-02 14:14:18

2023-06-06 15:45:40

JavaScript数组

2022-05-13 16:21:38

javascrip脚本SVG
点赞
收藏

51CTO技术栈公众号