Cannot understand this line of javascript code [duplicate] - javascript

This question already has answers here:
javascript es6 array feature [...data, 0] "spread operator"
(2 answers)
Closed 2 years ago.
let tempProducts = [];
storeProducts.forEach((item) => {
const singleItem = { ...item };
tempProducts = [...tempProducts, singleItem]; <----- This Line
});
What does the above indicated line mean? It looks like new ES6 syntax, but unlike anything I have seen before. Can anyone explain this to me please?

It creates a new array which consists of the items from tempProducts and the singleItem.
It has the same result as
tempProducts.concat(singleItem);
The (quite modern) syntax with the three dots is called 'spreading', the ... is the spread operator.

Related

Syntax - what does square brackets around a variable declaration mean [duplicate]

This question already has answers here:
Multiple assignment in JavaScript? What does `[ a, b, c ] = [ 1, 2, 3 ]` mean?
(4 answers)
Closed 5 years ago.
Take the following line of code
const [component] = router.getMatchedComponents({ ...to })
Could anyone advise what the square brackets around component means here? I have tried to google this but struggling to find an answer
It's called Destructuring assignment, and it's used to unpack the values of an array and assign them to new variables.
So here in your code:
const [component] = router.getMatchedComponents({ ...to })
You are assigning to the component variable the first element held in the array that will be returned by router.getMatchedComponents({...to}), where to is an array-like structure turned into object using the spread operation.

What is this syntax in JavaScript [duplicate]

This question already has answers here:
Multiple assignment in JavaScript? What does `[ a, b, c ] = [ 1, 2, 3 ]` mean?
(4 answers)
Closed 5 years ago.
Take the following line of code
const [component] = router.getMatchedComponents({ ...to })
Could anyone advise what the square brackets around component means here? I have tried to google this but struggling to find an answer
It's called Destructuring assignment, and it's used to unpack the values of an array and assign them to new variables.
So here in your code:
const [component] = router.getMatchedComponents({ ...to })
You are assigning to the component variable the first element held in the array that will be returned by router.getMatchedComponents({...to}), where to is an array-like structure turned into object using the spread operation.

What is this es6 assignment operator? [duplicate]

This question already has answers here:
Javascript object bracket notation ({ Navigation } =) on left side of assign
(5 answers)
Closed 5 years ago.
If this operator declared:
const { assign, isEmpty, run } = Ember;
Then, instead of:
Ember.run(() => { ... });
Ember.assign(foo, {});
It can be written as:
run(() => { ... });
assign(foo, {});
Which is much nicer!
What is it and how does it work?
Note: I'll edit this question to make it clearer when I know...
It's called destructuring and yes, it's very nice. Very convenient for cleaning up your code.
As explained by MDN:
The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into distinct variables.
Full reference here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

Is this a new way to extend an object in JavaScript? [duplicate]

This question already has answers here:
Javascript object bracket notation ({ Navigation } =) on left side of assign
(5 answers)
Closed 5 years ago.
While upgrading a private yeoman generator I stumpled upon this statement while looking through the official generator-webapp:
const { features } = answers;
I wasn't able to find anything about this, aside from the fact that it only works on node >=6.
What does this statement do? Where is this defined?
It's destructuring assignment. It's equivalent to:
const features = answers.features;
It was introduced in ES2015.
This:
const { features } = answers;
Is the shorthand of this:
const features = answers.features;
You could also declare many variables in a single line, see following please:
var answers = {"features": "test"};
const { features } = answers;
console.log(features);
var longObj = {"attr1": "val1", "attr2" : "val2"};
const { attr1, attr2 } = longObj;
console.log(attr1, attr2);
I hope it was clear. Bye.

const keyword usage in Javascript [duplicate]

This question already has answers here:
Javascript object bracket notation ({ Navigation } =) on left side of assign
(5 answers)
ES6 Object Destructuring Default Parameters
(1 answer)
Closed 6 years ago.
I was reading the source for a MeteorJS package (this one) when I came across this:
const {
getMeteorData,
pure = true,
} = expandedOptions;
I did some research to figure out what this code would do, but couldn't find any other instance of const being used like this, or any documentation to clarify it for me.
Any hints, please?
It is using es6 to unpack (or destructure) the values inside the expandedOptions object.
const val = {a:1, b:"hello"};
const {
a,
b
} = val;
console.log(a); //1
console.log(b); //"hello"

Categories

Resources