const 定义的常量， 无法更改。
if(true){
let name ="kerwin"
}
const obj = {name:"kerwin"}
obj.name="xiaoming"
// obj = {name:"xioamng"}
// obj= 'dwadwa'
3. 箭头函数
箭头函数是ES6推出的，所以在低版本浏览器是有兼容问题的，语法简介明了，逻辑更清晰。
箭头函数没有自己的this，this指向外部的this，并且this会在创建的时候就绑定好.
const fn1 = function() {
console.log(this)
}
fn1() // window
const obj = {
name: 'tom',
fn2 () {
fn1() // window
console.log(this) // obj
}
}
obj.fn2()
// 在箭头函数定义的位置往上数，这一行是可以打印出 this 的
// 因为这里的 this 是 window
// 所以箭头函数内部的 this 就是 window
const obj = {
fn: function () {
console.log(this)
},
// 这个位置是箭头函数的上一行，但是不能打印出 this
fun: () => {
// 箭头函数内部的 this 是书写箭头函数的上一行一个可以打印出 this 的位置
console.log(this)
}
}
obj.fn()
obj.fun()
4. 解构
let {type,payload} = data; // {type:"",payload:""}
5 ... 展开合并
[...arr1,...arr2]
{...obj1,...obj2}
6. promise
//异步处理方案
1. 回调函数
2. Promise
3. generator 生成器 yield
4. async await
//解决回调地狱 ，嵌套金字塔
function test1(){
return new Promise((resolve,rejet)=>{
setTimeout(() => {
resolve("123")
}, 2000)
})
}
test1().then(res=>{
}).catch(error=>{
})
// pending reject fullfilled
axios.get("1.php").then(res=>{
return axios.get(2.php,{res})
}).then(res=>{
return axios.get(3.php)
}).then(res=>{
console.log(res.data)
}).catch(error=>{
console.log(error)
})
async await 写起来
async function test(){
var a = await axios.get(1);
var b= await axios.get(2,{a});
var c= await axios.get(3,{b})
console.log(c);
}
test()
//所有的异步都结束
Promise.all([axios.get(1),axios.get(2)]).then(res=>{
//loading隐藏
}).catch(error=>{
})
Promise.race([axios.get(1),axios.get(2)])
`Promise.any()`跟`Promise.race()`方法很像，只有一点不同，就是`Promise.any()`不会因为某个 Promise 变成`rejected`状态而结束，必须等到所有参数 Promise 变成`rejected`状态才会结束。
7 .class (语法糖 => 构造函数,babel-loader)
class Person{
constructor(name,age) {
this.name = name;
this.age =age;
}
say=()=>{
}
}
class Test extends person{
constructor(name,age,location) {
super(name,age);
this.location = location;
}
}8 .模块化
import obj from "./a" ;
export default aaa;
import {test} from "./b" ;
export {test} ;
export var test =function(){}
AMD - 前端 异步加载 - 提前下载， 提前加载 require.js
CMD - 异步加载 - 提前下载 ， 按需加载 -- 玉伯 -sea.js
CommonJs -同步加载（webpack）
require("./b")
=>module.exports
=>exports
ES6 - 模块化
//ES6 和 commonJS区别？
//ES6可以导入某几个接口 import {a} from './module.js' + webpack- tree shaking 摇树优化
//commonJS 导入整个文件
9. 异步遍历器生成函数(大厂面试)
Generator 函数返回一个同步遍历器，异步 Generator 函数的作用，是返回一个异步遍历器对象。在语法上，异步 Generator 函数就是async函数与 Generator 函数的结合。
function timer(t) {
return new Promise(resolve => {
setTimeout(() => {
resolve(t)
}, t)
})
}
async function* fn() {
yield timer(1000)//任务1
yield timer(2000)//任务2
yield timer(3000)//任务3
}
// 使用一下 for await ...of
async function fn1() {
for await(const val of fn()) {
console.log("start",Date.now())
console.log(val);
console.log("end",Date.now())
}
}
fn1();