React에서 고차 함수의 정의는 지정된 함수가 받은 매개변수가 다른 함수이거나 호출의 반환 값이 여전히 함수인 경우 지정된 함수를 고차 함수라고 부릅니다. -order 함수 Promise, setTimeout, "arr.map()" 등이 있습니다.
이 튜토리얼의 운영 환경: Windows 10 시스템, 반응 버전 17.0.1, Dell G3 컴퓨터.
고차 함수: 함수가 다음 두 가지 사양 중 하나를 충족하면 해당 함수는 고차 함수입니다.
1. 함수 A가 받은 매개변수가 함수라면 A를 고차 함수라고 부를 수 있습니다.
2. 함수 A의 반환 값이 여전히 함수인 경우 A를 고차 함수라고 부를 수 있습니다.
일반적인 고차 함수에는 Promise, setTimeout, arr.map() 등이 포함됩니다.
예는 다음과 같습니다:
다음 경우는 고차 함수입니다.
saveFormData = (이벤트)=>{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> < /양식>a. this.saveFormData('username')은 saveFormData의 반환 값을 콜백으로 사용하지 않고 onChange의 콜백으로 사용합니다.
b. this.saveFormData('username')을 사용하는 경우 saveFormData 할당 함수는 onChange에 무언가를 반환해야 합니다. saveFormData 할당 함수의 반환 값(반환 함수)을 콜백으로 제공합니다.
c. 따라서 saveFormData의 반환 함수에 '@' 기호를 인쇄하면 인쇄된 값이 onChange로 반환되고 입력 상자에 입력하는 동안 @ 기호가 인쇄됩니다.
d. saveFormData가 전달한 데이터 유형은 실제로 사용자 이름과 비밀번호입니다.
e. 입력할 때 호출하는 것은 반환 함수여야 합니다. Return은 호출할 때 이벤트를 전달하는 데 도움이 됩니다. event.target.value를 통해 우리가 출력하는 값을 얻을 수 있습니다.
saveFormData = (dataType)=>{// console.log(dataType);return (event)=>{// console.log('@');console.log(dataType,event.target.value);}}f. 내용을 출력할 수 있습니다. setState를 사용하여 내용을 상태에 저장할 수 있습니다.
this.setState({[dataType]:event.target.value})