1,es6的环境搭建
dist目录放es5的代码,
src目录放es6的代码
index.html,引入se6里面的index.js文件
初始化项目
cnpm init -y
-y表示所有都同意
全局安装Babel-cli
Babel是用来将ES6转换成ES5的一个工具
cnpm install babel-cli -g
设置转码规则
cnpm install --save-dev babel-preset-es2015 babel-cli
项目根目录下新建.babelre文件,该文件用来设置转码规则和插件
{
'presets':['es2015'],
'plugins':[abcdrfghijklmnopqrstuvwxyz,abcdefghijklmnipqrstuvwxyz]
}
设置npm run bulid 自动转码
在backage.json文件下的scripts对象中写
"bulid":"babel src/index.js -o dist/index.js"
2,新的声明方式
var 随处可用,随处可改变的变量,容易污染全局
let 只在作用域内生效,不会污染全局
const,长量,从开始,到结束,打死不改变
//没有作用域一说
//在哪都能访问到
var a =1;
{
var a = 2;
}
console.log(a); //2
//let 声明的变量只在作用域里面有效
{
let a = 1;
}
console.log(a)//undefined;
//常量,从声明到销毁都不可改变
const a = 1;
var a = 2;
编译时会报错
3,变量的解构赋值
1,数组解构
let [a,b]=[1,2];
输出 1 2
2,数组和赋值统一
let [a,[b],c]=[1,[2],3]
console.log(a,b,c) //123
3,解构的默认值
let [a,b='默认值']=[1]
console.log(a+b)
输出 1默认值
4,undefined和null
let [a,b='默认值']=[1,undefined]
输出 1默认值
5,null表示有值,只不过值为null,所以就没有取默认值
let [a,b='默认值']=[1,null]
输出 1null
6,对象的解构赋值,对象的名字不能一样
let {foo,bar}={foo:'zs',bar:'lisi'}
输出 zslisi
字符串解构
let [a,b,c,d,e,f]='今天天气好好'
console.log(a)//今
console.log(b)//天
console.log(c)//天
console.log(d)//气
console.log(e)//好
console.log(f)//好
4,扩展运算符和rest //不确定传的是什么,可以用扩展运算符,可以传入多个值
let a =1
function ft (...a) {
console.log(a)//1
}
ft(a)