函数柯里化
概念
通过函数调用继续返回函数的方式,实现多次接收参数最后统一处理的函数编码形式。
代码示例
基础示例
function sum(a) {
return (b) => {
return (c) => {
return a + b + c;
};
};
}
React 应用示例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app"></div>
<script src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<script type="text/babel">
class Demo extends React.Component {
state = { username: "", password: "" }
saveFormData = dataType => {
return event => this.setState({
[dataType]: event.target.value
})
}
handleSubmit = event => {
event.preventDefault();
const { username, password } = this.state;
console.log("你输入的用户名是:" + username + ", 密码是:" + password);
}
render() {
return (
<form onSubmit={this.handleSubmit}>
用户名:<input type="text" name="username" onChange={this.saveFormData("username")}/>
密码:<input type="text" name="password" onChange={this.saveFormData("password")}/>
<button>提交</button>
</form>
)
}
}
ReactDOM.render(<Demo />, document.getElementById("app"))
</script>
</body>
</html>
