Closure + Arrow function = extremely short

▼ If you don't know about Closure, I've already written about it

😇 "Javascript Closure" I think you can get what it is finally after reading this

Kaziu ・ May 18 '22

#javascript #beginners #frontend #programming

There is this closure function

function addCountFactory(num) {
    function addCount(value) {
        return num + value;
    }
    return addCount;
}

const addOne = addCountFactory(1);
const result = addOne(10);
console.log(result); // 11

If I change it to arrow function, it would be like this

1

const addCountFactory = num => { // ⭐ here
    function addCount(value) {
        return num + value;
    }
    return addCount;
}

2

remove unnecessary return

const addCountFactory = num => {
    return function addCount(value) { // ⭐ here
        return num + value;
    }
    // ⭐ delete "return addCount"
}

3

name of function is not necessary

const addCountFactory = num => {
    return function(value) { // ⭐ here
        return num + value;
    }
}

4

just delete { } block

const addCountFactory = num => function(value) {
        return num + value;
}

5

change to arrow function

const addCountFactory = num => value => num + value;

When you see it at first time, you would react like "wtf???", but actually it's just closure. Function in function