十一、JavaScript——字符串

ゝ一世哀愁。 2023-09-30 17:51 18阅读 0赞

#### 一、转义字符 ####

> 字符串
> 
> 1.  在 JS中使用单引号或者双引号来表示字符串（要么全用双引号，要么全用单引号，不要混着用）
> 2.  转义字符  **反斜杠 \\**
> 3.  使用typeof检查转义字符返回的是string类型

>  **在 JS中使用单引号或者双引号来表示字符串（要么全用双引号，要么全用单引号，不要混着用）**

![c76abf9d6617450b91519a46a54f22ae.png][]

> 如果在字符串中间想引入一个**冒号”，**有两种办法
> 
> 1.  外层使用单引号，内层使用**冒号“**
> 2.  使用转义字符 **反斜杠\\** 来表示字符

![3f3ba63008954f62a30e42bd777fcc4c.png][]

> **转义字符的其他用法：**
> 
>  *  \\\* 表示 \*
>  *  \\' 表示 '
>  *  \\t 表示 缩进 制表符
>  *  \\n 表示 换行

![99bd161467c44a59adae9bfdb96cda4f.png][]

#### 二、模板字符串 ####

> **问题：普通的字符串不能做到跨行，会报错**

![c96cdfd4d07442608033aedcb65db53b.png][]

> **模板字符串：**使用反单引号 \` 来表示模板字符串 即  **let 变量 = \`内容\`**
> 
> **作用：**
> 
> 1.  能够实现编译器中的换行和控制台打印输出的换行
> 2.  实现变量的嵌套

> **实现编译器中的换行和控制台打印输出的换行**

![6a175046a9db4fd0b6163d739f868d55.png][]

script>
        /*
            字符串
                - 在 JS中使用单引号或者双引号来表示字符串（要么全用双引号，要么全用单引号，不要混着用）
                - 转义字符 \
                        \*   表示  *
                        \'   表示  '
                        \t   表示  缩进  制表符
                        \n   表示  换行
    
            模板字符串
                - 使用反单引号 ` 来表示模板字符串
                
            
        */
    
        // let a  = 'Hello'
    
        // let a = '我是一个"字符'  //外层使用单引号，内层使用冒号
    
        // let b = "我是一个\"字符"   //使用转义字符，表示冒号
    
    
        // let a = "这是一个\t字符"
    
        
        // let b = "这是一个\n字符"
    
        let a = ` 今天天气              //实现编译器中的换行
                真不错
                啊 `
    
        console.log(a)
       
    
    </script>

> **实现变量的嵌套 ：**
> 
>  *  假设有一个变量name，后面定义的变量str要引用这个name的变量，就使用**单引号**，即模板字符串
>  *  **let 变量名 = \` $\{引用的变量名\}\`**

![62f5d32f1da540649cf0420c078602d1.png][]

[c76abf9d6617450b91519a46a54f22ae.png]: https://img-blog.csdnimg.cn/c76abf9d6617450b91519a46a54f22ae.png
[3f3ba63008954f62a30e42bd777fcc4c.png]: https://img-blog.csdnimg.cn/3f3ba63008954f62a30e42bd777fcc4c.png
[99bd161467c44a59adae9bfdb96cda4f.png]: https://img-blog.csdnimg.cn/99bd161467c44a59adae9bfdb96cda4f.png
[c96cdfd4d07442608033aedcb65db53b.png]: https://img-blog.csdnimg.cn/c96cdfd4d07442608033aedcb65db53b.png
[6a175046a9db4fd0b6163d739f868d55.png]: https://img-blog.csdnimg.cn/6a175046a9db4fd0b6163d739f868d55.png
[62f5d32f1da540649cf0420c078602d1.png]: https://img-blog.csdnimg.cn/62f5d32f1da540649cf0420c078602d1.png