ES6
ES6 是模板语言
var
定义的变量有变量提升(把变量提到代码第一行),声明的变量有内存泄露,没有被销毁
let
是块级作用域
const
定义常量,不能被改变
const b={a:1};//object地址,有内存
b.a=2;
内存地址不能改变,里面的值可以改变
var
、function
有变量提升,let
、const
没有
console.log(a);//undefined
var a=1;
console.log(b);//报错 is not defined
let b=2;
//块级作用域
{//大括号限制块级作用域
let a=1;//在块级的外面没法找到
var b=2;//var是函数集作用域,在块级里依然可以被变量提升
}
模板语言
var str=`
a
b
`
let name="jack";
console.log(`I'm ${name}`)
声明函数的默认参数
//默认参数,防止忘记传
function add(flag=true){
}
箭头函数
a:function(){}
//ES6
a(){}
function(res){
this //指向内部
}
//ES6
res=>{//箭头函数
this //指向外部
}
数组的解构
var [a,b]=[3,3,2];//数组的分解,a=3
var [x,y,z]="vue";//字符串的分解,x=v
var {m,n}={m:10,n:20};//对象的结构,对key进行拆分
//函数的解构
function sum([x,y]){
return x+y;
}
sum([2,5])
var a=[1,2,3,2]
[...new Set(a)]//得到[1,2,3]去重
Rest 拓展参数
//function sum(...m){
let sum=(...m)=>{//...rest参数,动态的
let total=0;
for(var i of m){
total+=i;
}
console.log(`total:${total}`)
}
sum(4,21,3,2)
//对数组的扩展,对数组拆解
console.log(...[4,8]) //4 8
let a=[1,2];let b=[3,4];[...a,...b] //1 2 3 4
[x,...y]=[1,2,3,4] //x=1,y=[2,3,4]
//对字符串的扩展,对字符串拆解
xy=[...'ES6']; //["E", "S", "6"]
Promise
解决callback回调,通过链式调用,.then对Promise的封装
let checkLogin = function() {
return new Promise(function(resolve, reject) { //resolve成功回调,reject失败回调
let flag = document.cookie.indexOf("userId") > 1 ? true : false;
if (flag = true) {
resolve({
status: 0,
result: true
})
} else {
reject("error");
}
})
}
let getUserInfo = () => {
return new Promise((resolve, reject) => {
let userInfo = {
userId: '101'
}
resolve(userInfo);
})
}
/*
checkLogin().then(res=>{//回调
if(res.status==0){
//登录成功
console.log('登录成功');
}
}).catch(error=>{//捕获异常
console.log(`errors:${error}`);
})
*/
Promise.all([checkLogin(), getUserInfo()]).then(([res1, res2]) => {
console.log(res1.result);
console.log(res2.userId)
})
module.exports和ES6 import/export的使用
//通过export导出,在util文件夹下
export default{ //默认导出
}
export let sum=(x,y)=>{
return x+y;
}
//import导入
import util from './util' //sum(1,2)
import {sum} form './util' //sum(1,2)
import * as util from './util' //util.sum(1,2)
import('./../util')//可以异步加载js文件
模块化开发中的解决方案
AMD(异步模块定义):是requirejs在推广过程中对模块定义的规范化产出。特点:依赖前置
CMD(同步模块定义):是seajs在推广过程中对模块定义的规范化产出。特点:依赖就近,在什么时候使用就在时候时候引入
CommonJS:前端浏览器不支持,在nodejs后端定义模块,在服务端使用,module.exports匿名输出,exports.a带名字的输出
ES6特性export/import