ES6

let 和var

	let具有块级作用域，在一个作用域中，不能重复声明，let也没有变量提升，只在声明后才能使用
		
	var只有函数作用域，在函数内声明，函数外无效

注意 ：使用let的for循环的参数和{}里面不是一个作用域，而使用var时for的参数会泄露成全局变量

暂时性死区

只要块级作用域内存在 let 命令，它所声明的变量就“绑定”（binding） 这个区域，不再受外部的影响。

块级作用域与函数声明

ES5中规定函数是不可以在块级作用域中声明的，但是浏览器没有遵行此规则，依然可以运行
ES6明确允许函数在块级作用域中运行，语法规则相当于let，作用域外不可使用

注意：在浏览器中，有条件的创建函数 ，函数声明相当于函数表达式声明一样，，只是把函数名提升。
详情请见：

箭头函数

• 如果只有一个参数，圆括号（）可以省略
• 如果只有一个return，大括号{}可以省略

let a = [1, 2, 3, 5, 6, 9];
// alert(a.sort((a, b) => a - b));
let func = x =>x;

alert(func(a[0]));

• 固定this的作用

class Json {
  constructor() {
    console.log(this);
    this.a = 12;
    this.fn = () => {
      console.log(this);
      alert(this.a)
    }
  }
}
let aData = new Date();
let json = new Json();
aData.fn = json.fn;
aData.fn();//弹出依然是12

函数（参数）

• 参数展开、展开…args
  • 收集剩余的参数，必须当到最后一个参数位置
  • 展开数组，简写，效果和直接把数组的内容写在这儿一样

let a = [1, 2, 3];
let func = (a,b) => {
  return a + b;
}
console.log(func(...a));//3

• 默认参数

let a = [1, 2, 3];
let func = (a, b = 2, c = 3) => {
  return a + b + c;
}
console.log(func(1));//6

let json1 = {
  a: 1,
  b: 2,
}
let json2 = {
  ...json1,
  c: 3
}
console.log(JSON.stringify(json2)); //{"a":1,"b":2,"c":3}

解构赋值

1. 左右两边的结构必须一样
2. 右边必须是个东西
3. 声明和赋值不可以分开（必须在一句话中完成）

// let [a, b, c] = [1, 2, 3];
// let {a,b,c}={
//   a: 1,
//   b: 2,
//   c: 3
// }

let [json, [c, d], str, num] = [{ a: 1, b: 2 }, [3, 4], "dasdasd", 3121];
console.log(json,c,d,str,num);//{a: 1, b: 2} 3 4 "dasdasd" 3121

数组

• 新增4个方法
• map（）映射，一个对一个

let arr = [1, 2, 3];
let result = arr.map(
  item =>item * 2
)
console.log(result);//2,4,6

• reduce（） 汇总 一堆出来一个
  算总数，出来一个数

let arr = [22, 33, 44]; //arr[0];arr[i];i  初始值  
let addResult = arr.reduce(function (tmp, item, index) {
  // return tmp + item;
  if (index == arr.length - 1) {
    return (tmp + item) / arr.length
  } else {
    return tmp + item;
  }
})
console.log(addResult);

• filter（）过滤器，保留返回值为true的

let arr = [{
  name: "奔驰",
  price: "1221212"
}, {
  name: "大众",
  price: "122"
}];
let result = arr.filter((arr) => arr.price >= 1000);//filter参数为arr本身
console.log(JSON.stringify(result));//[{"name":"奔驰","price":"1221212"}]

• forEach（index,item）循环迭代

let arr = [1, 2, 3, 4, 5];
let result = arr.forEach((item,index) => alert(index + ":" + item))//1,2,3,4,5

字符串

1. 多了两个新方法
   • startsWith()
   • endsWith()

let demo = "http://www.baidu.com";

if (demo.startsWith("https://")) {
  alert("此网址为安全地址")
} else if (demo.startsWith("http://")) {
  alert("此网址为普通网址");
} else {
  alert("其他");
}

2. 字符串模板
   字符串连接
   1. 直接把东西塞到字符串里面 ${东西}
   2. ``内部可以直接换行

Promise（）

• promise简单用法

let p = new Promise(function (resolve, reject) {
  $.ajax({
    url: 'data/1.txt',
    dataType: 'json',
    success: function (rec) {
      resolve(rec);
    },
    error: function (rec) {
      reject(rec);
    }
  })
})
p.then(function (rec) {
  alert("success");
  console.log(rec);//成功了，打印出json
}, function (rec) {
  alert("fail");
  console.log(rec);
})

• jquery自带promise

$.ajax({
  url: 'data/1.txt',
  dataType: 'json',
}).then(
  function (rec) {
    console.log(rec);
  }, function (rec) {
    console.log(fail);
  }
)

• Promise.all

Promise.all([
  $.ajax({
    url: 'data/1.txt',
    dataType: 'json',
  }),
  $.ajax({
    url: 'data/2.txt',
    dataType: 'json',
  })
]).then(([a,b]) => {
  console.log(a);
  console.log(b);
}, (rec) => {
  alert("失败");
})

async/await

样式上和同步类似，实际是异步执行的

• 普通函数会一直执行，直到结束，async函数能够“暂停”

async function show() {
  let a=1;
  let b = 2;
  let data = await $.ajax({
    url: "data/1.txt",
    dataType:"json"
  })
  alert(a+b+data.b)
}
show();

ES6面向对象

• class（类声明）
• constructor(构造函数声明)
• extends（继承）
• super（父类/超类属性）

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  showName() {
    alert(this.name);
  }

  showAge() {
    alert(this.age)
  }
}

class Worker extends Person {
  constructor(name, age, job) {
    super(name, age)
    this.job = job;
  }
  showJob() {
    alert(this.job);
  }
}

let w = new Worker("James", 36, "player");
w.showName();
w.showAge();
w.showJob();

ES6模块系统

• 定义模板
  关键字exports定义，可以定义变量，函数，对象等；

export let a = 1;
export let b = 2;
export function show() {
  console.log("success");
}
export default 99;

• 使用模块
  关键字import导入

import * as model1 from './model1'//导入所有
model1.show();
console.log(model1.a);
console.log(model1.b);

导入默认或者部分

import model1 from './model1';//导入default
import {a,b} from './model1'//导入部分