01·ES6·0x01

最新推荐文章于 2025-01-17 21:04:25 发布

weixin_33795093

最新推荐文章于 2025-01-17 21:04:25 发布

阅读量62

点赞数

CC 4.0 BY-SA版权

原文链接：https://juejin.im/post/5c795de251882555a8222fdc

本文深入探讨ES6的let和const声明规则，包括块级作用域、暂时性死区概念，以及const的不可变性和引用类型修改。同时，介绍了解构赋值、模板字符串、字符串新方法等实用功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

let, const

let

不能重复声明

let a = 1
let a = 2   // Identifier 'a' has already been declared
复制代码

存在块级作用域

let a = 1
{
    console.log(a)  // Uncaught ReferenceError: a is not defined
    let a = 2
}
复制代码

{} 中的 a 变量声明不会提升，同时由于下一行声明了变量 a，所以不会找到外层作用域中的 a。这种情况被称作“暂时性死区”（temporal dead zone，简称TDZ）。进入封闭的块级作用域中，变量在声明语句后才可使用。

const

const用来声明常量

const PI = 3.14
const PI = 3.14159265   // Assignment to constant variable.
复制代码

2.不能重复声明

let PI = 3.14
let PI = 3.1415   // Identifier 'PI' has already been declared
复制代码

const声明的常量值为引用类型，虽不能将其指向另一个值，但是其属性能够被修改

const USER = {name: 'seymoe'}
USER.name = '曦莫'    // no problem
复制代码

解构

解构的时候等号两边的结构类似，右边为真实存在的值

let arr = [1, 2]
let [a, b] = arr

let arr2 = [{name: 'seymoe', age: 24}, ['ES6', 'Node'], 'fe']
let [{name, age}, [skillOne, skillTwo], profession] = arr2
let [obj, arr3, str] = arr2

// 左边的变量与右边的值一一对应
复制代码

解构赋值左边的变量名可以提供默认值

let person = {name: 'seymoe'}
let {name, age = 24} = person
复制代码

省略赋值

let arr = [1,2,3]
let [, , i] = arr   // j = 3
复制代码

模版字符串

模版字符串中可以嵌套变量

let prop = 'good'
let str = `Seymoe is a ${prop} man.`
复制代码

自己实现一个 replace 函数，实现原理为利用正则表达式的 replace 函数匹配出变量部分，然后用变量引用的值进行替换，得到新的字符串。

let prop = 'good'
let str = 'Seymoe is a ${prop} man.'

function replace(str) {
    let _str = str.replace(/\$\{([^}]+)\}/g, function (matched, index){
        return eval(key)
    })
    
    return _str
}

replace(str)    // Seymoe is a good man.
复制代码

模版字符串可以换行
标签模版，标签相当于一个函数，此方式能够让我们有机会处理拼接字符串的逻辑

let a = 5
let b = 10

tag`Hello ${ a + b } world ${ a * b }`
// 等同于
tag(['Hello ', ' world ', ''], 15, 50)
复制代码

字符串新方法

`startsWith`

let url = 'https://www.baidu.com'
url.startsWith('https')     // true
复制代码

`endsWith`

let img = 'a.jpg'
img.endsWith('.jpg')    // true
复制代码

`repeat`

let a = 'xi'
a.repeat(3)     // xixixi
复制代码

结语

感谢阅读和指正。我相信本系列的价值，时间最终会给出答案。

第一部分 · ES6

01·ES6·0x01