Javascript function confused syntax

Question

I am a little bit confused with the code below. It's obviously a two arrow function written in es6 code but I do not understand exactly some parts.

1. The 2nd parameter named done is an empty function that does nothing? Or it is executed with a simple return as the result from the second arrow anonymous function?

2. the XXXX.load is a promise function that returns some results. How the caller of the Index can get the results of the 2nd parameter done ie done(null, result) ?

3. What is the equivalent code in es5?

const Index = (name, done = () => {}) => (dispatch, getState) => {
 
 return XXXX.load()
 .then((result) => {
 dispatch({type:OK});
 done(null, result);
 })
 .catch((error) => {
 dispatch({type:ERROR});
 done(error);
 });
};

Answer 1

Let's go one by one:

1. Index (name, done = () => {}) defines a default value for done in case none is provided when Index is called. This helps down to road to not do any checks in case done is null/undefined. You could also write it like this

const Index = (name, done) => (dispatch, getState) => {
 if (!done) {
 done = () => {}
 }
 }

2. The caller will just pass a function as the second argument when calling Index.

A general note: Index actually returns a function that will expect a dispatch and/or a getState param.

Answer 2

The 2nd parameter named done is an empty function that does nothing?

It's a parameter. It takes whatever value you give it.

The default value, which is assigned if the caller doesn't pass a second argument, is a function that does nothing. This lets it be called without throwing an undefined is not a function error or having an explicit test to see if it is a function or not.

How the caller of the Index can get the results of the 2nd parameter done ie done(null, result) ?

By passing its own function as the second argument.

What is the equivalent code in es5?

var Index = function(name, done) {
 if (!done) done = function() {};
 return function(dispatch, getState) {
 return XXXX.load()
 .then(function(result) {
 dispatch({
 type: OK
 });
 done(null, result);
 })
 .catch(function(error) {
 dispatch({
 type: ERROR
 });
 done(error);
 });
 }
};

Answer 3

1. The empty function is a default value for done. Default values prevents runtime crashes.

2 and 3 can be understood by seeing below code: (simply run it and see the consoles.

const DEFAULT_FUNCTION_VALUE = ()=> {};
const XXXX = {
 load: function() {
 return new Promise(function(resolve, reject) {
 setTimeout(function() {
 resolve({data: 'from XXXX.load'});
 },2000);
 });
 }
}
const Index = function(name='', done=DEFAULT_FUNCTION_VALUE) {
 return function(dispatch, getState) {
 return XXXX.load().then(function(result) {
 console.log({result});
 done(result);
 }).catch(function(error) {
 console.log(error);
 });
 }
}
function doneImplementation(data) {
 console.log('Data from done- ', data);
}
Index('', doneImplementation)();