变量声明
变量可能具有的特性
块级作用域，变量提升（变量声明之前使用该变量），全局属性，重复声明，暂时性死区（变量声明之前的区域无法使用该变量），初始值设置，指针指向（重复赋值）
let
块级作用域，不存在变量提升，不能重复声明，不能重复赋值
const
块级作用域，不存在变量提升，不能重复声明，不能重复赋值
声明的为常量，值不可更改；常量名一般大写，且必须设置初始值
对数组和对象元素的修改，不算做对常量的修改，不会报错；修改的只是堆中的数据，不会改变栈中的指针
声明数组和对象使用 const，可以避免一些误操作
解构赋值
按照一定的模式将数组或对象中的元素提取出来，并将元素作为一个变量进行赋值
解构对象：数组、对象
// 1.数组的解构
const F4 = ['小沈阳', '刘能', '赵四', '宋小宝']
let [xiao, liu, zhao, song] = F4
// 2.对象的解构
const person = {
name: '张三',
age: 35,
crime: function () {
console.log('无法无天！')
},
}
let { name, age, crime } = person模板字符串
声明方式：【` `】
字符串内部可以直接换行；使用 `${变量名}` 进行变量拼接
let comedian = `<ul>
<li>沈腾</li>
<li>马丽</li>
<li>艾伦</li>
<li>魏翔</li>
</ul>`
console.log(comedian)
// 可以直接进行变量拼接
let favorite = `沈腾`
let sentence = `${favorite}是我最喜欢的喜剧演员！`扩展运算符
【...】 扩展运算符将数组元素从数组中释放出来
const escort = ['王朝', '马汉', '张龙', '赵虎']
console.log(...escort) // '王朝' '马汉' '张龙' '赵虎'应用
// 1.数组的合并
const kuaizi = ['王太利', '肖央']
const fenghuang = ['曾毅', '玲花']
// 字符串拼接
const singer = kuaizi.concat(fenghuang)
console.log(singer) // ["王太利", "肖央", "曾毅", "玲花"]
// 扩展运算符合并数组
const singer1 = [...kuaizi, ...fenghuang]
console.log(singer1) // ["王太利", "肖央", "曾毅", "玲花"]
// 2.数组的克隆
const general = ['关羽', '张飞', '赵云']
// 如果数组中的数据有引用类型的数据，则此处的克隆属于浅拷贝
// 如果没有，则属于深拷贝
const general1 = [...general]
console.log(general1)
// 3.将伪数组转换为真正的数组
const divs = document.querySelectorAll('div')
const divArr = [...divs] // 也可以使用 arguemnts
console.log(divArr)模块化
将一个复杂的系统分解成多个独立的模块的代码组织方式
优点：防止命名冲突、代码复用、高维护性
模块化功能主要由两个命令构成：export 和 import
export
导出数据和功能
export 导出的三种方式：分别暴露，统一暴露，默认暴露
// 分别暴露
export let majorMan = '沈默'
export function wifeInfo() {
let wife = {
name: '殷若涵',
job: '汇联号掌权人',
}
console.log(wife)
}
// 统一暴露
let master = '徐阶'
function masterInfo() {
let age = 50,
job = '大明次辅'
console.log(`年龄：${age}；工作：${job}`)
}
export { master, masterInfo }// 默认暴露
export default {
friend: ['徐渭', '姚长子'],
outPut: function () {
this.friend.forEach((item) => {
console.log(item)
})
},
}import
导入数据和功能
注意点：import * 和 as 关键字
<!-- module 的加载实现是 es6 语法，需要添加 type="module" -->
<script src="./father.js" type="module"></script>// import * 一次性导入模块中的所有变量
import * as child1 from './child1.js'
console.log(child1.majorMan)
child1.wifeInfo()
// as 关键字，将输入的变量重命名
import { master, masterInfo as getInfo } from './child2.js'
console.log(master)
getInfo()
import child3 from './child3.js'
child3.outPut()输出结果
import()
支持动态加载模块，可以用在任何地方，不仅仅是模块，非模块的脚本也可以使用
在运行时执行，也就是说，什么时候运行到该语句，就会加载指定的模块
import() 函数与加载的模块没有静态连接关系
import() 函数是同步加载
if (condition) {
import('moduleA').then(...);
} else {
import('moduleB').then(...);
}
