ES6常用语法

一、ES6是什么？

    新的JavaScript语法标准

    使用babel语法转换器，支持低端浏览器

    流行的库基本都基于ES6构建，React、vue默认使用ES6新语法开发

二、ES6语法概览

    1、块级作用域、字符串、函数

        作用域：定义变量使用let替代var

                    const定义不可修改的变量

                    作用域和{}：

{ let a = 0 } console.log(a)// 如果这样是打印不到的，因为let是定义局部变量，a在作用域里

        字符串：使用反引号，直接写变量

                    多行字符串(注意包括字符串时要用~那个按键的` `来把字符串包起来)

                    告别+拼接字符串

let name = 'World' //before console.log('hello'+name+'!\n thanke you') //after console.log(`hello${name}! thanke you`)

        函数 ：参数默认值、箭头函数、展开运算符

const double = num => num*2// num只有一个时可以加括号可以不加括号，num是参数，num*2返回值 const add = (num1,num2=1) => { return num1+num2//{}里面可以是个函数体 } console.log(double(3)) // 6 console.log(add(3,4)) // 7 console.log(add(3)) // 4 let arr = [5,6] //...可以吧arr展开 console.log(add(...arr)) // 11 //...可以做数组合并 console.log([1,2,3,...arr]) // [1,2,3,5,6]

 2、对象扩展、解构

        Object扩展：Object.key、value、entries

                            对象方法简写，计算属性

                            展开运算符（不是es6标准）

const key = 'job' const obj = { key, num:1, str:'hello' work(){}, [key]:'fe', [key+'world'}:'fe'// []可以写表达式 } console.log(obj)// {key:'job',num:1,str:'hello'work:f work(),job:'fe',jobworld:'fe'

        解构：

let arr = [1,2] let[num1,num2] = arr console.log(num1,num2)// 1 2 const obj = {type:'it',name:'world'} const {type,name} = obj console.log(type,name)// it world

 3、类、模块化等

        es6中自带了模块化机制，告别seajs和require.js

            Import、import{}

module.js

export const name = '123'

mian.js

import {name} from'./module.js' console.log(name)// 123

            Export、Export default

module.js

export default function(){// 默认暴露，除了函数还可以是对象 console.log('hello') }

mian.js

import say from './module.js'// 不需要大括号，直接赋给一个值就可以了 say()// 如果是对象还可以通过say.属性来调用

            Node现在还不支持，还需要用require来加载文件

三、其他

        1、对象扩展符

        2、装饰器

        3、Async await(ES7)很重要，优雅处理异步