大厂前端面试题汇总

一 、头条

1. cdn有哪些优化静态资源加载速度的机制
2. 请说出以下题目的打印结果并说明原因：

async function async1(){    
    console.log('async1 start')
    await async2()
    console.log('async1 end')
}
async function async2(){
    console.log('async2')
}
console.log('script start')
setTimeout(function(){
    console.log('setTimeout')
},0)
async1();
new Promise(function(resolve){
    console.log('promise1')
    resolve();
}).then(function(){
    console.log('promise2')
})
console.log('script end1')
new Promise(function(resolve){
    resolve();
    console.log('promise3')
}).then(function(){
    console.log('promise4')
})
console.log('script end2')

https://lvdingjin.github.io/tech/2018/05/27/async-and-await.html

3. 请给出识别Email的正则表达式：

https://deerchao.cn/tutorials/regex/regex.htm

https://www.cnblogs.com/g0ne150/p/3898247.html

4. 设计AutoComplete(又叫搜索组件、自动补全组件等)时，需要考虑什么问题？
5. JS实现一个带并发限制的异步调度器Scheduler，保证同时运行的任务最多有两个。完善代码中Scheduler类，使得以下程序能正确输出。

class Scheduler {
  add(promiseCreator) { ... }  // ...}const timeout = (time) => new Promise(resolve => {
  setTimeout(resolve, time)
})const scheduler = new Scheduler()const addTask = (time, order) => {
  scheduler.add(() => timeout(time))
    .then(() => console.log(order))
}
​
addTask(1000, '1')
addTask(500, '2')
addTask(300, '3')
addTask(400, '4')// output: 2 3 1 4// 一开始，1、2两个任务进入队列// 500ms时，2完成，输出2，任务3进队// 800ms时，3完成，输出3，任务4进队// 1000ms时，1完成，输出1// 1200ms时，4完成，输出4

https://juejin.im/post/5d37e392f265da1ba252a226

6. semantic versioning 是一个前端通用的版本，要求实现compare(a,b)，比较a，b两个版本大小

7. 实现函数接受任意二叉树，求二叉树所有根到叶子路径组成数字之和。

8. 如何从严格模式设置到怪异模式？

9. 请将如下代码拍平为[1,2,3,4,5,6,7]?

var arr = [1,2,[3,[4,5,[6,7]]]]

10. vue的双向数据绑定的原理，或者说为什么method中的变量能够和data中的变量通讯。

11. es6的新语法功能

    箭头函数的作用
    

12. promise 为什么能.then

13. pop和shift分别有什么作用

14. 3== true 和 3 === true 分别打印出的是什么

var a = { x : 1 }
var b = a;
a.x = a = { n : 1 }
console.log(a)
console.log(b)

16

  Function.prototype.a = () => alert(1)
  Object.prototype.b = () => alert(2)
  function A() {
   const a = new A();
   a.a();
   a.b();

17. 请写出执行顺序

let a = 0
console.log(a)
console.log(b)
let b = 0 
console.log(c)

var x = 10 ; 
function a(y){
  var x = 20 ;
  return b (y);
}
function b(y){
  return x+y
}
a(20)

19. 请写出以下代码的执行结果

console.log(1)
setTimeOut(() => {
console.log(2)
});
process.nextTrick(() => {
  console.log(3)
})
setImmediate(() => {
  console.log(4)
})
new Promise(resolve =>{
  console.log(5)
  resolve();
  console.log(6)
}).then(() =>{
  console.log(7)
})
Promise.resolve().then(() =>{
  console.log(8)
  process.nextTick(() =>{
  console.log(9)
  })
})

20.JavaScript是单线程，为什么会有异步？
21.防抖和节流
22. 有哪些跨域方法，对比优缺点
23. ES7异步神器async-await
24. vue中的for循环为什么要有key
25. 写一个左侧固定宽度，右侧自适应的样式
26. 比较computed和methods的区别
27. vue中nextTrick的使用场景
28. 箭头函数的this指向问题