您好,登錄后才能下訂單哦!
本文小編為大家詳細(xì)介紹“react高階函數(shù)的概念是什么”,內(nèi)容詳細(xì),步驟清晰,細(xì)節(jié)處理妥當(dāng),希望這篇“react高階函數(shù)的概念是什么”文章能幫助大家解決疑惑,下面跟著小編的思路慢慢深入,一起來學(xué)習(xí)新知識吧。
在react中,高階函數(shù)的定義是若一個指定的函數(shù)接收的參數(shù)是另一個函數(shù)或者調(diào)用的返回值依然是一個函數(shù),那么這個指定的函數(shù)就被稱為高階函數(shù);常見的高階函數(shù)有Promise、setTimeout、“arr.map()”等等。
本教程操作環(huán)境:Windows10系統(tǒng)、react17.0.1版、Dell G3電腦。
高階函數(shù):如果一個函數(shù)符合下面2個規(guī)范中的任何一個,那該函數(shù)就是高階函數(shù)。
1.若A函數(shù),接收的參數(shù)是一個函數(shù),那么A就可以稱之為高階函數(shù)。
2.若A函數(shù),調(diào)用的返回值依然是一個函數(shù),那么A就可以稱之為高階函數(shù)。
常見的高階函數(shù)有:Promise、setTimeout、arr.map()等等
示例如下:
以下案例就是高階函數(shù)
saveFormData = (event)=>{ return ()=>{ console.log('@'); } }
<form onSubmit={this.handleSubmit}> 用戶名:<input onChange={this.saveFormData('username')} type="text" name="username"/> 密碼:<input onChange={this.saveFormData('password')} type="password" name="password"/> <button>登錄</button> </form>
a、this.saveFormData(‘username’) 將saveFormData返回值作為onChange的回調(diào),不是將saveFormData作為回調(diào)
b、如果使用 this.saveFormData('username') 那么saveFormData賦值函數(shù)必須返回東西給onChange 把saveFormData賦值函數(shù)返回值(返回的函數(shù))交給onChange作為回調(diào)
c、所以我們在saveFormData的return函數(shù)里打印一下‘@’符號,那么就會把這個打印的值返回給onChange,在input框邊輸入邊打印@符號
d、saveFormData傳的dataType其實就是username和password
e、我們在輸入的時候調(diào)用的肯定是return函數(shù) return才是真正的回調(diào), react幫我回調(diào)的時候把event傳進(jìn)去了 通過event.target.value可以取到我們輸出的值
saveFormData = (dataType)=>{ // console.log(dataType); return (event)=>{ // console.log('@'); console.log(dataType,event.target.value); } }
f、可以輸出內(nèi)容 我們可以用setState存到state里面去
this.setState({[dataType]:event.target.value})
讀到這里,這篇“react高階函數(shù)的概念是什么”文章已經(jīng)介紹完畢,想要掌握這篇文章的知識點還需要大家自己動手實踐使用過才能領(lǐng)會,如果想了解更多相關(guān)內(nèi)容的文章,歡迎關(guān)注億速云行業(yè)資訊頻道。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。