Inhaltsverzeichnis
1. Was ist eine Pfeilfunktion?
2. Die Abkürzung der Pfeilfunktion
3. Grundlagen von Pfeilfunktionen
4. 箭头函数不适用的场景
5. 剩余参数
5.1) 什么是剩余参数 ?
5.2) 作用
Als Konstruktor
Heim Web-Frontend js-Tutorial Was Sie über JavaScript-Pfeilfunktionen und Restparameter wissen müssen

Was Sie über JavaScript-Pfeilfunktionen und Restparameter wissen müssen

Dec 21, 2021 pm 06:35 PM
javascript

Dieser Artikel vermittelt Ihnen relevantes Wissen über Pfeilfunktionen und verbleibende Parameter in JavaScript. Ich hoffe, dass er für alle hilfreich ist.

Was Sie über JavaScript-Pfeilfunktionen und Restparameter wissen müssen

1. Was ist eine Pfeilfunktion?

Die Syntax des Pfeilfunktionsausdrucks ist präziser als der Funktionsausdruck, bei dem es sich um eine vereinfachte Form der Funktion handelt.
Seine Schreibmethode:

() => {};   // 可以用来写一个匿名函数
Nach dem Login kopieren

Seine Struktur:

const / let 函数名 参数 => 函数体
Nach dem Login kopieren

Zum Beispiel gibt es einen allgemeinen Funktionsausdruck

let add = function(x, y) {
	return x + y;};
Nach dem Login kopieren

, der mit der Pfeilfunktion geschrieben werden kann:

let add = (x, y) => {
	return x + y;};
Nach dem Login kopieren

2. Die Abkürzung der Pfeilfunktion

  • Einzelner Parameter
// 对于单个参数,我们可以省略外面的圆括号let addOne = x => {
	return x + 1;}
Nach dem Login kopieren
  • Einzeiliger Funktionskörper
// 对于单行返回函数体,可以同时省略 {} 和  returnlet add (x, y) => x + y;
Nach dem Login kopieren
  • Einzeiliges Objekt
// 对于返回单行对象,在外面加个 ()let add (x, y) => ({
	value: x + y;});
Nach dem Login kopieren

3. Grundlagen von Pfeilfunktionen

Die Pfeilfunktion hat dies nicht, sie sucht entsprechend in der äußeren Ebene zur Bereichskette.
Zum Beispiel:

var A = 1;let fun = {
    A: 2,
    printA: () => {
        console.log(this.A);
    },
    printAA: function() {
        let print = () => {
            console.log(this.A);
        }
        print();
    }};fun.printA();  // 1fun.printAA();  // 2
Nach dem Login kopieren

Rufen Sie printA auf, was this.A ausgibt. Da die Pfeilfunktion kein this hat, sucht sie danach in der äußeren Schicht Die äußere Schicht macht Spaß. Hier wird fun.printA() im globalen Bereich aufgerufen, sodass das äußere this auf window verweist, da vorher A = 1 definiert ist mit var, also ist die Ausgabe 1. printA,里面是输出 this.A,由于箭头函数没有 this,所以在外层寻找,外层是 fun。在这里,fun.printA()是在全局作用域中调用的,所以外层的 this 指向的是 window,由于之前用 var 定义了一个 A = 1,所以输出的是 1。

调用 printAA,在里面调用了 print(),输出 this.A,看 print 这个函数,是个箭头函数,他没有 this,所以找外层,它的外层是 printAA,它是由 fun 调用的,所以它的 this 指向 fun,所以输出 fun 中定义的 A,也就是 2。


4. 箭头函数不适用的场景

  1. 作为构造函数

实例化构造函数之后,它的 this 指向实例化的对像,而箭头函数没有 this,所以它不能用来做构造函数。

  1. 需要 this 指向调用对象的时候

  2. 需要使用 arguments 的时候

箭头函数中没有 arguments,可以使用剩余参数来存参数。


5. 剩余参数

5.1) 什么是剩余参数 ?

举个例子:

let add = (x, y, z, ...args) => {
	console.log(x, y, z, args);};
Nach dem Login kopieren

args 就是剩余参数。
剩余参数是个数组,它即使没有值,也是以一个空数组形式存在。
比如:

let add = (x, y, z, ...args) => {
    console.log(x, y, z, args);}add(1, 2, 3);
Nach dem Login kopieren

Was Sie über JavaScript-Pfeilfunktionen und Restparameter wissen müssen
x, y, z 对应参数 1, 2, 3,由于剩余参数没有值,所以空数组形式存在。

5.2) 作用

由于箭头函数没有 arguments,所以我们可以使用剩余参数替代 arguments
Rufen Sie printAA auf, rufen Sie print() auf und geben Sie this.A aus. Siehe die Funktion print. ist eine Pfeilfunktion. Sie verfügt nicht über this, also suchen Sie nach der äußeren Ebene printAA, die von fun aufgerufen wird , also zeigt this auf fun, sodass das in fun definierte A ausgegeben wird, das 2 ist.

Was Sie über JavaScript-Pfeilfunktionen und Restparameter wissen müssen4. Szenarien, in denen Pfeilfunktionen nicht anwendbar sind

    Als Konstruktor

    Nach der Instanziierung des Konstruktors zeigt dies auf das instanziierte Objekt, die Pfeilfunktion verfügt jedoch nicht über diese Funktion Kann nicht als Konstruktor verwendet werden.
    Wenn Sie dies benötigen, um auf das aufrufende Objekt zu verweisen
    Wenn Sie Argumente verwenden müssen

    Die Pfeilfunktion enthält keine Argumente, Sie können sie verwenden die restlichen Parameter zum Speichern von Parametern.

    5. Restparameter🎜🎜5.1) Was sind Restparameter? 🎜🎜Zum Beispiel: 🎜
    const print = (...args) => {
        console.log(args);};print(1, 2);
    Nach dem Login kopieren
    🎜args sind die restlichen Parameter. 🎜 Der verbleibende Parameter ist ein Array. Auch wenn er keinen Wert hat, liegt er in Form eines leeren Arrays vor. 🎜 Zum Beispiel: 🎜
    let add = (...args) => {};
    Nach dem Login kopieren
    🎜Bildbeschreibung hier einfügen🎜 x , y, z entsprechen den Parametern 1, 2 und 3. Da die übrigen Parameter keine Werte haben, liegen sie in Form leerer Arrays vor. 5.2) Funktion 🎜🎜🎜5.3 ) Hinweise🎜🎜🎜In Pfeilfunktionen können die Klammern nicht weggelassen werden, auch wenn nur noch ein Parameter übrig ist.🎜🎜rrreee🎜🎜Der verbleibende Parameter kann nur der letzte Parameter sein und es dürfen keine weiteren Parameter danach folgen andernfalls wird ein Fehler gemeldet🎜🎜🎜【 Verwandte Empfehlungen: 🎜Javascript-Lerntutorial🎜🎜】🎜🎜

    Das obige ist der detaillierte Inhalt vonWas Sie über JavaScript-Pfeilfunktionen und Restparameter wissen müssen. 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)
    1 Monate vor By 尊渡假赌尊渡假赌尊渡假赌
    R.E.P.O. Beste grafische Einstellungen
    1 Monate vor By 尊渡假赌尊渡假赌尊渡假赌
    R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können
    1 Monate vor By 尊渡假赌尊渡假赌尊渡假赌
    R.E.P.O. Chat -Befehle und wie man sie benutzt
    1 Monate 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.

    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

    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

    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.

    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

    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

    JavaScript-Tutorial: So erhalten Sie HTTP-Statuscode. Es sind spezifische Codebeispiele erforderlich. Vorwort: Bei der Webentwicklung ist häufig die Dateninteraktion mit dem Server erforderlich. Bei der Kommunikation mit dem Server müssen wir häufig den zurückgegebenen HTTP-Statuscode abrufen, um festzustellen, ob der Vorgang erfolgreich ist, und die entsprechende Verarbeitung basierend auf verschiedenen Statuscodes durchführen. In diesem Artikel erfahren Sie, wie Sie mit JavaScript HTTP-Statuscodes abrufen und einige praktische Codebeispiele bereitstellen. Verwenden von XMLHttpRequest

    So verwenden Sie insertBefore in Javascript So verwenden Sie insertBefore in Javascript Nov 24, 2023 am 11:56 AM

    Verwendung: In JavaScript wird die Methode insertBefore() verwendet, um einen neuen Knoten in den DOM-Baum einzufügen. Diese Methode erfordert zwei Parameter: den neuen Knoten, der eingefügt werden soll, und den Referenzknoten (d. h. den Knoten, an dem der neue Knoten eingefügt wird).

    JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Bildverarbeitungssystems JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Bildverarbeitungssystems Dec 17, 2023 am 08:41 AM

    JavaScript ist eine in der Webentwicklung weit verbreitete Programmiersprache, während WebSocket ein Netzwerkprotokoll für die Echtzeitkommunikation ist. Durch die Kombination der leistungsstarken Funktionen beider können wir ein effizientes Echtzeit-Bildverarbeitungssystem erstellen. In diesem Artikel wird erläutert, wie dieses System mithilfe von JavaScript und WebSocket implementiert wird, und es werden spezifische Codebeispiele bereitgestellt. Zunächst müssen wir die Anforderungen und Ziele des Echtzeit-Bildverarbeitungssystems klären. Angenommen, wir haben ein Kameragerät, das Bilddaten in Echtzeit sammeln kann

    See all articles