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'

        解构：

[code]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)很重要，优雅处理异步

阅读更多