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