In React lautet die Definition einer Funktion höherer Ordnung: Wenn der von einer bestimmten Funktion empfangene Parameter eine andere Funktion ist oder der Rückgabewert des Aufrufs immer noch eine Funktion ist, wird die angegebene Funktion als Funktion höherer Ordnung bezeichnet -Order-Funktionen Es gibt Promise, setTimeout, „arr.map()“ und so weiter.
Die Betriebsumgebung dieses Tutorials: Windows 10-System, Reaktionsversion 17.0.1, Dell G3-Computer.
Funktion höherer Ordnung: Wenn eine Funktion eine der folgenden beiden Spezifikationen erfüllt, handelt es sich bei der Funktion um eine Funktion höherer Ordnung.
1. Wenn der von Funktion A empfangene Parameter eine Funktion ist, kann A als Funktion höherer Ordnung bezeichnet werden.
2. Wenn der Rückgabewert der Funktion A immer noch eine Funktion ist, kann A als Funktion höherer Ordnung bezeichnet werden.
Zu den gängigen Funktionen höherer Ordnung gehören: Promise, setTimeout, arr.map() usw.
Beispiele sind wie folgt:
Die folgenden Fälle sind Funktionen höherer Ordnung
saveFormData = (event)=>{return ()=>{console.log('@');}}<form onSubmit={this.handleSubmit}>Username:<input onChange={this.saveFormData('username' ) } type="text" name="username"/>Passwort: <input onChange={this.saveFormData('password')} type="password" name="password"/><button>Anmelden</button> < /form>a. this.saveFormData('username') verwendet den Rückgabewert von saveFormData als Rückruf von onChange, nicht saveFormData als Rückruf.
b. Wenn Sie this.saveFormData('username') verwenden, muss die saveFormData-Zuweisungsfunktion etwas an onChange zurückgeben. Geben Sie den Rückgabewert (zurückgegebene Funktion) der saveFormData-Zuweisungsfunktion als Rückruf an.
c. Wir drucken also das „@“-Symbol in der Rückgabefunktion von saveFormData, dann wird der gedruckte Wert an onChange zurückgegeben und das @-Symbol wird während der Eingabe in das Eingabefeld gedruckt.
d. Der von saveFormData übergebene Datentyp ist tatsächlich Benutzername und Passwort.
e. Was wir bei der Eingabe aufrufen, ist die Rückgabefunktion, die mir beim Rückruf hilft.
saveFormData = (dataType)=>{// console.log(dataType);return (event)=>{// console.log('@');console.log(dataType,event.target.value);}}
f. Der Inhalt kann mit setState im Zustand gespeichert werden.
this.setState({[dataType]:event.target.value})