es6学习视频总结

es6 兼容性
1.在线编译(延迟)

引入browser.js
<script type="text/babel">
  es6写法
</script>

2.提前编译

node 环境
npm i @babel/core   -----核心库
npm i @babel/parset-env -----预设,预先设置好的配置 是否编译一些es6的写法
npm i @babel/cli    -----命令

npm i @babel/polyfill    -----指令(兼容低版本浏览器 填充)

1.变量(let const)

1. 不可以重复声明 
2. 可以限制修改 
3. 有块级作用域

2.函数

箭头函数,声明的时候可以确定this
(param)=>{return x}
只有一个参数时    param=>{return x}
只有一个返回值时  (param)=x
两者都满足时      param=>x

3.解构赋值

左右两边结构相等
右边必须是个类型
声明跟赋值一步操作

let {a,b}={a:1,b:1}
let [a,b]=[1,2]

4.数组 (map,reduce,filter,forEach)

5.字符串(字符串模板 ``,startsWith() endsWith())

6.面向对象(class extennds constructor super )

class Partent {
  constructor(name,age){
    this.name=name
    this.age=age
  }
  getNaem(){
    return this.name
  }
  getAge(){
    return this.age
  }
}

class Children extends Partent {
  constructor(name,age,sex){
    super(name,age)
    this.sex=sex
  }
  getSex(){
    return sex===2?'女':'男'
  }
}

7.异步

Promise
let p=new Promise((res,rej)=>{})
p.then((res)=>{})
p.catch((e)=>{})

generator
function *  taxi(){
  let a=3
  console.log(a)
  yield
  let b=4
  console.log(b)
}
let car=taxi()
car.next()

async await( await 返回一个 Promise成功后的结果 才会继续访问)
async function taxi(){
let a=2
let result=await new Promise((resolve, reject) => {
      setTimeout(() => {resolve(1),a=3}, 2000)
    })
console.log(result)
console.log(a)
}

8.模块化

语言支持,但浏览器不支持,最常用的编译webpack
定义
export function(){}
export 变量
export class
export obj
export defalut xx (默认导出一个)

使用
impoort xx from xx (引入一个) 
import {a,b} from xx (选择性引入) 
import * as x from xx (引入所有)