Heim Web-Frontend js-Tutorial Ausführliche Erläuterung von Anwendungsbeispielen zweier nicht geerbter Methoden in JavaScript

Ausführliche Erläuterung von Anwendungsbeispielen zweier nicht geerbter Methoden in JavaScript

Jul 20, 2017 pm 02:52 PM
javascript js 用法

1. Jede Funktion enthält zwei nicht geerbte Methoden: apply() und call().

2. Sie haben den gleichen Zweck, sie rufen alle Funktionen in einem bestimmten Bereich auf.

3. Die empfangenen Parameter sind unterschiedlich. apply() empfängt zwei Parameter, einen ist der Bereich, in dem die Funktion ausgeführt wird (dies), und der andere ist das Parameterarray.

Der erste Parameter der call()-Methode ist derselbe wie der apply()-Methode, die an die Funktion übergebenen Parameter müssen jedoch aufgelistet werden. Beispiel 1:

window.firstName = "diz"; 
window.lastName = "song"; 
var myObject = { firstName: "my", lastName: "Object" }; 
function HelloName() { 
  console.log("Hello " + this.firstName + " " + this.lastName, " glad to meet you!"); 
} 
HelloName.call(window); //huo .call(this); 
HelloName.call(myObject);
Nach dem Login kopieren

Das laufende Ergebnis ist:

Hello diz song glad to meet you! 
Hello my Object glad to meet you!
Nach dem Login kopieren

Beispiel 2:

function sum(num1, num2) { 
return num1 + num2; 
} 
console.log(sum.call(window, 10, 10)); //20 
console.log(sum.apply(window,[10,20])); //30
Nach dem Login kopieren

Analyse: In Beispiel 1, Wir haben festgestellt, dass der eigentliche Nutzen von apply() und call() darin besteht, den Umfang zu erweitern, in dem die Funktion ausgeführt wird. Wenn wir dazu die traditionelle Methode verwenden möchten, sehen Sie sich bitte den folgenden Code an:

window.firstName = "diz"; 
window.lastName = "song"; 
var myObject = { firstName: "my", lastName: "Object" }; 
function HelloName() { 
console.log("Hello " + this.firstName + " " + this.lastName, " glad to meet you!"); 
} 
HelloName(); //Hello diz song glad to meet you! 
myObject.HelloName = HelloName; 
myObject.HelloName(); //Hello my Object glad to meet you!
Nach dem Login kopieren

Siehe Im roten Code haben wir festgestellt, dass wir die HelloName-Eigenschaft von myObject dynamisch erstellen müssen, um den Gültigkeitsbereich der Funktion „HelloName()“ auf das Objekt „myObject“ festzulegen. Diese Eigenschaft dient als Zeiger auf „HelloName(“. )-Funktion. Wenn wir auf diese Weise myObject.HelloName () aufrufen, zeigt die Variable this innerhalb der Funktion auf myObject und andere interne öffentliche Eigenschaften des Objekts können aufgerufen werden.
Durch die Analyse von Beispiel 2 können wir die tatsächliche Anwendung der Funktionen call() und apply() erkennen. In tatsächlichen Projekten müssen sie entsprechend den tatsächlichen Bedingungen flexibel gehandhabt werden!
Eine kleine Frage: Schauen Sie sich diese Variable noch einmal an, wenn Sie die Funktion in der Funktion definieren

function temp1() { 
console.log(this); //Object {} 
function temp2() { 
console.log(this); //Window 
} 
temp2(); 
} 
var Obj = {}; 
temp1.call(Obj); //运行结果见上面的注释!!!!
Nach dem Login kopieren

Das Ausführungsergebnis ist das gleiche wie das Folgende:

function temp1() { 
console.log(this); 
temp2(); 
} 
function temp2() { 
console.log(this); 
} 
var Obj = {}; 
temp1.call(Obj);
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung von Anwendungsbeispielen zweier nicht geerbter Methoden in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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

Heiße Artikel -Tags

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Empfohlen: Ausgezeichnetes JS-Open-Source-Projekt zur Gesichtserkennung und -erkennung Empfohlen: Ausgezeichnetes JS-Open-Source-Projekt zur Gesichtserkennung und -erkennung Apr 03, 2024 am 11:55 AM

Empfohlen: Ausgezeichnetes JS-Open-Source-Projekt zur Gesichtserkennung und -erkennung

Analysieren Sie die Verwendung und Klassifizierung von JSP-Kommentaren Analysieren Sie die Verwendung und Klassifizierung von JSP-Kommentaren Feb 01, 2024 am 08:01 AM

Analysieren Sie die Verwendung und Klassifizierung von JSP-Kommentaren

So verwenden Sie die Exit-Funktion in der C-Sprache richtig So verwenden Sie die Exit-Funktion in der C-Sprache richtig Feb 18, 2024 pm 03:40 PM

So verwenden Sie die Exit-Funktion in der C-Sprache richtig

Verwendung der WPSdatedif-Funktion Verwendung der WPSdatedif-Funktion Feb 20, 2024 pm 10:27 PM

Verwendung der WPSdatedif-Funktion

Einfaches JavaScript-Tutorial: So erhalten Sie den HTTP-Statuscode Einfaches JavaScript-Tutorial: So erhalten Sie den HTTP-Statuscode Jan 05, 2024 pm 06:08 PM

Einfaches JavaScript-Tutorial: So erhalten Sie den HTTP-Statuscode

So verwenden Sie Apple-Verknüpfungen So verwenden Sie Apple-Verknüpfungen Feb 18, 2024 pm 05:22 PM

So verwenden Sie Apple-Verknüpfungen

Ausführliche Erklärung und Einführung in die Verwendung der MySQL-ISNULL-Funktion Ausführliche Erklärung und Einführung in die Verwendung der MySQL-ISNULL-Funktion Mar 01, 2024 pm 05:24 PM

Ausführliche Erklärung und Einführung in die Verwendung der MySQL-ISNULL-Funktion

Verwendung des Schlüsselworts „distinct' beim Parsen von SQL Verwendung des Schlüsselworts „distinct' beim Parsen von SQL Feb 18, 2024 pm 09:21 PM

Verwendung des Schlüsselworts „distinct' beim Parsen von SQL

See all articles