Résumé des exemples de modèles d'appel de fonctions dans les didacticiels de base javascript

La fonction ne sera exécutée que lorsqu'elle sera appelée. L'opérateur d'appel est une paire de parenthèses suivant toute expression qui produit une valeur de fonction. Les parenthèses peuvent contenir zéro ou plusieurs expressions séparées par des virgules. Chaque expression produit une valeur de paramètre, et chaque valeur de paramètre se voit attribuer le nom de paramètre formel

défini lors de la déclaration de la fonction. JavaScript a un total de 4 modes d'appel : mode d'appel de fonction, mode d'appel de méthode, mode d'appel de constructeur. et Mode d'appel indirect

【1】Mode d'appel de fonction

Lorsqu'une fonction n'est pas une propriété d'un objet, elle est appelée en tant que fonction. Pour les appels de fonction ordinaires, la valeur de retour de la fonction est la valeur de l'expression appelante

function add(x,y){    
   return x+y;
}
var sum = add(3,4);
console.log(sum)//7

Lors de l'appel d'une fonction en mode appel de fonction, en mode non strict, celle-ci est liée à l'objet global ; en mode strict En mode, ceci n'est pas défini

function add(x,y){
    console.log(this);//window}    
add();

function add(x,y){    
'use strict';
    console.log(this);//undefined
}    
add();//window

Par conséquent, 'this' peut être utilisé pour déterminer si le mode actuel est strict

var strict = (function(){return !this;}());

réécriture

car Ceci dans la fonction du mode d'appel de fonction est lié à l'objet global, donc les propriétés globales seront écrasées

var a = 0;
function fn(){
    this.a = 1;
}
fn();
console.log(this,this.a,a);//window 1 1

【2】Mode d'appel de méthode

Lorsqu'un la fonction est enregistrée Lorsqu'il s'agit d'une propriété d'un objet, nous l'appelons une méthode. Lorsqu'une méthode est appelée, elle est liée à l'objet. Si l'expression appelante contient une action pour extraire des attributs, alors elle est appelée en tant que méthode

var o = {
    m: function(){
        console.log(1);
    }
};
o.m();//1

La méthode peut l'utiliser pour accéder à l'objet auquel elle appartient, afin d'obtenir la valeur de l'objet. ou modifiez l'objet. La liaison de ceci à l'objet se produit au moment de l'appel. Les méthodes qui peuvent obtenir le contexte des objets auxquels elles appartiennent grâce à cela sont appelées méthodes publiques

var o = {
    a: 1,
    m: function(){
        return this;
    },
    n: function(){
        this.a = 2;
    }
};
console.log(o.m().a);//1
o.n();
console.log(o.m().a);//2

Toute fonction appelée en tant que méthode transmettra en fait un paramètre réel implicite - ce paramètre réel est un objet , Le parent de l'appel de méthode est cet objet. De manière générale, les méthodes basées sur cet objet peuvent effectuer diverses opérations. La syntaxe de l'appel de méthode a clairement montré que la fonction fonctionnera sur la base d'un objet

rect.setSize(width,height);
setRectSize(rect,width,height);

Hypothèse Les deux lignes de code ci-dessus ont exactement la même fonction. Elles opèrent toutes les deux sur un objet hypothétique rect. Comme on peut le voir, la syntaxe d'appel de méthode dans la première ligne indique clairement que le porteur de l'exécution de cette fonction est l'objet rect, et toutes les opérations de la fonction seront basées sur cet objet

Contrairement aux variables, le mot-clé cela n'a pas de portée En raison de la restriction, une fonction imbriquée n'hérite pas de cela de la fonction qui l'appelle. Si une fonction imbriquée est appelée en tant que méthode, sa valeur this pointe vers l'objet qui l'a appelée. Si la fonction imbriquée est appelée en tant que fonction, sa valeur est soit un objet global (en mode non strict) soit indéfini (en mode strict)

var o = {
    m: function(){
         function n(){
             return this;
         }
         return n();
    }
}
console.log(o.m());//window

var o = {
    m: function(){
         function n(){
             'use strict';
             return this;
         }
         return n();
    }
}
console.log(o.m());//undefined

Si vous souhaitez accéder au cette valeur de cette fonction externe, vous devez enregistrer la valeur de this dans une variable. Cette variable et la fonction interne sont toutes deux dans la même portée. Généralement la variable self ou qui est utilisée pour sauvegarder ceci

var o = {
    m: function(){
        var self = this;
        console.log(this === o);//true
         function n(){
             console.log(this === o);//false
             console.log(self === o);//true
             return self;
         }
         return n();
    }
}
console.log(o.m() === o);//true

【3】Mode d'appel du constructeur

Si un appel de fonction ou de méthode est précédé du mot-clé new, il constitue un appel de constructeur

function fn(){    
   this.a = 1;
};
var obj = new fn();
console.log(obj.a);//1

Si l'appel du constructeur contient un ensemble de listes d'arguments entre parenthèses, ces expressions d'arguments sont d'abord évaluées puis transmises à la fonction

function fn(x){    
  this.a = x;
};
var obj = new fn(2);
console.log(obj.a);//2

Si le constructeur n'a pas de paramètres de formulaire , la syntaxe d'appel du constructeur JavaScript permet l'omission de la liste de paramètres et des parenthèses réelles. Tout appel de constructeur sans paramètres formels peut omettre les parenthèses

var o = new Object();//等价于
var o = new Object;

[Note] Bien que le constructeur ressemble à un appel de méthode, il utilisera toujours le nouvel objet comme contexte d'appel. C'est-à-dire que dans l'expression new o.m(), le contexte d'appel n'est pas o

var o = {
    m: function(){
        return this;
    }
}
var obj = new o.m();
console.log(obj,obj === o);//{} false
console.log(obj.constructor === o.m);//true

Les constructeurs n'utilisent généralement pas le mot-clé return. Ils initialisent généralement les nouveaux objets lorsque le corps de la fonction du constructeur. est exécuté, il est renvoyé explicitement. Dans ce cas, l'expression d'appel du constructeur est évaluée à la valeur de ce nouvel objet

function fn(){    
  this.a = 2;
}var test = new fn();
console.log(test);//{a:2}

Si le constructeur utilise une instruction return mais ne spécifie pas de valeur de retour, ou renvoie une valeur primitive, alors la valeur de retour sera ignoré et le nouvel objet sera utilisé comme résultat de l'appel

function fn(){
    this.a = 2;
    return;
}
var test = new fn();
console.log(test);//{a:2}

Si le constructeur utilise explicitement l'instruction return pour renvoyer un objet, alors la valeur de l'expression appelante sera cet objet

var obj = {a:1};
function fn(){
    this.a = 2;
    return obj;
}
var test = new fn();
console.log(test);//{a:1}

【4】Mode d'appel indirect

Les fonctions en JavaScript sont également des objets, et les objets fonction peuvent également contenir des méthodes. Les méthodes call() et apply() peuvent être utilisées pour appeler indirectement des fonctions

Les deux méthodes permettent de spécifier explicitement la valeur this requise pour l'appel, c'est-à-dire que n'importe quelle fonction peut être utilisée comme méthode de n'importe quelle méthode. objet Appelé, même si cette fonction n’est pas une méthode de cet objet. Les deux méthodes peuvent spécifier les paramètres réels de l'appel. La méthode call() utilise sa propre liste de paramètres réels comme paramètre réel de la fonction, et la méthode apply() nécessite que les paramètres soient transmis sous la forme d'un tableau

var obj = {};
function sum(x,y){
    return x+y;
}
console.log(sum.call(obj,1,2));//3
console.log(sum.apply(obj,[1,2]));//3

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!