2.6 高阶函数_函数柯里化
高阶函数:如果一个函数符合下面2个规范中的任何一个,那该函数就是高阶函数
1. 若A函数,接受的参数是一个函数,那么A就可以成为高阶函数
2. 若A函数,调用的返回值依然是一个函数,那么A就可以称之为高阶函数
3. 常见的高阶函数:Promise、setTimeout、arr.map()
函数的柯里化:通过函数调用继续返回函数的方式,实现多次接收参数最后统一处理的函数编码形式。
// 保存表单数据到状态中
saveFormData = (dataType)=>{
console.log(dataType);
// 返回的是一个函数
return (event)=>{
this.setState({
// 统一处理 dataType event
[dataType] : event.target.value
})
console.log(dataType,event.target.value);
}
}
不用函数柯里化的实现
// 创建组件
class Login extends React.Component{
// 初始化状态
state = {
username : '',
password : ''
}
// 保存表单数据到状态中
saveFormData = (dataType, event)=>{
this.setState({
[dataType] : event.target.value
})
}
showInfo = (event)=>{
// 阻止表单的提交
event.preventDefault();
const {username, password} = this.state;
alert(`你输入的的用户名是${username},你输入的密码是${password} `)
}
render (){
return (
<form action="http://www.atguigu.com" onSubmit={this.showInfo}>
用户名:<input onChange={(event)=>{this.saveFormData('username', event)}} type="text" name="username" /> <br/>
密码:<input onChange={(event)=>{this.saveFormData('password', event)}} type="password" name="password" /> <br/>
<button>登录</button>
</form>
)
}
}