事件代理（事件委托）
由于事件会在冒泡阶段向上传播给父节点，因此可以把子节点的监听函数定义在父节点上，由父节点的监听函数统一处理多个子元素的事件。这种方法叫做事件的代理（delegation）。比如ul与li
定时器之setTimeout()
- clearTimeout()：取消定时器
定时器之setInterval()
- clearInterval()：取消定时器
闭包
- 特点：
1、 函数嵌套函数
2、 内层函数可以访问外层函数的变量和参数 - 作用：
1、 防止变量和参数被垃圾回收机制回收
2、 防止变量和参数被外部污染（变量只在闭包内部可访问） - 风险：
滥用可能会造成内存泄漏
防抖（debounce）
对于短时间内连续触发的事件（比如下面提到的滚动事件），防抖的含义就是让某个时间期限内，事件处理函数只执行一次
200ms时间未到的情况下，timer会重置定时。
节流
- 场景：
1、 搜索框input事件，例如要支持输入实时搜索可以使用节流方案（间隔一段时间就必须查询相关内容），或者实现输入间隔大于某个值（如500ms），就当作用户输入完成，然后开始搜索，具体使用哪种方案要看业务需求。
2、 页面resize事件，常见于需要做页面适配时。需要根据最终呈现的页面情况进行dom渲染（这种情况一般是使用防抖，因为只需要判断最后一次的变化情况）
命令行工具
1、 CMD
- 选择盘符：如E：
- 查看盘符及目录下文件与文件夹：dir
- 清空命令行信息：cls
- 进入文件夹或目录：cd 文件夹名
- 返回上一级目录：cd ../或cd ..
- 快速补全目录或文件夹名：tab
- 创建文件夹：mkdir 文件夹名称
- 查看历史输入过的命令：上下按钮
2、 PowerShell
一样
Let命令
es6新增命令，用来声明变量。它的用法类似于var，但是所声明的变量只在let命令所在的代码块内有效。
- let块级作用域（花括号级别的）
- 对比var和let在循环中的应用
每次循环都是新的i，所以能的到想要的效果
- let不存在变量提升
“var”命令会发生变量提升现象，即变量可以在声明之前使用，值为undefined。这种现象多多少少是有些奇怪的，按照一定的逻辑，变量应该在声明语句之后才可以使用。
为了纠正这种现象，let命令改变了语法行为，它所声明的变量一定要在声明后使用，否则报错。
- let不允许重复声明
Const命令
- 一旦声明，不可改变。
- 必须初始化，不能留到以后赋值。
- const与let作用域一样，块级作用域
- 不存在变量提升
- 不能重复声明
对象解构赋值
简化上述user.name……的方式，利用解构赋值
注意：对象的属性没有次序，变量必须与属性同名才能取到正确的值。
方法也适用
字符串扩展
- 字符串遍历器接口
for...of循环遍历
- 模板字符串
字符串新增方法
- include()、startsWith()、endsWith()
- repeat()
- padStart()、padEnd()
- trimStart()、trimEnd()
- at()
数组扩展——扩展运算符
- 替代函数的apply方法
- 合并数组
image.png
数组扩展——新增方法
- Array.from()
arguments：默认情况下是可以在无参函数中传递参数的，使用arguments读取。
元素集合
类似数组的对象
- Array.of()
对象的扩展
-
属性的简洁表示法
- 属性名表达式
- 对象的扩展运算符
函数的扩展——箭头函数
- 箭头函数的一个作用就是简化回调函数（匿名函数）
注意：对于普通函数来说，内部的this指向函数运行时所在的对象，但是这一点对箭头函数不成立。它没有自己的this对象，内部的this就是定义时上层作用域的this
Set
- size
- add()
- delete()
- has()
image.png
- clear()
Promise
Promise是异步编程的一种解决方案。
所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说，Promise是一个对象，从它可以获取异步操作的信息。Promise提供统一的API，各种异步操作都可以用同样的方法进行处理。
有了Promise对象，就可以将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数。此外，Promise对象提供统一的接口，使得控制异步操作更加容易。
- 基本用法
<script>
var box = document.getElementById("box")
function loadImageAsync(url){
const promise = new Promise(function(resolve,reject){
//异步处理
const image = new Image()//创建Image对象
image.src = url
image.onload = function(){
resolve(image)
}
image.onerror = function(){
reject(new Error('Could not load image at'+ url))
}
})
return promise
}
const promise = loadImageAsync("https://img0.baidu.com/it/u=3233991184,2570354199&fm=253&fmt=auto&app=120&f=JPEG?w=750&h=500")
promise.then(function(data){
//成功
box.appendChild(data)
},function(error){
//失败
box.innerHTML = "图片加载失败"
})
</script>
Async函数
使得异步操作更加方便
可以将异步操作变为同步操作，也就是不管前面或中间是否有异步耗时操作，都会按顺序执行。
await还会直接将promise中的而结果提取出来，不用再调用then方法。
Class的基本语法
- ES5中类的写法
- ES6中类的写法
- constructor方法
constructor()方法是类的默认方法，通过new命令生成对象实例，自动调用该方法。一个类必须有constructor()方法，如果没有显式定义，一个空的constructor()方法会被默认添加。
- 实例对象、实例属性与实例方法
- 静态方法
- 静态属性
Class的继承
Module的语法
历史上，JavaScript一直没有模块（Module）体系，无法将一个大程序拆分成互相依赖的小文件，再用简单的方法拼装起来。其他语言都有这项功能，如Java的import。但JavaScript却没有这方面的支持。
- export命令
- import命令
除了指定加在某个输出值，还可以使用整体加载，即用*指定一个对象，所有输出值都加载在这个对象上面
- export default命令
一个文件默认只能存在一个export default
网友评论