Heim > Web-Frontend > js-Tutorial > Der Zeiger davon in JS und die Funktionen von call und apply

Der Zeiger davon in JS und die Funktionen von call und apply

青灯夜游
Freigeben: 2018-10-08 16:25:47
nach vorne
2033 Leute haben es durchsucht

Dieser Artikel teilt Ihnen den grundlegenden Inhalt von JS mit, dieser Zeiger und die damit verbundenen Wissenspunkte zum Aufrufen und Anwenden. Freunde, die interessiert sind, können ihn lernen und darauf verweisen.

In bestimmten praktischen Anwendungen kann der Sinn dieser Funktion nicht bei der Definition bestimmt werden, sondern bei der Ausführung der Funktion. Je nach Ausführungsumgebung kann sie grob in die folgenden drei Typen unterteilt werden:

1. Wenn eine Funktion als normale Funktion aufgerufen wird, zeigt dies auf das globale Objekt

2. Wenn eine Funktion als Methode eines Objekts aufgerufen wird, Dies zeigt auf das Objekt

3. Wenn die Funktion als Konstruktor aufgerufen wird, zeigt dies auf das neu erstellte Objekt

Beispiel 1:

window.name = 'myname';
function getName() {
  console.log(this.name);
}
getName(); //输出myname
Nach dem Login kopieren

Beispiel 2:

var boy = {
  name: 'Bob',
  getName: function() {
    console.log(this.name);
  }
}
boy.getName(); //输出Bob
Nach dem Login kopieren

Beispiel drei:

function Boy(name) {
  this.name = name;
}
var boy1 = new Boy('Bob');
console.log(boy1.name); //输出Bob
Nach dem Login kopieren

Für Beispiel drei gibt es einen weiteren Sonderfall, nämlich dass Das heißt, wenn der Konstruktor ein Objekt über „return“ zurückgibt. Zu diesem Zeitpunkt gibt das Endergebnis dieser Operation dieses Objekt zurück, nicht das neu erstellte Objekt, sodass dies in diesem Fall keinen Nutzen hat.

Beispiel 4:

function Boy(name) {
  this.name = name;
  return { //返回一个对象
    name: 'Jack'
  }
}
var boy1 = new Boy('Bob');
console.log(boy1.name); //输出Jack
Nach dem Login kopieren

Beispiel 5:

function Boy(name) {
  this.name = name;
  return 1; //返回非对象
}
var boy1 = new Boy('Bob');
console.log(boy1.name); //输出Bob
Nach dem Login kopieren

anrufen und bewerben Die Rolle von

apply akzeptiert zwei Parameter. Der erste Parameter gibt den Zeiger davon im Funktionskörper an. Der zweite Parameter ist ein Array oder Array-ähnliches, das zur Übergabe der aufgerufenen Funktion verwendet wird. Parameterliste.

Beispiel 1:

function getInfo() {
  console.log(this.name+' like '+arguments[0]+' and '+arguments[1]);
}
var boy1 = {
  name: 'Bob',
  age: 12
}
getInfo.apply(boy1,['sing','swimming']); //输出Bob like sing and swimming
Nach dem Login kopieren

call Die Anzahl der übergebenen Parameter ist nicht festgelegt. Wie bei apply wird auch der erste Parameter verwendet, um The anzugeben Punkt davon im Funktionskörper, beginnend mit dem zweiten Parameter, wird jeder Parameter der Reihe nach an die aufgerufene Funktion übergeben.

Beispiel 2:

function getInfo() {
  console.log(this.name+' like '+arguments[0]+' and '+arguments[1]);
}
var boy1 = {
  name: 'Bob',
  age: 12
}
getInfo.call(boy1,'sing','shopping'); //输出Bob like sing and shopping
Nach dem Login kopieren

Darüber hinaus implementieren die meisten fortgeschrittenen Browser auch die Bind-Methode. Der Unterschied zwischen dieser Methode und Call and Apply besteht darin, dass sich Bind nur ändert Die interne Funktion, auf die dies verweist, wird jedoch nicht sofort ausgeführt. Sie müssen sie explizit aufrufen.

Beispiel 3: Simulieren der Bindungsmethode des Browsers

Function.prototype.bind = function(obj){
  var self = this;
  return function(){
    return self.apply(obj,arguments);
  }
};
var obj = {
  name: 'Bob',
  age: 12
};
var func = function(){
  console.log(this.name+' like '+arguments[0]+' and '+arguments[1]);
}.bind(obj);
func('sing','shopping');
Nach dem Login kopieren

Das habe ich verloren

In einigen Fällen geht die Ausrichtung hiervon verloren. Zu diesem Zeitpunkt müssen wir „Call“, „Apply“ und „Bind“ verwenden, um die Ausrichtung hiervon zu ändern.

Beispiel 1: Wenn die Methode „getName“ als Eigenschaft des Objekts „boy“ aufgerufen wird, zeigt dies auf das Objekt „boy“. Wenn eine andere Variable auf die Methode „getName“ verweist, da es als normaler Funktionsaufruf verwendet wird, zeigt dies also auf das globale Objektfenster

var boy = {
  name: 'Bob',
  getName: function() {
    console.log(this.name);
  }
}
boy.getName(); //输出Bob
var getBoyName = boy.getName;
getBoyName(); //输出undefined
Nach dem Login kopieren

Beispiel 2: Auch wenn die Funktion innerhalb der Funktion definiert ist, zeigt dies auch, wenn sie als normales Objekt aufgerufen wird zum Fensterobjekt

var boy1 = {
  name: 'Bob',
  age: 12,
  getInfo: function() {
    console.log(this.name);
    function getAge() {
      console.log(this.age);
    }
    getAge();
  }
}
boy1.getInfo(); //Bob
        //undefined
Nach dem Login kopieren

Das Obige ist der Inhalt dieses Kapitels Alle Inhalte, bitte besuchen Sie JavaScript Video Tutorial für weitere verwandte Tutorials!

Das obige ist der detaillierte Inhalt vonDer Zeiger davon in JS und die Funktionen von call und apply. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:jb51.net
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage