javascript - Questions sur les méthodes d'écriture compatibles avec addEventListener et attachEvent, aidez-moi s'il vous plaît !

Question

La première façon d'écrire

<code>里面的if分支只会执行一次，返回的函数里面已经不包含浏览器判断了，所以相对于常规写法，已经很棒了</code>

<code>var addEvent = (function(){
    if(window.addEventListener){
        return function(elem, type, handler){
            elem.addEventListener(type, handler, false);
        };
    }else if(window.attachEvent){
        return function(elem, type, handler){
            elem.attachEvent('on' + type, handler)
        };
    }
})();</code>

La deuxième façon d'écrire

<code>在第一次进入if判断后，重写了addEvent函数，这样后续的addEvent也不包含分支判断语句了，感觉跟第一种写法并没有多大的区别，但是第二种写法被称为惰性载入函数，可是我并没有感觉他比第一种方式惰在哪里啊？相较来说，我更喜欢第一种方式，求解释</code>

<code>var addEvent = function(elem, type, handler){
    if(window.addEventListener){
        addEvent = function(elem, type, handler){
            elem.addEventListener(type, handler, false);
        };
    }else if(window.attachEvent){
        addEvent = function(elem, type, handler){
            elem.attachEvent('on' + type, handler);
        };
    }

    addEvent(elem, type, handler);
};</code>

C'est très clair, merci !

Samhanx

Answer 1

Faites attention à l'IIFE dans la première manière d'écrire, de sorte que lorsque le code est exécuté et que la fonction addEvent est attribuée, il sera clair si addEvent est une fonction renvoyée par if ou bien if.

Dans la deuxième façon d'écrire, addEvent est toujours la fonction la plus externe lors de l'exécution du code. Lorsque vous appelez réellement addEvent(), vous réaffectez la valeur en interne pour clarifier ce qu'est addEvent, puis vous vous appelez dans la fonction. de paresse.

Notez qu'il existe un processus de passage pour les paramètres intermédiaires, et s'il n'est pas appelé, la référence à la fonction externe sera toujours enregistrée sur addEvent. Après l'exécution de la fonction d'exécution immédiate de la première méthode d'écriture, la mémoire occupée par. la fonction anonyme sera Démarrer en attente de recyclage.

Answer 2

Je comprends que la deuxième méthode est appelée une fonction de chargement paresseux, qui est relative à la première méthode :
1) La première méthode, car c'est une IIFE, que addEvent soit appelé ou non Il a été confirmé que le navigateur prend en charge addEventListener ou attachEvent ; addEvent， 都已经确认了浏览器支持的是addEventListener ，还是attachEvent；
2) 第二种方法，则是在显式调用addEvent 2) La deuxième méthode consiste à appeler explicitement addEvent pour connaître l'état de prise en charge du navigateur. .

Answer 3

Dans la deuxième méthode, addEvent a été réaffecté après le premier appel, et il n'est pas nécessaire d'effectuer un jugement de branche lors du deuxième appel