为表达全国各族人民对抗击新冠肺炎疫情斗争牺牲烈士和逝世同胞的深切哀悼，国务院今天发布公告，决定2020年4月4日举行全国性哀悼活动。在此期间，全国和驻外使领馆下半旗志哀，全国停止公共娱乐活动。4月4日10时起，全国人民默哀3分钟，汽车、火车、舰船鸣笛，防空警报鸣响。
愿逝者安息，愿生者奋发，愿祖国富强。

ES6

1.历史
ECMAScript和JS
ECMA是标准，JS是实现
EMCAScript简称ES
低端浏览器主要支持ES3.1
高端浏览器大部分支持ES6
2.历史版本
1996.11, ES1.0 Netscape 将 JS 提交给 ECMA 组织，ES 正式出现
1998.06，ES2.0 正式发布
1999.12, ES3.0 被广泛支持
2011.06, ES5.1 成为 ISO 国际标准
2015.06, ES6.0 正式发布
3.兼容性问题
ES6支持IE10+ 、Chrome、 Firefox、 NodeJS 、移动端
解决方法—在线转换或提前编译

新特性

1.变量
2.函数
3.数组
4.字符串
5.面向对象
6.promise
7.generator
8.模块化

1.let和const

1.原有的var
可以重复声明
无法限制修改
没有块级作用域
2.新增的let（变量）
不可重复声明
可以修改
块级作用域
3.新增的const（常量）
不可重复声明
不可修改
块级作用域

2.箭头函数

通俗的话就是将function去掉，加上=>

//原函数
function user() {
 alter(你真帅)
}
//箭头函数  
user () => {
alter(你真帅)
}

有以下情况
若只有一个参数，() 可以省
若只有一个return，{}可以省

3.参数 …args

表示剩下的数组，但是必须在最后一位

function show(a, b, ...args) {
    console.log(a)
    console.log(b)
    console.log(args)
}
console.log(show(1, 2, 3, 4, 5))

结果为a=1 b=2 args=[3,4,5]

let arr1 = [1, 2, 3]
let arr2 = [4, 5, 6]
let arr3 = [...arr1, ...arr2]
console.log(arr3)

结果为[1,2,3,4,5,6] 也就是用参数来表示数组

4.解构赋值

左右两个边结构需要一样
声明和赋值赋值不能分开

let [a, b, c] = [1, 2, 3]
console.log(a, b, c)

let {x, y, z} = {x: 1, y: 2, z: 3}
console.log(x, y, z)

let [json, arr, num, str] = [{ a: 1, b: 2 }, [1, 2, 3], 8, 'str']
console.log(json, arr, num, str)

通俗的说，就是在一句话里进行赋值，左右两边的结构必须相等，数组对应数组，字符串对应字符串等等

扫描二维码关注公众号，回复： 12974697 查看本文章

5.数组

1.map方法映射（有点像高数第一章里函数的概念）

let arr = [1,2,3]
let result = arr.map(function (item) {
    return item*2
})
let result2 = arr.map(item=>item*2) // 简写
console.log(result)
console.log(result2)

let score = [50,60,70,80]
let result3 = score.map(item => item >= 60 ? '及格' : '不及格')
console.log(result3)

结果
[2,4,6]
[2,4,6]
[ ‘不及格’, ‘及格’, ‘及格’, ‘及格’ ]

2.reduce 汇总（可以求和，求阶乘等）

var arr = [1, 3, 5, 7]
var result = arr.reduce(function (prev, cur, index) {
   // prev 上次回调结果，cur当前元素，index索引
    console.log(prev, cur, index)
    return prev+cur
})
console.log(result)

一篇关于reduce感觉不错的介绍
3.filter 过滤器

var arr = [1, 2, 3, 4]
var result = arr.filter(item => item % 2 === 0)
console.log(result)
//输出结果为true的值

4.forEach
循环迭代，大家很熟悉了，不多叙述了

6.字符串

startsWith
endsWith

var url = 'http://www.baidu.com'
console.log(url.startsWith('http'))
console.log(url.endsWith('com'))
// 结果  true  true

简单的来说就是用来判断开头和结尾

7.Promise

异步和同步概念
异步，各操作之间无关，同时执行多个操作，代码复杂
同步，只能做一件事，代码简单

Promise
用同步的方式来写异步，改善了可读性，对于多层嵌套的回调函数很方便，简单的来说就是一个字，牛逼！

// 原始写法
step1(function (value1) {
  step2(value1, function(value2) {
    step3(value2, function(value3) {
      step4(value3, function(value4) {
      });
    });
  });
});

// Promise 写法
(new Promise(step1))
  .then(step2)
  .then(step3)
  .then(step4);

Promise.all(promiseArray)方法
将多个Promise对象实例包装，生成并返回一个新的Promise实例
promise数组中所有的promise实例都变为resolve的时候，该方法才会返回
并将所有结果传递results数组中
promise数组中任何一个promise为reject的话，则整个Promise.all调用会立即终止，并返回一个reject的新的promise对象

var p1 = Promise.resolve(1),
var p2 = Promise.resolve(2),
var p3 = Promise.resolve(3);
Promise.all([p1, p2, p3]).then(function (results) {
    console.log(results);  
});

8.generator

普通函数好比火车，不能停止
generator函数就是出租车，中途可以停止，使用yield和next执行

//普通函数
function show() {
    
    
    console.log('a')
    console.log('b')
}
show() 

//generator
function *show2() {
    
     //注意函数前添加*号
    console.log('1')
    yield
    console.log('2')
}
let genObj = show2()
genObj.next() // 1
genObj.next() // 2
genObj.next()

yield

既可传参，又可以返回
第一个next()传参无效，只用来启动

function * show() {
    
    
    console.log('1')
    var a = yield
    console.log('2')
    console.log(a)
}
// yield 传参
var gen = show()
gen.next() // 1
gen.next() // 2 和 undefined 因为没有传参，yield没有返回值
var gen = show()
gen.next(10) // 1 第一次执行到yield，但没有执行赋值
gen.next(20) // 2 和 20

function* show2() {
    
    
    console.log('1')
    yield 10
    console.log('2')
}
// yield 返回
var gen = show2()
var res1 = gen.next()
console.log(res1) // {
    
     value: 10, done: false }
var res2 = gen.next()
console.log(res2)
// {
    
     value: undefined, done: true } 最后的value需要return返回

9.面向对象

// 老版本
function User(name, pass) {
    
    
    this.name = name
    this.pass = pass
}

User.prototype.showName = function () {
    
    
    console.log(this.name)
}
User.prototype.showPass = function () {
    
    
    console.log(this.pass)
}

var u1 = new User('able', '1233')
u1.showName()
u1.showPass()
// 老版本继承
function VipUser(name, pass, level) {
    
    
    User.call(this, name, pass)
    this.level = level
}
VipUser.prototype = new User()
VipUser.prototype.constructor = VipUser
VipUser.prototype.showLevel = function () {
    
    
    console.log(this.level)
}

var v1 = new VipUser('blue', '1234', 3)
v1.showName()
v1.showLevel()
新版面向对象
有了 class 关键字、构造器
class 里面直接加方法
继承，super 超类==父类
class User {
    
    
    constructor(name, pass) {
    
    
        this.name = name
        this.pass = pass
    }

    showName() {
    
    
        console.log(this.name)
    }
    showPass() {
    
    
        console.log(this.pass)
    }
}

var u1 = new User('able2', '111')
u1.showName()
u1.showPass()

// 新版本继承
class VipUser extends User {
    
    
    constructor(name, pass, level) {
    
    
        super(name, pass)
        this.level = level
    }
    showLevel(){
    
    
        console.log(this.level)
    }
}

v1 = new VipUser('blue', '123', 3)
v1.showLevel()

前端es6知识点总结

ES6

新特性