一句话回答的前端面试题

该篇文章为一句话的答案，想看更详细的面试题请看这篇>《前端面试题》

原型链：

实例与原型的链条，原型是prototype，链是__proto__，每个函数有一个原型对象，函数在创建时有一个默认属性 prototype，这个属性指向函数的原型对象。

继承：

ES6 使用extends关键字对Class类继承，其余还有：构造函数、原型链、构造+原型链、原型式、寄生式、原型+寄生。

事件队列：

分为微任务、宏任务，微任务一般比宏任务先执行，并且微任务队列只有一个。

宏任务：setTimeout、setInterval...... 

微任务：Promise、nextTick.......

事件循环

JS分为同步和异步任务。同步任务在主线程上执行，一旦执行栈中的所有同步任务执行完毕，系统就会读取任务队列，将可运行的异步任务添加到可执行栈中，开始执行。

防抖和节流

为了阻止操作高频触发，从而浪费性能。防抖执行最后一次，节流执行第一次。

防抖：搜索联想、窗口调整；节流：鼠标连点、滚动加载。

闭包

闭包就是函数内嵌套函数，使函数外可以读取到函数内部的变量，未释放前变量会一直占用内存。用途：模块化、防抖、节流、封装函数延迟执行。

Promise

Promise对象代表一个异步操作，异步操作的结果决定状态，当状态从pending变为fulfilled或从pending变为rejected，状态就不会再改变，称为 resolved。

async/await

async ：申明方法是异步的；await：等待异步方法执行完成；返回值是 Promise 对象。

 process.nextTick() 和setImmediate() 

被设置的回调函数都是在下一次 Tick 时被调用，process.nextTick()优先级>setImmediate()

箭头函数和普通函数的区别

箭头函数更简洁，没有自己的this，this指向定义时所在作用域的this，且不会改变。
不可以当作构造函数，不可以使用new命令，不可以使用arguments，不可以使用yield命令。

变量提升

在js中，变量和函数的声明会被提升到最顶部执行，函数内部如果用var声明了相同名称的外部变量，函数将不再向上寻找。

his指向

this总是指向函数的直接调用者，如果有new关键字，this指向new出来的对象；在事件中，this指向触发这个事件的对象。

数组去重的方法？

ES6的Set、Array.filter() + indexOf() 、 Array.includes()

Promise 面试题 以下代码的执行结果是？

const promise = new Promise((resolve, reject) => {
        console.log(1)
        resolve()
        console.log(2)
})
promise.then(() => {
        console.log(3)
})
console.log(4)

答案：选中👉1,2,4,3

解释：以上考察的是关于promise的原理，promise的构造函数是同步执行的，当new Promise的一瞬间，1,2 就立刻被执行，而 .then方法是异步执行的，当执行完1和2之后，会执行输出4，最后执行输出3

数组扁平化使用场景

快速获取/过滤嵌套数组中的某个值

数组求和 

const arrSum = (arr) => {
    const temp = arr.reduce((pre, now) => {
        return pre+now
    },0)
    return temp
}

求数组的最大值/最小值？

Math.max();
Math.min();

解构赋值 

let a = 1; let b = 2;  如果在不声明第三个变量的前提下，使a=2, b=1？

答案：选中👉[a, b] = [b, a]

为什么要使用组件？

方便维护、方便复用、提高开发效率

在组件的设计中，需要考虑什么？

可扩展性强、功能单一、便于复用，适用程度高

前端性能优化：

大致分为两部分：1、资源优化，通过打包配置优化资源，合理使用异步加载模块。2、代码优化，减少代码冗余，使用性能更好的API，减少重绘回流。

虚拟dom为什么会快？

虚拟 dom 相当于在 js 和真实 dom 中间加了一个缓存，利用 dom diff 算法计算出差异，只更新差异点，从而提高性能。

loader 和 plugin的区别？说几个Webpack常用 loader 和 plugin：

loader处理语法、plugin帮助资源文件打包优化

babel-loader、vue-loader、 file-loader、url-loader、eslint-loader、cache-loader、css-loader......

uglify-webpack-plugin（压缩js）、optimize-css-assets-webpack-plugin（压缩css）、html-webpack-plugin、webpack-bundle-analyzer（打包文件体积可视化）......