💥2020面试准备系列(一):JS

一、小试牛刀

经典面试题

typeof能判断哪些类型(考点：JS变量类型)？

答案：

object、string、number、undefined、object、boolean、function、symbol

何时使用=== 何时使用==(考点：强制类型转换)？

答案：

==会隐式的强制转换类型，所以除了==null之外，其他一律用===

window.onload和DOMContentLoaded的区别(考点：页面渲染过程)？

答案：

一、何时触发这两个事件？

1、当 onload 事件触发时，页面上所有的DOM，样式表，脚本，图片，flash都已经加载完成了。

2、当 DOMContentLoaded 事件触发时，仅当DOM加载完成，不包括样式表，图片，flash。

JS创建10个标签，点击的时候弹出对应的序号(考点：作用域)

答案：

for(let i=0;i<10;i++){
    var a=document.createElement('a');
    a.innerHTML=i+'<br>';
    document.body.appendChild(a);
    a.addEventListener('click',function(e){
                    e.preventDefault();  //取消默认事件，指a标签
                    alert(i);
    });
}

手写节流throttle、防抖debounce(考点：性能、体验优化)

答案：

//节流：当持续触发事件时，保证一定时间段内只调用一次事件处理函数。
//(诀窍：无定时、设定时、清定时：即当没有定时函数时，设置定时函数，并在定时函数中执行传参fn,并在其中清除定时器)
function throttle(fn,delay){
    let timer=null;
    return function(){
        var context=this;
        var args=arguments;
        if(!timer){
            timer=setTimeout(function(){
                fn.apply(context,args);
                timer=null;
            },delay)
        }
    }
}

//防抖：当持续触发事件时，一定时间段内没有再触发事件事件时，事件处理函数才会执行一次，如果设定的时间到来之前，又一次触发了事件，就重新开始延时。
//(诀窍：有定时、清定时、设定时)
function debounce(fn,wait){
    let timeout=null;
    return function(){
        if(timeout!==null) clearTimeout(timeout);
        timeout=setTimeout(fn,wait);
    }
}

先分享一部分，下次继续分享。