其实这里问的就是es6新增的内容。

let、const

let, const 声明 块级作用域,是对var声明变量的补充。由于var声明可以提升变量名但不提升变量值的行为,导致Js可以跳过很多错误的检查,对我们避免问题或定位发生的错误不友好。引用了let, const 块级作用域,一个变量只能声明一次,并且需要先声明后使用,否则会发生暂时性死区。

变量的解构赋值

  1. 数组的解构赋值
  2. 对象的解构赋值
  3. 字符串的解构赋值
  4. 函数参数的解构赋值
  1. // 数组
  2. const [a, b, c] = [1, 2, 3]
  3. // 对象
  4. const [age, sex] = {age: 18, sex: 'woman', name: '赵敏'}
  5. // 字符串的解构赋值
  6. const [str1, str2, ...strArr] = "hello wrold"
  7. // 函数的参数解构赋值
  8. const sum = ([a, b]) => a + b
  9. const fn = ({age, sex}) => {
  10. console.log(`this is a ${sex}, his is ${age} years old.`)
  11. }

箭头函数

箭头函数之前已写过一篇介绍,这里不再重复。

Symbol

是es6引进的一个新的原始数据类型,表示独立无而二的值。

Set、Map数据结构

三种异步编程的解决方案

Promise
Generator
async…await

for…of 循环

本质
for…of 循环内部调用的是数据结构的Symbol.iterator方法。
使用范围
包括数组、类数组、Set和Map 结构,字符串、Generator对象。

数组

  1. const arr = ['red', 'green', 'blue']
  2. for (let v of arr) {
  3. console.log(v)
  4. }

for … in 用来遍历键名,for…of 用来遍历键值。

Set和Map结构

  1. const arr = ['red', 'green', 'blue', 'blue']
  2. let engines = new Set(arr)
  3. for (let e of engines) {
  4. console.log(e)
  5. }
  6. // Map
  7. let es6 = new Map()
  8. es6.set('set', 'woman')
  9. es6.set('age', 18)
  10. es6.set('name', '赵敏')
  11. for (let [name, value] of es6) {
  12. console.log(name + ':' + value)
  13. }

对象

  1. let obj = {
  2. age: 18,
  3. sex: 'woman',
  4. name: '赵敏'
  5. }
  6. // 遍历键名
  7. for (let e of Object.kesy(obj)) {
  8. console.log(e)
  9. }
  10. // 遍历键值
  11. for (let [key, value] of Object.entries(obj)) {
  12. console.log(`${key}: ${value}`)
  13. }

Proxy

是一种元编程,用来代理操作的默认行为。Proxy 本身是一个构造函数,可以用来改写对象的默认行为。
Proxy 还提供了13种Api,去操作对象。
Vue3.0放弃了Obejct.defineProperty, 而是使用Proxy 去绑定数据和属性。

优点:
proxy 速度更快
13种Api
Object.definePropery 无法监听属性的添加、删除,也不能监听引用类型的数据变更。但是Proxy 可以。

  1. let person = {age: 18, name: '赵敏'}
  2. let proxy = new Proxy(person, {
  3. get: function(target, property) {
  4. if (property === 'age') {
  5. return 20
  6. }
  7. }
  8. })
  9. console.log(proxy.age) // 20

Reflect

目的:
将函数内部的方法放在Reflect 上
让操作对象的返回值更合理
使操作Object 编程函数行为
Reflect对象对应的方法和Proxy对象对应的方法一一对应

  1. let obj = {age: 18, sex: 'woman'}
  2. console.log(Reflect.get(obj, 'age')) // 18
  3. console.log(Reflect.set(obj, 'age', 20))
  4. console.log(Reflect.get(obj, 'age')) // 20
  5. console.log(Reflect.has(obj, 'age')) // true
  6. Reflect.deleteProperty(obj, 'age')
  7. console.log(Reflect.has(obj, 'age')) // false
  8. conosle.log(Reflect.get(obj, 'age')) // undefined

class

es6 module 加载