What is double arrow function?

Question

What is "let x= something1 => something2 => something3" ?

I have this code and I'm failing to understand what does it do.

const myReducers = {person, hoursWorked};
const combineReducers = reducers => (state = {}, action) => {
  return Object.keys(reducers).reduce((nextState, key) => {
    nextState[key] = reducers[key](state[key], action);
    return nextState;
  }, {});
};

The full code incase you need:

//Redux-Style Reducer
const person = (state = {}, action) => {
  switch(action.type){
    case 'ADD_INFO':
      return Object.assign({}, state, action.payload)
    default:
      return state;
  }
}

const infoAction = {type: 'ADD_INFO', payload: {name: 'Brian', framework: 'Angular'}}
const anotherPersonInfo = person(undefined, infoAction);
console.log('***REDUX STYLE PERSON***: ', anotherPersonInfo);

//Add another reducer
const hoursWorked = (state = 0, action) => {
  switch(action.type){
    case 'ADD_HOUR':
      return state + 1;
    case 'SUBTRACT_HOUR':
      return state - 1;
    default:
      return state;
  }
}
//Combine Reducers Refresher

****HERE****
****HERE****
****HERE****

const myReducers = {person, hoursWorked};
const combineReducers = reducers => (state = {}, action) => {
  return Object.keys(reducers).reduce((nextState, key) => {
    nextState[key] = reducers[key](state[key], action);
    return nextState;
  }, {});
};


****
****


/*
This gets us most of the way there, but really want we want is for the value of firstState and secondState to accumulate
as actions are dispatched over time. Luckily, RxJS offers the perfect operator for this scenario., to be discussed in next lesson.
*/
const rootReducer = combineReducers(myReducers);
const firstState = rootReducer(undefined, {type: 'ADD_INFO', payload: {name: 'Brian'}});
const secondState = rootReducer({hoursWorked: 10, person: {name: 'Joe'}}, {type: 'ADD_HOUR'});
console.log('***FIRST STATE***:', firstState);
console.log('***SECOND STATE***:', secondState);

From: https://gist.github.com/btroncone/a6e4347326749f938510

It's just a bunch of functions passed as arguments. The top-level function, I assume, is at some point called with your map of reducers. — Dave Newton, Jul 23 '16 at 11:33
Can you send a link that explain this or explain better what do you mean? — Stav Alfi, Jul 23 '16 at 11:36
Explain what specifically? Arrow functions are explained in ES2015 docs/tutorials. `reduce` has normal function docs. Are you asking about the Redux part? — Dave Newton, Jul 23 '16 at 11:40
Does this answer your question? [What do multiple arrow functions mean in JavaScript?](https://stackoverflow.com/questions/32782922/what-do-multiple-arrow-functions-mean-in-javascript) — Michael Freidgeim, May 29 '21 at 11:59

score 14 · Accepted Answer · answered Jul 23 '16 at 11:43

14

let x= something1 => something2 => something3 is almost same as the following:

let x = function (something) {
  return function (something2) {
    return something3
  }
}

The only difference is, arrows have lexical binding of this, i.e. binding in compile time.

answered Jul 23 '16 at 11:43

Aakash Sigdel

9,060
5
33
38

does x = something3 in the end of the proccess? – Stav Alfi Jul 23 '16 at 11:45
2

No. `x` is now a function expression. if you call let abc = x(). Then abc will we equal to something3 – Aakash Sigdel Jul 23 '16 at 11:46
Okay I got it. Thanks for your answer mate! – Stav Alfi Jul 23 '16 at 11:50
1

Have a fun time with redux :) – Aakash Sigdel Jul 23 '16 at 11:51

Jörg W Mittag · Answer 2 · 2016-07-23T11:44:03.540

5

An arrow function is

someParameters => someExpression

So, what is

someParameters => someThing => someThingElse

???

Well, by simple stupid "pattern matching", it's an arrow function, whose body (someExpression) is

someThing => someThingElse

In other words, it's

someParameters => someOtherParameters => someExpression

There's nothing special about this. Functions are objects, they can be returned from functions, no matter if those functions are written using arrows or the function keyword.

The only thing you really need to know to read this properly is that the arrow is right-associative, IOW that

a => b => c === a => (b => c)

Note: An arrow function can also have a body consisting of statements as well as a single expression. I was specifically referring to the form the OP is confused about.

edited Jul 23 '16 at 11:44

answered Jul 23 '16 at 11:38

Jörg W Mittag

363,080
75
446
653

Thanks for your time and great answer but I choosed the other one becouse, for some reason it was more clear to me. thanks agian. – Stav Alfi Jul 23 '16 at 11:50
1

That's okay, my answer assumes that one already knows what an arrow function is, Aakash's explains it without arrow functions at all. – Jörg W Mittag Jul 23 '16 at 12:13

What is double arrow function?

2 Answers2

Linked

Related