Почему эта функция handleBlur с параметрами события, когда параметр события не используется внутри функции?

Question

Не могли бы вы помочь мне понять, почему эта функция ниже имеет параметр события, когда он не используется внутри функции?

handleBlur = field => event => {
 this.setState({
     touched: { ...this.state.touched, [field]: true }
 })
}

Почему эта функция ниже не работает, когда я пытался?

handleBlur(field) {
    this.setState({
        touched: { ...this.state.touched, [field]: true }
    })
}

Эта функция используется, как показано ниже:

<FormGroup row>
                                <Label htmlFor='firstname' md={2}>First Name</Label>
                                <Col md={10}>
                                    <Input type='text' id='firstname' name='firstname'
                                        placeholder='First Name'
                                        value={this.state.firstname}
                                        valid={errorMessages.firstname === ''}
                                        invalid={errorMessages.firstname !== ''}
                                        onChange={this.handleInputChange}
                                        onBlur={this.handleBlur('firstname')}
                                    />
                                    <FormFeedback>{errorMessages.firstname}</FormFeedback>
                                </Col>
                            </FormGroup>

Answer 1

handleBlur = field => event => {
 this.setState({
     touched: { ...this.state.touched, [field]: true }
 })
}

Это функция с двойной стрелкой, в этом случае функция handleBlur передает поле значения и возвращает функцию с событием в качестве входных данных, примерно так:

    function handleBlur(field) {
     return function(event) {
        //do something
     }
    }

Вы можете найти здесь очень хорошее объяснение, используя ваш собственный пример:

Что означают несколько стрелочных функций в javascript?

Я не знаю, почему этот код не использует событие, но оно есть.