Heim Web-Frontend js-Tutorial Ausführliche Erklärung des Aufrufs in Javascript

Ausführliche Erklärung des Aufrufs in Javascript

Mar 14, 2018 pm 01:25 PM
javascript js

Dieses Mal bringe ich Ihnen eine detaillierte Erklärung zum Aufrufen von JavascriptWas sind die Vorsichtsmaßnahmen bei der Verwendung von Call-in-Javascript Schauen Sie einmal vorbei.

Zunächst müssen Sie verstehen, dass die Funktion selbst einige eigene

Attribute haben wird, wie zum Beispiel:

Länge: die Anzahl der formalen Parameter;

Name: Funktionsname;
Prototyp: Der Prototyp der Klasse. Die im Prototyp definierten Methoden sind alle öffentliche Methoden der aktuellen Instanz dieser Klasse.
Prototyp: Behandeln Sie die Funktion als gewöhnliches Objekt. Verweis auf den Prototyp der Funktionsklasse
Funktion ist das komplexeste und wichtigste Wissen im gesamten JavaScript. Für eine Funktion gibt es mehrere Rollen:

function Fn() {
    var num = 500;    this.x = 100;
}
Fn.prototype.getX = function () {
    console.log(this.x);
}
Fn.aaa = 1000;var f = new Fn;
f.num // undefinedf.aaa // undefined12345678910111213
var res = Fn(); // res是undefined Fn中的this是window
Nach dem Login kopieren
Rolle 1: Gewöhnliche Funktion Für Fn, es ist selbst eine gewöhnliche Funktion, die bei der Ausführung einen privaten Bereich bildet und nach Abschluss der Ausführung eine formale Parameterzuweisung, Voranalyse, Codeausführung und Speicherzerstörung durchführt.

Rolle 2: Klasse, die eine eigene Instanz hat, f Es ist eine Instanz von Fn als Klasse. Es gibt auch ein Attribut namens Prototyp, das sein eigener Prototyp ist.

Rolle drei: gewöhnliche Objekte , Fn und var obj = {} Obj in ist dasselbe, es ist ein gewöhnliches Objekt (alle Funktionen sind Instanzen von Function. Als Objekt kann es einige eigene private Eigenschaften haben, und Function.prototype kann auch gefunden werden). durch Proto;

oben für Funktionen Es gibt drei Rollen. Die meisten Schüler haben vielleicht keine Zweifel an Rolle eins und Rolle zwei, aber sie haben vielleicht ein wenig Zweifel an Rolle drei. Dann zeichnen Sie ein Bild, um es zu verstehen:

Funktioniert wie gewöhnliche Objekte .png

rufen Sie ausführlich auf

Aufrufs

grundlegende Verwendung

var ary = [12, 23, 34]; 
ary.slice();
Nach dem Login kopieren
Der Ausführungsprozess der beiden oben genannten Zeilen von Der einfache Code lautet: ary Diese Instanz durchläuft die Prototypenkette. Der Suchmechanismus findet die Slice-Methode in Array.prototype und führt die gefundene Slice-Methode aus. Während der Ausführung der Slice-Methode wird das Ary-Array abgefangen.


Hinweis: Bevor die Slice-Methode ausgeführt wird, findet ein Suchvorgang für den Prototyp statt (wenn er in der aktuellen Instanz nicht gefunden wird, wird er gemäß der Prototypenkette durchsucht).

Nachdem wir wissen, dass es einen Suchprozess zum Aufrufen einer Methode für ein Objekt geben wird, schauen wir uns Folgendes an:

var obj = {name:’iceman’}; 
function fn() { 
console.log(this); 
console.log(this.name); 
} 
fn(); // this –> window 
// obj.fn(); // Uncaught TypeError: obj.fn is not a function 
fn.call(obj);
Nach dem Login kopieren
Die Rolle der Aufrufmethode: Suchen Sie zuerst nach der Aufrufmethode. und schließlich in der Funktion durch die Prototypenkette Suchen Sie die Aufrufmethode im Prototyp und lassen Sie sie dann ausführen. Wenn Sie die Aufrufmethode ausführen, wird dies in der Fn-Methode zum ersten Parameterwert obj und führt schließlich die Fn-Funktion aus .


2.2. Prinzip der Aufrufmethode

Simulieren Sie die integrierte Aufrufmethode in Function, schreiben Sie eine myCall-Methode und erkunden Sie das Ausführungsprinzip der Aufrufmethode

function sum(){
    console.log(this);
}function fn(){
    console.log(this);
}var obj = {name:'iceman'};Function.prototype.myCall = function (context) {
    // myCall方法中的this就是当前我要操作和改变其this关键字的那个函数名
    // 1、让fn中的this关键字变为context的值->obj
    // 让this这个函数中的"this关键字"变为context
    // eval(this.toString().replace("this","obj"));
    // 2、让fn方法在执行
    // this();};1234567891011121314151617
Nach dem Login kopieren
fn. myCall(obj); // Die ursprüngliche this in myCall-Methode ist fn

sum.myCall(obj); // Die ursprüngliche this in myCall-Methode ist sum
Wenn fn.myCall(obj ); diese Codezeile wird ausgeführt. Wenn gemäß den Suchregeln dafür „.“ vor der myCall-Methode steht, dann ist dies in myCall fn. Um die myCall-Methode auszuführen, wird im ersten Schritt this im Methodenkörper durch das eingehende Objekt ersetzt und das ursprüngliche this ausgeführt. Hinweis: Das ursprüngliche this wird ausgeführt (ich habe das schon lange verstanden, als ich es war). Dies lernen). In diesem Artikel wird fn ausgeführt.

Sind Sie etwas verwirrt, nachdem Sie den obigen Absatz gelesen haben? Haha, es ist in Ordnung. Schauen wir uns zum Verständnis das folgende Beispiel an.

Klassisches Beispiel einer Aufrufmethode

function fn1() {
    console.log(1);
}function fn2() {
    console.log(2);
}123456
Nach dem Login kopieren
Ausgabe eins

fn1.call(fn2); // 1
Nach dem Login kopieren
Zuerst findet fn1 die Aufrufmethode auf Function.prototype über den Prototypketten-Suchmechanismus und lässt Die Aufrufmethode wird ausgeführt. Zu diesem Zeitpunkt ist dies in der Aufrufmethode der zu bedienende fn1. Lassen Sie während der Ausführung des Aufrufmethodencodes zunächst das Schlüsselwort „this“ in fn1 in fn2 ändern und dann die Methode fn1 ausführen.


Hinweis: Beim Ausführen der Aufrufmethode ändert sich dies in fn1 zwar in fn2, aber der im Methodenkörper von fn1 ausgegebene Inhalt enthält keinen damit verbundenen Inhalt, also immer noch Ausgabe 1.

Ausgabe 2

fn1.call.call(fn2); // 2
Nach dem Login kopieren
Zuerst findet fn1 die Aufrufmethode für Function.prototype über die Prototypkette und lässt dann die Aufrufmethode den Aufruf für den Funktionsprototyp über den Prototyp finden. (Da der Wert von call selbst auch eine Funktion ist, kann auch Function.prototype verwendet werden.) Wenn der Aufruf zum zweiten Mal gefunden wird, wird die Methode in fn1.call ausgeführt In dieser Methode wird fn2 und dann wird fn1.call ausgeführt.


Dieses Beispiel ist etwas kompliziert, aber lassen Sie es uns Schritt für Schritt verstehen. Ganz am Anfang ist das im letzten Aufruf der Codezeile fn1.call.call(fn2) fn1.call. Basierend auf dem vorherigen Verständnis können wir wissen, dass das Prinzip von fn1.call ungefähr ist:

Function.prototype.call = function (context) {
    // 改变fn中的this关键字
    // eval(....);
    // 让fn方法执行
    this(); // 此时的this就是fn1};1234567
Nach dem Login kopieren
Schreiben Sie den obigen Code in einer anderen Form:

Function.prototype.call = test1;function test1 (context) {
    // 改变fn中的this关键字
    // eval(....);
    // 让fn方法执行
    this(); // 此时的this就是fn1};12345678
Nach dem Login kopieren
Wir wissen, dass diese beiden Schreibweisen den gleichen Effekt haben. Dann können Sie fn1.call.call(fn2) zu diesem Zeitpunkt als test1.call(fn2) schreiben, und dieser In-Call ist test1:

Function.prototype.call = function (context) {
    // 改变fn中的this关键字
    // eval(....);
    // 让fn方法执行
    this(); // 此时的this就是test1};1234567
Nach dem Login kopieren
Hinweis: Dieser In-Call ist zu diesem Zeitpunkt test1.

Dann ersetzen Sie dies im Aufruf durch fn2, dann wird die test1-Methode zu:

Function.prototype.call = function (context) {
    // 省略其他代码
    fn2(); 
};12345
Nach dem Login kopieren

所以最后是fn2执行,所以最后输出2。

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

spring boot的定时任务应该如何使用

javaScript使用call和apply

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung des Aufrufs 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 KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Beste grafische Einstellungen
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

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)

So implementieren Sie ein Online-Spracherkennungssystem mit WebSocket und JavaScript So implementieren Sie ein Online-Spracherkennungssystem mit WebSocket und JavaScript Dec 17, 2023 pm 02:54 PM

So implementieren Sie mit WebSocket und JavaScript ein Online-Spracherkennungssystem. Einführung: Mit der kontinuierlichen Weiterentwicklung der Technologie ist die Spracherkennungstechnologie zu einem wichtigen Bestandteil des Bereichs der künstlichen Intelligenz geworden. Das auf WebSocket und JavaScript basierende Online-Spracherkennungssystem zeichnet sich durch geringe Latenz, Echtzeit und plattformübergreifende Eigenschaften aus und hat sich zu einer weit verbreiteten Lösung entwickelt. In diesem Artikel wird erläutert, wie Sie mit WebSocket und JavaScript ein Online-Spracherkennungssystem implementieren.

Wesentliche Tools für die Aktienanalyse: Lernen Sie die Schritte zum Zeichnen von Kerzendiagrammen mit PHP und JS Wesentliche Tools für die Aktienanalyse: Lernen Sie die Schritte zum Zeichnen von Kerzendiagrammen mit PHP und JS Dec 17, 2023 pm 06:55 PM

Wesentliche Tools für die Aktienanalyse: Lernen Sie die Schritte zum Zeichnen von Kerzendiagrammen in PHP und JS. Mit der rasanten Entwicklung des Internets und der Technologie ist der Aktienhandel für viele Anleger zu einer wichtigen Möglichkeit geworden. Die Aktienanalyse ist ein wichtiger Teil der Anlegerentscheidung, und Kerzendiagramme werden häufig in der technischen Analyse verwendet. Wenn Sie lernen, wie man Kerzendiagramme mit PHP und JS zeichnet, erhalten Anleger intuitivere Informationen, die ihnen helfen, bessere Entscheidungen zu treffen. Ein Candlestick-Chart ist ein technischer Chart, der Aktienkurse in Form von Candlesticks anzeigt. Es zeigt den Aktienkurs

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

Die Technologie zur Gesichtserkennung und -erkennung ist bereits eine relativ ausgereifte und weit verbreitete Technologie. Derzeit ist JS die am weitesten verbreitete Internetanwendungssprache. Die Implementierung der Gesichtserkennung und -erkennung im Web-Frontend hat im Vergleich zur Back-End-Gesichtserkennung Vor- und Nachteile. Zu den Vorteilen gehören die Reduzierung der Netzwerkinteraktion und die Echtzeiterkennung, was die Wartezeit des Benutzers erheblich verkürzt und das Benutzererlebnis verbessert. Die Nachteile sind: Es ist durch die Größe des Modells begrenzt und auch die Genauigkeit ist begrenzt. Wie implementiert man mit js die Gesichtserkennung im Web? Um die Gesichtserkennung im Web zu implementieren, müssen Sie mit verwandten Programmiersprachen und -technologien wie JavaScript, HTML, CSS, WebRTC usw. vertraut sein. Gleichzeitig müssen Sie auch relevante Technologien für Computer Vision und künstliche Intelligenz beherrschen. Dies ist aufgrund des Designs der Webseite erwähnenswert

WebSocket und JavaScript: Schlüsseltechnologien zur Implementierung von Echtzeitüberwachungssystemen WebSocket und JavaScript: Schlüsseltechnologien zur Implementierung von Echtzeitüberwachungssystemen Dec 17, 2023 pm 05:30 PM

WebSocket und JavaScript: Schlüsseltechnologien zur Realisierung von Echtzeit-Überwachungssystemen Einführung: Mit der rasanten Entwicklung der Internet-Technologie wurden Echtzeit-Überwachungssysteme in verschiedenen Bereichen weit verbreitet eingesetzt. Eine der Schlüsseltechnologien zur Erzielung einer Echtzeitüberwachung ist die Kombination von WebSocket und JavaScript. In diesem Artikel wird die Anwendung von WebSocket und JavaScript in Echtzeitüberwachungssystemen vorgestellt, Codebeispiele gegeben und deren Implementierungsprinzipien ausführlich erläutert. 1. WebSocket-Technologie

So implementieren Sie ein Online-Reservierungssystem mit WebSocket und JavaScript So implementieren Sie ein Online-Reservierungssystem mit WebSocket und JavaScript Dec 17, 2023 am 09:39 AM

So implementieren Sie ein Online-Reservierungssystem mit WebSocket und JavaScript. Im heutigen digitalen Zeitalter müssen immer mehr Unternehmen und Dienste Online-Reservierungsfunktionen bereitstellen. Es ist von entscheidender Bedeutung, ein effizientes Online-Reservierungssystem in Echtzeit zu implementieren. In diesem Artikel wird erläutert, wie Sie mit WebSocket und JavaScript ein Online-Reservierungssystem implementieren, und es werden spezifische Codebeispiele bereitgestellt. 1. Was ist WebSocket? WebSocket ist eine Vollduplex-Methode für eine einzelne TCP-Verbindung.

Verwendung von JavaScript und WebSocket zur Implementierung eines Echtzeit-Online-Bestellsystems Verwendung von JavaScript und WebSocket zur Implementierung eines Echtzeit-Online-Bestellsystems Dec 17, 2023 pm 12:09 PM

Einführung in die Verwendung von JavaScript und WebSocket zur Implementierung eines Online-Bestellsystems in Echtzeit: Mit der Popularität des Internets und dem Fortschritt der Technologie haben immer mehr Restaurants damit begonnen, Online-Bestelldienste anzubieten. Um ein Echtzeit-Online-Bestellsystem zu implementieren, können wir JavaScript und WebSocket-Technologie verwenden. WebSocket ist ein Vollduplex-Kommunikationsprotokoll, das auf dem TCP-Protokoll basiert und eine bidirektionale Kommunikation zwischen Client und Server in Echtzeit realisieren kann. Im Echtzeit-Online-Bestellsystem, wenn der Benutzer Gerichte auswählt und eine Bestellung aufgibt

PHP- und JS-Entwicklungstipps: Beherrschen Sie die Methode zum Zeichnen von Aktienkerzendiagrammen PHP- und JS-Entwicklungstipps: Beherrschen Sie die Methode zum Zeichnen von Aktienkerzendiagrammen Dec 18, 2023 pm 03:39 PM

Mit der rasanten Entwicklung der Internetfinanzierung sind Aktieninvestitionen für immer mehr Menschen zur Wahl geworden. Im Aktienhandel sind Kerzendiagramme eine häufig verwendete Methode der technischen Analyse. Sie können den sich ändernden Trend der Aktienkurse anzeigen und Anlegern helfen, genauere Entscheidungen zu treffen. In diesem Artikel werden die Entwicklungskompetenzen von PHP und JS vorgestellt, der Leser wird zum Verständnis des Zeichnens von Aktienkerzendiagrammen geführt und es werden spezifische Codebeispiele bereitgestellt. 1. Aktien-Kerzendiagramme verstehen Bevor wir uns mit dem Zeichnen von Aktien-Kerzendiagrammen befassen, müssen wir zunächst verstehen, was ein Kerzendiagramm ist. Candlestick-Charts wurden von den Japanern entwickelt

JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Wettervorhersagesystems JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Wettervorhersagesystems Dec 17, 2023 pm 05:13 PM

JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Wettervorhersagesystems Einführung: Heutzutage ist die Genauigkeit von Wettervorhersagen für das tägliche Leben und die Entscheidungsfindung von großer Bedeutung. Mit der Weiterentwicklung der Technologie können wir genauere und zuverlässigere Wettervorhersagen liefern, indem wir Wetterdaten in Echtzeit erhalten. In diesem Artikel erfahren Sie, wie Sie mit JavaScript und WebSocket-Technologie ein effizientes Echtzeit-Wettervorhersagesystem aufbauen. In diesem Artikel wird der Implementierungsprozess anhand spezifischer Codebeispiele demonstriert. Wir

See all articles