ES6前端面试题及答案（贴近实战版）.docx

ES6前端面试题及答案（贴近实战版）

1.let/const和var有啥区别？实际开发里你更倾向用哪个？

答：核心区别在3点：

①作用域：var是函数级作用域，let/const是块级作用域（{}里定义的变量只在{}内有效）；

②变量提升：var会“提升”到函数顶部（哪怕没声明就用，只会undefined不会报错），let/const有“暂时性死区”（声明前用会直接报错）；

③重复声明：var允许重复声明（后面的会覆盖前面），let/const不允许；

另外const声明后不能改值（但如果是对象/数组，内部属性可以改，比如constobj={};obj.name=a是合法的）。

实际开发优先用const（只要变量不用改，比如存接口返回的固定数据、DOM元素），需要改的变量用let，基本不用var——避免作用域混乱和重复声明的坑。

举个例子：循环绑定点击事件，用var会导致所有按钮点了都拿最后一个值，用let就正常：

//不好的写法（var）

for(vari=0;i3;i++){

document.querySelectorAll(button)[i].onclick=()=alert(i);//点任何按钮都弹3

}

//好的写法（let）

for(leti=0;i3;i++){

document.querySelectorAll(button)[i].onclick=()=alert(i);//分别弹0、1、2

}

2.箭头函数和普通函数不一样的地方？哪些场景不能用箭头函数？

答：最关键的是this指向，其他还有3个区别：

①this绑定：箭头函数没有自己的this，它的this是“继承外层作用域的this”；普通函数的this看调用方式（谁调用就指向谁，比如obj.fn()指向obj，直接fn()指向window/undefined）；

②没有arguments：普通函数里能拿arguments（实参列表），箭头函数没有，要拿多参数得用剩余参数（...args）；

③不能当构造函数：箭头函数不能new（会报错），也没有prototype属性。

不能用箭头函数的场景：

对象方法：比如constobj={fn:()={console.log(this)}}，obj.fn()里的this会指向window（严格模式下是undefined），不是obj；

构造函数：没法new，自然不能用来创建实例；

需要arguments的场景：比如写一个求和函数，要拿所有实参，箭头函数得用...args替代。

3.Promise是干嘛的？它有哪些状态？then和catch怎么用？

答：主要用来解决“回调地狱”（比如多层ajax嵌套，代码越写越靠里），是ES6异步编程的核心方案。

Promise有3种状态：

pending：初始状态（刚创建时）；

fulfilled：成功状态（调用resolve()后）；

rejected：失败状态（调用reject()后）；

状态一旦变了就不能再改（比如从pending到fulfilled，就再也变不成rejected）。

then和catch的用法：

then：处理成功的结果，参数是resolve传的值；

catch：处理失败的错误，参数是reject传的值；

支持链式调用：then里返回新的Promise，就能继续跟then/catch，避免回调嵌套。

举个模拟接口请求的例子：

//模拟请求用户数据

functiongetUserData(){

returnnewPromise((resolve,reject)={

setTimeout(()={

constsuccess=true;//模拟成功/失败

if(success){

resolve({name:张三,age:20});//成功传数据

}else{

reject(newError(请求失败));//失败传错误

}

},1000);

});

}

//调用

getUserData()

.then(data={

console.log(用户数据：,data);//成功时执行

returndata.age;//返回值会作为下一个then的参数