乐趣区

前端面试题甄选持续更新

2019.04.23 已知如下代码,如何修改才能让图片宽度为 300px?注意下面代码不可修改

<img src="1.jpg" style="width:480px!important;”>

解决方案:

  • css3的缩放:

    transform(scale(0.625, 0.625));
  • js:

    document.getElementsByTagName("img")[0].setAttribute("style","width:300px!important;")
  • css: max-width: 300px; (这个我当时没想到 …)
  • css: box-sizing: border-box; padding-left: 90px; padding-right: 90px; (这个我当时也没想到 …)

2019.03.22 Promise 构造函数是同步执行还是异步执行,那么 then 方法呢?

这个很明显,promise构造函数是 同步 执行的,then方法是 异步 执行的。
我从回答中选了个稍微复杂点的例子:

const promise = new Promise((resolve, reject) => {console.log(1);
  resolve(5);
  console.log(2);
}).then(val => {console.log(val);
});

promise.then(() => {console.log(3);
});

console.log(4);

setTimeout(function() {console.log(6);
});
// 执行结果: 124536

这里会牵涉一个 宏任务 (macrotask) 和微任务 (microtask) 的执行顺序问题,进而牵出 javascript事件循环(EventLoop)。

上干货:这一次,彻底弄懂 JavaScript 执行机制,阮一峰 JavaScript 运行机制详解:再谈 Event Loop
不想看的也可以直接看这里:

先执行一个宏任务(其实运行 js 的时候这个宏任务已经在运行),然后执行微任务,清空微任务队列,再执行宏任务,再执行微任务,清空微任务队列 …

常见的任务类型:

  • 微任务 microtask(jobs): promise / ajax / Object.observe(该方法已废弃)
  • 宏任务 macrotask(task): setTimout / script / IO / UI Rendering
退出移动版