assigning the returning function

Question

I'm new to javascript, and I saw code like this.

<button onclick="this.onClickDoSmth">Click me</button> 

onClickDoSmth = () => {
let a = this.clicked();
a();
}

clicked = () => {
console.log("test"); 
}

What's the difference of replacing the expression for "a" to

onClickDoSmth = () => {
this.clicked();
}

See “normal function vs arrow function” - many duplicates. Also search for “this in javascript”. — user2864740, May 30 '20 at 07:20

score 0 · Answer 1 · answered May 30 '20 at 06:44

First a correction is required. It should be let a = this.clicked; instead of let a = this.clicked(). The former means you're assigning the returning function to the variable a and executing it later with a(). So if you do this way, there's no difference.

onClickDoSmth = () => {
    let a = this.clicked; //This has to be corrected
    a();
    }

    clicked = () => {
    console.log("test"); 
    }

score 0 · Answer 2 · answered May 30 '20 at 15:24

The difference is that the former version received something from the function while the latter one doesn't.

This means the value of a receive what this.clicked function return. this.clicked must return a function so that it can be called by a() afterward

onClickDoSmth = () => {
    let a = this.clicked();
    a();
}

This means onClickDoSmth is a function. After it has been executed, run this.clicked

onClickDoSmth = () => {
   this.clicked();
}

score -1 · Answer 3 · answered May 30 '20 at 06:43

-1

The former uses assigns a function and calls that variable if you want to reuse again. The latter just calls the function immediately. Both will achieve the same output.

answered May 30 '20 at 06:43

Andrew Halpern

514
3
6

assigning the returning function

3 Answers3