记一次前端面试

61 阅读2分钟

1.关于运算符的优先级

var a = 3, b = 4; 
var c = a+++b;
console.log(c)  // 7

上面这段代码输出为7,原因是++的优先级高于+,所以相当于(a++) + b。

2.逻辑与‘&&’ 和按位与 ‘&’

'&&'逻辑与应该不用多说了,是短路运算,前面为假即为假,前面为真的话后面为什么即为什么;

'&' 按位与其实就是把两个数值先转换为二进制数,然后相同位置的两个值都为1才为1,其他情况都是0,位数不足的,左边补0,如下图

下面举个例子 15&27

平时可能很少用到按位与,但其实可以用来判断奇偶

if (a & 1) {
	console.log('a是奇数')
}

3.优雅降级与渐进增强

参考简书的一篇文章

4.重绘和回流

参考掘金的一篇文章

5.js的事件循环

其实这道题就是考察js运行机制,很多的面试题中考察setTimeout和promise等的执行顺序就是在考察js的事件循环。由于js是单线程的,为了解决阻塞的问题,所以引入的同步和异步的概念。同步任务是在主线程排队执行的,异步任务是在另一条任务队列执行的。详细内容可以参考这篇文章

6.如何处理跨域问题

强烈推荐参考这篇文章

7.在一个ul标签上,创建一万个li,偶数行li设置一个背景色,每一个li里面有绑定事件,点击输出当前index

这个题要实现不难,主要是考虑性能,有以下几个需要注意的地方:
1.如果在for循环中一直appendChild(li),添加相同的li节点,后面的替换前面的;
2.然后点击事件使用事件委托,绑定在ul上

    var ul = document.getElementsByTagName("ul")[0];
    var arr = [];
    arr.push("<li>0");
    for (var i = 1; i < 999; i++) {
      arr.push(i)
    }
    arr.push("999</li>");
    var List = arr.join("</li><li>");
    ul.innerHTML = List;
    var li = ul.getElementsByTagName('li')
    for (var x = 0; x < li.length; x = x + 2) {
      li[x].style.backgroundColor = 'orange'
    }
    function handleClick(event) {
      var e = event || window.event;
      var target = e.target || e.srcElement;
      var text = target.innerText
      if (target.nodeName.toLowerCase() === "li") {
        console.log(text)
      }
    }
    ul.addEventListener("click", handleClick);