面试官：你了解es6的知识吗？

前言

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

这篇比较基础，讨论的是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有什么区别吗？

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