Les différences et principes d'appel, d'application et de liaison en js et l'application avancée des extensions

Avant-propos

Au cours du processus d'entretien, de nombreuses nouvelles questions apparaîtront pour vous permettre d'approfondir de nouvelles connaissances, et vous découvrirez également des points que vous avez négligés dans vos études.

Lors d'une interview il y a deux jours, l'intervieweur a posé des questions sur la différence entre appeler, postuler et lier. En fait, nous devons également comprendre ce que l'intervieweur veut demander davantage, c'est-à-dire ce qui est développé.

---

call

call est une méthode qui peut être appelée par toutes les fonctions. C'est la méthode de Function.prototype

fonction

<.>
1. Appelez la fonction

2. pour changer cela, passez le paramètre comme premier paramètre

3. , et tous les paramètres après le deuxième paramètre

Case

function fn1(){
    console.log(1);
}
function fn2(){
    console.log(2);
}
fn1.call(fn2); //输出 1
fn1.call.call(fn2); //输出 2

Parse  : La première ligne de sortie, appelée
et pointée fn1 vers this fn2La deuxième ligne de sortie, en fait, l'exécution de
est la clé. Cela implique le mécanisme de call() Il traite simplement le segment de code avant Function.prototype.call() comme une variable et transfère le passé. segment de code Pointe vers .call(), puis fn1.call pointe vers this, donc il est relatif à fn2, sauf que le fn2.call() passé ici est thiswindow

en utilisant

• La méthode héritée

    function Father(uname,age){
        this.uname= uname;
        this.age=age;
    }
    Father.prototype={
        constructor:Father,
        sing:function(){
            console.log("唱跳rap");
        }
    }
    function Son(){
        Father.call(this,uname,age)
    }
    Son.prototype=new Father();

apply

apply est aussi une méthode qui peut être appelée par toutes les fonctions. >

dans Function.prototype Fonction

Fonction d'appel
Changer ceci
Pass paramètres, après le deuxième paramètre La différence entre tous les paramètres du tableau
et l'appel

le deuxième paramètre de apply est Array, tandis que l'appel transmet les paramètres sous forme de nombres

Utiliser

Utiliser la fonction Math pour obtenir la valeur maximale

•   let arr=Array.of(2,42,56,89,1,24,56,22)
    let max=Math.max.apply(Math,arr)
    console.log(max);

bind

bind est également une méthode qui peut être appelé par toutes les fonctions , c'est la fonction de la méthode

dans Function.prototype

de changer cela
pour passer les paramètres, après le deuxième paramètre Tous les paramètres numériques
Renvoyer une nouvelle fonction
La différence entre appeler et appliquer

La plus grande différence par rapport aux deux premières C'est-à-dire que la fonction ne sera pas appelée et la nouvelle fonction

sera renvoyée après modification. En utilisant le cas ci-dessus de

let btns=document.querySelectorAll("button")
for(let btn of btns){
    btn.onclick=function(){
        this.disabled=true;
        setTimeout(function(){
            this.disabled=false;
        }.bind(this),2000);
    }
}

, le sera modifié et la fonction ne sera pas appelée. Mais en fait, si vous utilisez la fonction flèche pour l'écrire, ce sera beaucoup plus simple car le

de la fonction flèche est lié au contexte

Ce cas est destiné à nous aider à comprendre l'utilisation de this. , alors attachez-le ci-dessous Comment écrire des fonctions fléchéesthis

let btns=document.querySelectorAll("button")
for(let btn of btns){
    btn.onclick=function(){
        this.disabled=true;
        setTimeout(()=>{
            this.disabled=false;
        },2000);
    }
}

thisTutoriel recommandé : "bindTutoriel JS"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!