This question already has answers here:
ECMAScript 6 arrow function that returns an object
(6 answers)
Closed 6 years ago.
According to the documentation, you can return an expression from an arrow function:
(param1, param2, …, paramN) => expression
// equivalent to: => { return expression; }
but this doesn't seem to work as I would expect (nodejs 4.2.3)
> [1,2,3].map(i => i);
[ 1, 2, 3 ]
> [1,2,3].map(i => {});
[ undefined, undefined, undefined ]
Shouldn't the 2nd example return 3 empty objects? Or am I missing something?
According to the docs, the body of fat arrow function can be written as either a single expression or a series of statements wrapped into {} (just as you write bodies of plain old functions).
The point is, if parser encounters { after the =>, it goes with the second option. Now, it doesn't matter whether or not you use empty object literal or full object literal (like { a: 2 } in the first edit of this answer) - it's never treated as object literal, only as a function's body.
And what happens if function doesn't have a return statement? Right - this function returns undefined. That's why you get three of those as result of map (both for => {} and for => { a: 2 }).
To get three empty objects instead, just wrap {} into (), like this:
[1,2,3].map(i => ({}));
... as it forces the parser to go with expression path.
Related
This question already has answers here:
Curly Brackets in Arrow Functions
(3 answers)
Why doesn't my arrow function return a value?
(1 answer)
When should I use a return statement in ES6 arrow functions
(6 answers)
Closed last month.
I've summerized my problem in an example below, the problems is, if I use in an object an arrow function with only one item (23) in the function (as below), I've to not to use curly brackets for it to work. Why is so? I thought it was optional not to use curly brackets when in the function there is only one item. Thanks
Doesn't work with curly brackets, returns undefined
obj = { y: () => {23} }
console.log(obj.y());
Works without curly brackets, returns 23
obj = { x: () => 23 }
console.log(obj.x());`
"to work with or without the curly brackets"
This question already has answers here:
What does this symbol mean in JavaScript?
(1 answer)
What's the meaning of "=>" (an arrow formed from equals & greater than) in JavaScript?
(14 answers)
Closed 2 years ago.
editable: params => this.isEditable(applied)(params)
this editable get boolean value by calling iseditable function by passing applied as a paramaters. but params is get passed with it. what is the meaning of this code?
Well, you only showed a small snippet, but I suspect it's something along the lines as
{// Some object is being constructed...
editable: params => this.isEditable(applied)(params)
}
Which is an ES6 "arrow function expression", which returns some other function, as the return value of calling isEditable.
//Some object is being constructed...
{
editable: function ( params ){
return this.isEditable(applied)(params)
},
// More properties being defined...
}
You can learn more about ES6 arrow function expressions here https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions
This question already has answers here:
ECMAScript 6 arrow function that returns an object
(6 answers)
Closed 4 years ago.
in the below code, activeProgs is an array contains program objects. i am using .map because i would like to have an array containing the name of the
program and a token value. this token value is an integer and it could be incremented by one for each program as shown below in the code.
my question is, if i want to have the same array that contains the program name and the token but as an object. in other words, i want the .map()
to return an array but that array contains objects with two attributes "progName" and "token". can i do the following?
activeProgs.map((prog)=> {progName: prog.getHeader().getName(), token: (++i)} )
please let me know how to do it correctly
code:
activeProgs.map((prog)=> prog.getHeader().getName() + '->' + (++i))
like so:
activeProgs.map((prog) => ({progName: prog.getHeader().getName(), token: (++i)}) );
or like so:
activeProgs.map((prog) => {
return {progName: prog.getHeader().getName(), token: (++i)}
})
In the first example, adding brackets around the {} forces it to be parsed as an expression containing an object literal. In your code, it is interpreted as part of the function declaration, making the next bit a syntax error.
The second one makes that more explicit
You weren't far off with the example you suggested, you just needed to wrap the object in brackets so the compiler understands you are returning an object and not declaring a function body
activeProgs.map(prog => ({
progName: prog.getHeader().getName(),
token: (++i)
}))
This question already has answers here:
ECMAScript 6 arrow function that returns an object
(6 answers)
Closed 5 years ago.
Is it possible to write the code below in one line (without return keyword)?
elements.map(element => {
return {...element, selected: false};
})
Yes, by using the concise arrow form, enclosing the object initializer in ():
elements.map(element => ({...element, selected: false}));
// ---------------------^-----------------------------^
You need the () because otherwise the { of the object initializer is read as the { as the beginning of a function body. The ( instead makes it an expression body with implied return.
This question already has answers here:
ECMAScript 6 arrow function that returns an object
(6 answers)
Closed 6 years ago.
Im using the shortened ES6 arrow function notation to write my function body like this
const funcName = (...args) => something
I'm not even using a single curly bracket since my function body has just 1 return statement.
But say I want to return an object from this function, I would have to do:
const funcName = (...args) => {key:val}
The problem here is babel is assuming that the stuff inside the curly brackets is a function body - not an object - how to make it think that it is indeed an object??
Embrace it with brackets
const funcName = (...args) => ({key:val})