La relation entre le mode d'appel JavaScript et cette liaison de mot clé

Cet article présente principalement les informations pertinentes sur la relation entre le mode d'appel JavaScript et cette liaison de mot-clé. Les amis qui en ont besoin peuvent se référer à

Appel d'invocation

Appel. une fonction suspend l'exécution de la fonction actuelle et transmet le contrôle et les paramètres à la nouvelle fonction.

L'incohérence entre les paramètres réels et formels ne provoquera pas d'erreurs d'exécution. Plus sera ignoré et moins sera rempli comme indéfini

Chaque méthode recevra deux paramètres supplémentaires : this et arguments. La valeur de this dépend du mode d'appel, du mode d'appel : méthode, fonction, constructeur et appliquer le mode d'appel
L'affectation de this se produit au moment de l'appel. Différents modes d'appel peuvent être implémentés à l'aide de la méthode d'appel

var myObject = { 
value: 0, 
increment: function (inc) { 
this.value += typeof inc === 'number' ? inc : 1; 
} 
}; 
myObject.double = function(){ 
var helper = function(){ 
console.log(this);// this point to window 
} 
console.log(this);// this point to object myObject 
helper(); 
} 
myObject.double();//myObject Window

1 Le modèle d'appel de méthode Modèle d'appel de méthode

Méthodes : les fonctions sont enregistrées en tant que propriétés de l'objet. Lorsque la méthode est appelée, celle-ci est liée à l'objet.

Méthodes publiques : méthodes qui obtiennent le contexte de l'objet auquel elles appartiennent. à travers cela

myObject.increment(); 
document.writeln(myObject.value); //

Implémentation sous-jacente : myObject.increment。call(myObject，0);

2 La fonction de modèle d'invocation de fonction Modèle d'invocation

Lorsque la fonction n'est pas un attribut de l'objet, elle est appelée comme une fonction (un peu n'importe quoi...), cela est lié à l'objet global (fenêtre)

Il existe un nouveau mode strict dans ECMAScript5, dans ce mode, afin d'exposer les problèmes le plus tôt possible et de faciliter le débogage. ceci est forcément indéfini

var add = function (a,b) { return a + b;}; 
var sum = add（3，4）；// sum的值为7

L'implémentation sous-jacente : add.call（window，3，4）

strict mode：add.call（undefined，3，4）

La différence entre le mode d'appel de méthode et le mode d'appel de fonction

function hello(thing) { 
console.log(this + " says hello " + thing); 
} 
person = { name: "Brendan Eich" } 
person.hello = hello; 
person.hello("world") // [object Object] says hello world 等价于 person。hello。call（person，“world”） 
hello("world") // "[object DOMWindow]world" 等价于 hello。call（window，“world”）

3 Le modèle d'invocation du constructeur

JavaScript est un langage basé sur l'héritage prototypique et fournit un ensemble de syntaxes de construction d'objets pour les langages basés sur les classes.

cela pointe vers l'objet renvoyé par new

var Quo = function (string) { 
this.status = string; 
}; 
Quo.prototype.get_status = function ( ) { 
return this.status; 
}; 
var myQuo = new Quo("this is new quo"); //new容易漏写，有更优替换 
myQuo.get_status( );// this is new quo

4 Le modèle d'invocation Apply

apply et call sont des paramètres intégrés de JavaScript. Ils lient tous deux immédiatement la fonction. Le premier paramètre est un tableau, et le second doit être transmis un par un. apply est également implémenté. par la couche inférieure de l'appel

apply(this,arguments[]); 
call(this,arg1,arg2...); 
var person = { 
name: "James Smith", 
hello: function(thing,thing2) { 
console.log(this.name + " says hello " + thing + thing2); 
} 
} 
person.hello.call({ name: "Jim Smith" },"world","!"); // output: "Jim Smith says hello world!" 
var args = ["world","!"]; 
person.hello.apply({ name: "Jim Smith" },args); // output: "Jim Smith says hello world!"

En revanche, la fonction de liaison sépare la liaison de ceci à la fonction et l'appel de la fonction, afin que la fonction puisse être appelée dans un contexte spécifique. Surtout l'implémentation d'application de la liaison d'événement

Function.prototype.bind = function(ctx){ 
var fn = this; //fn是绑定的function 
return function(){ 
fn.apply(ctx, arguments); 
}; 
}; 
bind用于事件中 
function MyObject(element) { 
this.elm = element; 
element.addEventListener('click', this.onClick.bind(this), false); 
}; 
//this对象指向的是MyObject的实例 
MyObject.prototype.onClick = function(e) { 
var t=this; //do something with [t]... 
};

Recommandations associées :

Exemple détaillé de JavaScript appelant ActiveX pour faire fonctionner la base de données Oracle

Une brève discussion sur cet objet appelant de 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!