ES6面试、复习干货知识点汇总

2、升级部分:

ES6在Array原型上新增了find()方法，用于取代传统的只能用indexOf查找包含数组项目的方法,且修复了indexOf查找不到NaN的bug([NaN].indexOf(NaN) === -1).此外还新增了copyWithin(), includes(), fill(),flat()等方法，可方便的用于字符串的查找，补全,转换等。

七、问：举一些ES6对Number数字类型做的常用升级优化?

---

答：

1、优化部分：

ES6在Number原型上新增了isFinite(), isNaN()方法，用来取代传统的全局isFinite(), isNaN()方法检测数值是否有限、是否是NaN。ES5的isFinite(), isNaN()方法都会先将非数值类型的参数转化为Number类型再做判断，这其实是不合理的，最造成isNaN('NaN') === true的奇怪行为–'NaN’是一个字符串，但是isNaN却说这就是NaN。而Number.isFinite()和Number.isNaN()则不会有此类问题(Number.isNaN('NaN') === false)。（isFinite()同上）

2、升级部分:

ES6在Math对象上新增了Math.cbrt()，trunc()，hypot()等等较多的科学计数法运算方法，可以更加全面的进行立方根、求和立方根等等科学计算。

八、问：举一些ES6对Object类型做的常用升级优化?(重要)

---

答：

1、优化部分：

a. 对象属性变量式声明。ES6可以直接以变量形式声明对象属性或者方法，。比传统的键值对形式声明更加简洁，更加方便，语义更加清晰。

let [apple, orange] = [‘red appe’, ‘yellow orange’];

let myFruits = {apple, orange};    // let myFruits = {apple: ‘red appe’, orange: ‘yellow orange’};

尤其在对象解构赋值(见优化部分b.)或者模块输出变量时，这种写法的好处体现的最为明显:

let {keys, values, entries} = Object;

let MyOwnMethods = {keys, values, entries}; // let MyOwnMethods = {keys: keys, values: values, entries: entries}

可以看到属性变量式声明属性看起来更加简洁明了。方法也可以采用简洁写法：

let es5Fun = {

method: function(){}

};

let es6Fun = {

method(){}

}

b. 对象的解构赋值。ES6对象也可以像数组解构赋值那样，进行变量的解构赋值：

let {apple, orange} = {apple: ‘red appe’, orange: ‘yellow orange’};

c. 对象的扩展运算符(…)。ES6对象的扩展运算符和数组扩展运算符用法本质上差别不大，毕竟数组也就是特殊的对象。对象的扩展运算符一个最常用也最好用的用处就在于可以轻松的取出一个目标对象内部全部或者部分的可遍历属性，从而进行对象的合并和分解。

let {apple, orange, …otherFruits} = {apple: ‘red apple’, orange: ‘yellow orange’, grape: ‘purple grape’, peach: ‘sweet peach’};

// otherFruits  {grape: ‘purple grape’, peach: ‘sweet peach’}

// 注意: 对象的扩展运算符用在解构赋值时，扩展运算符只能用在最后一个参数(otherFruits后面不能再跟其他参数)

let moreFruits = {watermelon: ‘nice watermelon’};

let allFruits = {apple, orange, …otherFruits, …moreFruits};

d. super 关键字。ES6在Class类里新增了类似this的关键字super。同this总是指向当前函数所在的对象不同，super关键字总是指向当前函数所在对象的原型对象。

2、升级部分:

a. ES6在Object原型上新增了is()方法，做两个目标对象的相等比较，用来完善’=‘方法。’='方法中NaN === NaN //false 其实是不合理的，Object.is修复了这个小bug。(Object.is(NaN, NaN) // true)

b. ES6在Object原型上新增了assign()方法，用于对象新增属性或者多个对象合并。

const target = { a: 1 };

const source1 = { b: 2 };

const source2 = { c: 3 };

Object.assign(target, source1, source2);

target // {a:1, b:2, c:3}

注意: assign合并的对象target只能合并source1、source2中的自身属性，并不会合并source1、source2中的继承属性，也不会合并不可枚举的属性，且无法正确复制get和set属性（会直接执行get/set函数，取return的值）。

c. ES6在Object原型上新增了getOwnPropertyDescriptors()方法，此方法增强了ES5中getOwnPropertyDescriptor()方法，可以获取指定对象所有自身属性的描述对象。结合defineProperties()方法，可以完美复制对象，包括复制get和set属性。

d. ES6在Object原型上新增了getPrototypeOf()和setPrototypeOf()方法，用来获取或设置当前对象的prototype对象。这个方法存在的意义在于，ES5中获取设置prototype对像是通过__proto__属性来实现的，然而__proto__属性并不是ES规范中的明文规定的属性，只是浏览器各大产商“私自”加上去的属性，只不过因为适用范围广而被默认使用了，再非浏览器环境中并不一定就可以使用，所以为了稳妥起见，获取或设置当前对象的prototype对象时，都应该采用ES6新增的标准用法。

e. ES6在Object原型上还新增了Object.keys()，Object.values()，Object.entries()方法，用来获取对象的所有键、所有值和所有键值对数组。

九、问：举一些ES6对Function函数类型做的常用升级优化?(重要)

---

答：

1、优化部分：

a. 箭头函数**(核心)**。箭头函数是ES6核心的升级项之一，箭头函数里没有自己的this,这改变了以往JS函数中最让人难以理解的this运行机制。主要优化点:

Ⅰ.    箭头函数内的this指向的是函数定义时所在的对象，而不是函数执行时所在的对象。ES5函数里的this总是指向函数执行时所在的对象，这使得在很多情况下this的指向变得很难理解，尤其是非严格模式情况下，this有时候会指向全局对象，这甚至也可以归结为语言层面的bug之一。ES6的箭头函数优化了这一点，它的内部没有自己的this,这也就导致了this总是指向上一层的this，如果上一层还是箭头函数，则继续向上指，直到指向到有自己this的函数为止，并作为自己的this。

Ⅱ.    箭头函数不能用作构造函数，因为它没有自己的this，无法实例化。

Ⅲ.   也是因为箭头函数没有自己的this,所以箭头函数 内也不存在arguments对象。（可以用扩展运算符代替）

b. 函数默认赋值。ES6之前，函数的形参是无法给默认值得，只能在函数内部通过变通方法实现。ES6以更简洁更明确的方式进行函数默认赋值。

function es6Fuc (x, y = ‘default’) {

console.log(x, y);

}

es6Fuc(4) // 4, default

2、升级部分:

ES6新增了双冒号运算符，用来取代以往的bind，call,和apply。(浏览器暂不支持，Babel已经支持转码)

foo::bar;

// 等同于

bar.bind(foo);

foo::bar(…arguments);

// 等同于

bar.apply(foo, arguments);

复制代码

十、问：Symbol是什么，有什么作用？

---

答：Symbol是ES6引入的第七种原始数据类型（说法不准确，应该是第七种数据类型，Object不是原始数据类型之一，已更正），所有Symbol()生成的值都是独一无二的，可以从根本上解决对象属性太多导致属性名冲突覆盖的问题。对象中Symbol()属性不能被for…in遍历，但是也不是私有属性。

十一、问：Set是什么，有什么作用？

---

答：Set是ES6引入的一种类似Array的新的数据结构，Set实例的成员类似于数组item成员，区别是Set实例的成员都是唯一，不重复的。这个特性可以轻松地实现数组去重。

十二、问：Map是什么，有什么作用？

---

答：Map是ES6引入的一种类似Object的新的数据结构，Map可以理解为是Object的超集，打破了以传统键值对形式定义对象，对象的key不再局限于字符串，也可以是Object。可以更加全面的描述对象的属性。

十三、问：Proxy是什么，有什么作用？

---

答：Proxy是ES6新增的一个构造函数，可以理解为JS语言的一个代理，用来改变JS默认的一些语言行为，包括拦截默认的get/set等底层方法，使得JS的使用自由度更高，可以最大限度的满足开发者的需求。比如通过拦截对象的get/set方法，可以轻松地定制自己想要的key或者value。下面的例子可以看到，随便定义一个myOwnObj的key,都可以变成自己想要的函数。

function createMyOwnObj() {

//想把所有的key都变成函数，或者Promise,或者anything

return new Proxy({}, {

get(target, propKey, receiver) {

return new Promise((resolve, reject) => {

setTimeout(() => {

let randomBoolean = Math.random() > 0.5;

let Message;

if (randomBoolean) {

Message = 你的${propKey}运气不错，成功了;

resolve(Message);

} else {

Message = 你的${propKey}运气不行，失败了;

reject(Message);

}

}, 1000);

});

}

});

}

let myOwnObj = createMyOwnObj();

myOwnObj.hahaha.then(result => {

console.log(result) //你的hahaha运气不错，成功了

}).catch(error => {

console.log(error) //你的hahaha运气不行，失败了

})

myOwnObj.wuwuwu.then(result => {

console.log(result) //你的wuwuwu运气不错，成功了

}).catch(error => {

console.log(error) //你的wuwuwu运气不行，失败了

})

十四、问：Reflect是什么，有什么作用？

---

答：Reflect是ES6引入的一个新的对象，他的主要作用有两点，一是将原生的一些零散分布在Object、Function或者全局函数里的方法(如apply、delete、get、set等等)，统一整合到Reflect上，这样可以更加方便更加统一的管理一些原生API。其次就是因为Proxy可以改写默认的原生API，如果一旦原生API别改写可能就找不到了，所以Reflect也可以起到备份原生API的作用，使得即使原生API被改写了之后，也可以在被改写之后的API用上默认的API。

十五、问：Promise是什么，有什么作用？

---

答：Promise是ES6引入的一个新的对象，他的主要作用是用来解决JS异步机制里，回调机制产生的“回调地狱”。它并不是什么突破性的API，只是封装了异步回调形式，使得异步回调可以写的更加优雅，可读性更高，而且可以链式调用。

附录：15道ES6 Promise实战练习题

十六、问：Iterator是什么，有什么作用？(重要)

---

答：Iterator是ES6中一个很重要概念，它并不是对象，也不是任何一种数据类型。因为ES6新增了Set、Map类型，他们和Array、Object类型很像，Array、Object都是可以遍历的，但是Set、Map都不能用for循环遍历，解决这个问题有两种方案，一种是为Set、Map单独新增一个用来遍历的API，另一种是为Set、Map、Array、Object新增一个统一的遍历API，显然，第二种更好，ES6也就顺其自然的需要一种设计标准，来统一所有可遍历类型的遍历方式。Iterator正是这样一种标准。或者说是一种规范理念。

就好像JavaScript是ECMAScript标准的一种具体实现一样，Iterator标准的具体实现是Iterator遍历器。Iterator标准规定，所有部署了key值为[Symbol.iterator]，且[Symbol.iterator]的value是标准的Iterator接口函数(标准的Iterator接口函数: 该函数必须返回一个对象，且对象中包含next方法，且执行next()能返回包含value/done属性的Iterator对象)的对象，都称之为可遍历对象，next()后返回的Iterator对象也就是Iterator遍历器。

//obj就是可遍历的，因为它遵循了Iterator标准，且包含[Symbol.iterator]方法，方法函数也符合标准的Iterator接口规范。

//obj.Symbol.iterator 就是Iterator遍历器

let obj = {

data: [ ‘hello’, ‘world’ ],

Symbol.iterator {

const self = this;

let index = 0;

return {

next() {

if (index < self.data.length) {

return {

value: self.data[index++],

done: false

};

} else {

return { value: undefined, done: true };

}

}

};

}

};

ES6给Set、Map、Array、String都加上了[Symbol.iterator]方法，且[Symbol.iterator]方法函数也符合标准的Iterator接口规范，所以Set、Map、Array、String默认都是可以遍历的。

//Array

let array = [‘red’, ‘green’, ‘blue’];

arraySymbol.iterator //Iterator遍历器

arraySymbol.iterator.next() //{value: “red”, done: false}

//String

let string = ‘1122334455’;

stringSymbol.iterator //Iterator遍历器

stringSymbol.iterator.next() //{value: “1”, done: false}

//set

let set = new Set([‘red’, ‘green’, ‘blue’]);

setSymbol.iterator //Iterator遍历器

setSymbol.iterator.next() //{value: “red”, done: false}

//Map

let map = new Map();

let obj= {map: ‘map’};

map.set(obj, ‘mapValue’);

mapSymbol.iterator.next()  {value: Array(2), done: false}

十七、问：for…in 和for…of有什么区别？

---

答：如果看到问题十六，那么就很好回答。问题十六提到了ES6统一了遍历标准，制定了可遍历对象，那么用什么方法去遍历呢？答案就是用for…of。ES6规定，有所部署了载了Iterator接口的对象(可遍历对象)都可以通过for…of去遍历，而for…in仅仅可以遍历对象。

这也就意味着，数组也可以用for…of遍历，这极大地方便了数组的取值，且避免了很多程序用for…in去遍历数组的恶习。

上面提到的扩展运算符本质上也就是for…of循环的一种实现。

十八、Generator函数是什么，有什么作用？

---

答：如果说JavaScript是ECMAScript标准的一种具体实现、Iterator遍历器是Iterator的具体实现，那么Generator函数可以说是Iterator接口的具体实现方式。

执行Generator函数会返回一个遍历器对象，每一次Generator函数里面的yield都相当一次遍历器对象的next()方法，并且可以通过next(value)方法传入自定义的value,来改变Generator函数的行为。

最后

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！
，18年进入阿里一直到现在。**

深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

[外链图片转存中…(img-WpmtxGCq-1714856221741)]

[外链图片转存中…(img-M4XuU0jN-1714856221742)]

[外链图片转存中…(img-9BawgWo8-1714856221742)]

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！