What is this es6 assignment operator? [duplicate] - javascript

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

Related

How can I clean up this destructuring assignment in js? [duplicate]

This question already has answers here:
Destructuring and rename property
(2 answers)
Closed 5 months ago.
In Javascaript, I publicly assigned the variable A. I now want to assign A to a destructured variable. But all I can think of is:
const {variable} = getVariable();
A = variable;
How can I make this into a one-liner?
You can write
({variable: A} = getVariable());
if you insist on using destructuring to assign a previously declared variable, but really there's no good reason to use destructuring here. Normal property access is so much simpler, shorter, and more readable:
A = getVariable().variable;
You can do this
const {variable:A} = getVariable();

Javascript weird syntax in function parameter [duplicate]

This question already has an answer here:
Where can I get info on the object parameter syntax for JavaScript functions?
(1 answer)
Closed 3 years ago.
I am learning vue and I came across this weird syntax in defining a function, I am curious what it is called and where i can learn more about it
register({commit}, credentials){
}
Why are there brackets around commit? Shouldn't it just be simple:
register(commit, credentials){
}
What's the purpose of placing brackets around commit variable?
This is object destructuring assignment. You can read about it on MDN here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
Basically, your function's first parameter is an object that has a commit property. Destructuring lets you pull that property out of the object. Here's an example of destructuring being used (but not within function arguments):
const obj = {
commit: "Hi there"
}
const { commit } = obj;
console.log(commit);
// "Hi there"

defining a variable in JS with { } around variable name - what is this called? [duplicate]

This question already has answers here:
What does curly brackets in the `var { ... } = ...` statements do?
(4 answers)
Closed 4 years ago.
I upgraded a npm and now my webpack fails around this line here.
const { theme } = params;
What does this mean when you have { } around the variable name?
This is called destructuring assignment. The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into distinct variables.

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"

What is this js syntax called? [duplicate]

This question already has answers here:
Javascript object bracket notation ({ Navigation } =) on left side of assign
(5 answers)
Closed 6 years ago.
I'm not sure if there is a specific name for this way to pull object properties into their own variable? If there is a name, does anyone know?
var object = {
something: 'a string',
another: 'another string',
}
var { something, another } = object;
This is called object destructuring.
Object destructuring, read up on it here:
https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
A lot of this new syntax isn't fully implemented in all js engines, so be careful when using it!
If you want to learn more about it, checkout this tutorial:
https://www.eventbrite.com/engineering/learning-es6-destructuring/

Categories

Resources