前言

大家好哟，有没有吃青团呐？作者是豆沙党。另外作者面试系列的第三篇文章。

这篇比较基础，讨论的是es6的新语法。

那么我们开始吧！

let const的命令

//变量提升
console.log(a);  // undefined
console.log(b);  // 爆炸
console.log(c);  // 爆炸
var a = 1;
let b = 2;
const c = 3;

// 全局声明
console.log(window.a) //  1 

// 重复声明
let b  = 200;//爆炸

其实这里很容易理解，var是可以变量提升的。而let和const是必须声明后才能调用的。 对于let和const来说，这里就是暂缓性死区。

这里的知识点很好记，看如下表格就可以了。

null	变量提升	重复声明	全局声明
var	yes	yes	yes
let	no	no	no
const	no	no	no

例如作者自己对这个问题的解答如下：

1. let和const都不能变量提升的，如果在变量声明前调用会产生暂缓性死区，报错。
2. 它们声明后也不会绑在window（浏览器）和global（node）上，而var可以。
3. 它们不能重复声明，并且const为常量，不能修改值。

数组

数组的话，讲解几个在工作中常用的方法。

let array = [1,2,3,4,5];
//map
let mapResult = array.map(num => num + 1);
console.log(array); // [ 1, 2, 3, 4, 5 ]
console.log(mapResult);// [ 2, 3, 4, 5, 6 ]

//filter
let filterResult = array.filter(num => num === 4);
console.log(array); // [ 1, 2, 3, 4, 5 ]
console.log(filterResult); // [4]

// ...
let functionResult = (...array) => console.log(arguments); // 1,2,3,4,5

map: map函数是循环数组每个元素，增删查改后，怼到一个新数组内。

filter：filter函数也是循环数组的每个元素，后续代码为真的元素怼到一个新的数组内。

...: 这个很好理解，其实就拆分数组，把所有元素一个个传进去。

就如最常见的es6去重面试题：

let newArray = Array.from(...new Set(array))

例如作者自己对这个问题的解答如下：

只要把一些数组方法的使用方法，传入参数讲明即可。

另外你也可以手写实现几个方法，这里就不扩展啦。

Object的新增方法

Object.assign()

这个新增的方法作用是把对象的枚举元素都复制到第一个参数对象里。大家一般都用来做浅拷贝。

let a = {
        url: '996'
}
let b  = {
        name: '阿珍',
        url: a
}

let c = Object.assign({}, b)
a.url = a.url + '.icu'
console.log(c) // 996.icu

方法第一个参数是源对象，后面的参数都是用来取元素怼到第一个对象里的。

如代码，c的元素url还是指向了a.url的内存地址，我修改了a.url，它也改变了。

Object.keys() 、Object.values() 和 Object.entries()

这几个方法看名字就知道可以返回什么啦，其实在es6之前，想要获取这些元素的话都是需要自己手写forin再拿出来的，美妙的语法糖啊。

let a = {
        work: '996',
        sick: 'icu' 
}

console.log(Object.keys(a)); //[ 'work', 'sick' ]
console.log(Object.values(a)); // [ '996', 'icu' ]
console.log(Object.entries(a)); // [ '996', 'icu' ]

例如作者自己对这个问题的解答如下：

1. 说一下你觉得擅长的方法，介绍它们一般都可以用来干嘛，当然你也可以手写一波！
2. 最好引出assign方法，然后说一下你对浅拷贝和深拷贝的理解。

关于Object的常用新方法就介绍到这里了，详细的可以看阮老师的es6标准入门哟。

Class

es6新增的Class其实也是语法糖，js底层其实没有class的概念的，其实也是原型继承的封装。

class Fruit {
        constructor(props) {
                this.props = props;
                this.name = 'fruit';
        }
        callMyName() {
                console.log(this.name);
        }
}
class Apple extends Fruit { // extends 其实就是继承了哪个类
        constructor(props) {
                //  super相当于 把类的原型拿过来 
                //  Fruit.call(this, props)
                super(props)
        }
        callMyApple() {
                console.log('我是苹果！')
        }
}

let a = new Apple('啊啊啊')
a.callMyName(); //fruit
a.callMyApple(); // 我是苹果！

看了代码注释也很容易理解，就是一层对于原型继承的封装，不过class的写法毕竟容易查看代码和维护类。

例如作者自己对这个问题的解答如下：

1. 告诉面试大佬，class的一些用法，super，constructor等等。
2. 如果没有es6的class，你该怎么实现的。
3. 可以扩展一下 组合继承，寄生继承之类的。

---

好了这篇需要讲的东西已经结束了。

这是第三篇关于es6的一篇文章。

面试系列第一篇： 面试官：你知道Callback Hell（回调地狱）吗？

面试系列第二篇： 面试官：react和vue有什么区别吗？

如果您有收获或者疑问请在下方评论，求赞！谢谢观看到这里。