ES6面试的自我总结
作者:互联网
1.var、let、const的区别
1.var 可以变量提升,const、let不存在变量提升。
(1)var 代码
console.log(a); // undefiend
var a = 100;
(2)let、const 代码
console.log(b); // Cannot access 'b' before initialization
const/let b = 100;
2.var 不存在暂时性死区,const、let存在暂时性死区,只有等声明的那一行代码出现,才可以获取该变量的值。例子同上。
3.var 不存在块级作用域,const、let存在块级作用域。
(1)
{
var a = 100;
}
console.log(a); // 100
(2)
{
let/const b = 100;
}
console.log(b); // b is not defined
4.var 可以重复生命,const、let不允许重复声明。
(1)
var a = 100;
var a = 10;
console.log(a); // 10
(2)
const/let b = 100;
const/let b = 1000;
console.log(b); // Identifier 'b' has already been declared
5.var 、let可以修改变量的值,const不能改变。
(1)
var/let a = 100;
a = 10;
console.log(a); // 10
(2)
const b = 100;
b = 1000;
console.log(b); // Uncaught TypeError: Assignment to constant variable
2. ES6中新增的Set、Map两种数据结构怎么理解?
1.共同点:集合、字典都可以存储不重复的值。
2.不同点:集合是以[值,值]的形式存储元素,字典是以[键,值]的形式存储。
3.Set只有值,元素不可重复且自动排序,Map是以键值对的方式存储。
4.例子
(4.1)
const objSetList =
[
{
id : 1,
name: "skam"
},
{
id : 2,
name: "skam2"
}
];
const objMapList =
[
['key', 'value'],
['任意类型', { id: 1, name: "skam" }]
];
const SetList = new Set(objSetList);
const MapList = new Map(objMapList);
console.log(SetList); // [[entries]] 下面的第0项 -> value: { id : 1, name : "skam" },
// 第1项 -> vlaue: { id : 2, name : "skam2" }
console.log(MapList); // [[entries]] 下面的第0项 -> { key : "key", value: "value" },
// 第1项 -> { key: "任意类型", value : { id : 1, name : "skam" } }
3.怎么理解ES6中 Promise的?使用场景有哪些?
1.是一种异步编程方式,用来解决回调地狱,优点(链式操作减低了编码难度、代码可读性明显增强)
2.三种状态(peeding、fulfilld、rejected)和种实例方法(then、catch、finally)
const Promise = function () {
new Promise((resolve, reject) => {
axios.get(url,...)
}).then(res => { // 当请求成功后,会把返回的数据当作参数(res), 然后打印输出。
console.log(res);
}).catch(err = > {
console.log(err); // 当请求失败后,会把请求失败的原因当作参数(err), 然后打印输出。
}).finally(() => {
console.log("不管状态如何,我都会执行") // 不管请求是否成功,都会打印这句话
})
}
Promise();
3.Promise.all() -> const p = Promise.all([p1, p2, p3]);
接受一个参数(数组),只有数组中所有都resolve都通过了, p.then()才会执行,只要有一个reject, 改错误就会执行单个错误请求的
reject, 不会触发Promise.all()的catch方法。
4.Promise.race() -> 同上
只要p1、p2、p3之中有一个实例率先改变状态,p的状态就跟着改变,率先改变的 Promise 实例的返回值则传递给p的回调函数。
5.使用场景?
(5.1)图片的加载。
(5.2)图片的请求超时
4.怎么理解ES6中 Generator的?使用场景有哪些?
1.是一种异步编程解决方案,执行Generator函数会返回一个遍历器对象,可以依次遍历 Generator 函数内部的每一个状态。
2.特征:
(2.1)function关键字与函数名之间有一个星号
(2.2)函数体内部使用yield表达式,定义不同的内部状态
(2.3)函数执行返回一个generater对象,函数体里面任何代码不会执行。
(2.4)每次执行next(),遇到yield就会终止,再次next直到遇到return为止,把return后语句返回,如果没有return,value为 undefnied。
(2.5)将异步任务同步化
3.使用
(3.1)
function* generater(b){
let a = 100;
console.log(a * 1);
yield console.log(a * 1);
yield console.log(a * 1);
return console.log(a * 4);
}
const y = generater()
console.log(y); // generater对象
console.log(y.next()); // 100 200 done: false
console.log(y.next()); // 300 done: false
console.log(y.next()); // 400 done: false
console.log(y.next()) // done: true 当done为true时,相当于改函数完整执行一次,后面多次next返回相同结果。
(3.2)
function* foo() {
yield 1;
yield 2;
yield 3;
yield 4;
yield 5;
return 6;
}
for (let v of foo()) {
console.log(v); // 1 2 3 4 5
}
4.使用场景
(4.1)Generator是异步解决的一种方案,最大特点则是将异步操作同步化表达出来
function* loadUI() {
showLoadingScreen();
yield loadUIDataAsynchronously();
hideLoadingScreen();
}
var loader = loadUI();
// 加载UI
loader.next()
// 卸载UI
loader.next() // 这列加载UI和卸载UI就相当于同步代码, 其实内部是异步请求的。
(4.2)利用Generator函数,在对象上实现Iterator接口
function* iterEntries(obj) {
let keys = Object.keys(obj);
for (let i=0; i < keys.length; i++) {
let key = keys[i];
yield [key, obj[key]];
}
}
let myObj = { foo: 3, bar: 7 };
for (let [key, value] of iterEntries(myObj)) {
console.log(key, value); // foo 3 // bar 7
}
标签:ES6,const,log,自我,yield,面试,let,var,console 来源: https://www.cnblogs.com/songkomei/p/16207586.html