https://www.linkedin.com/pulse/javascript-use-destructuring-get-values-from-arrays-objects-svekis-
Destructuring is a feature in JavaScript
Use Destructuring to get values from arrays
Make use of destructuring to extract values from arrays and objects into variables:
// Destructuring arrays
const colors = [‘red’, ‘green’, ‘blue’];
const [first, second, third] = colors;
// Destructuring objects
const person = {
name: ‘John Doe’,
age: 30,
job: ‘Software Engineer’
};
const { name, age, job } = person;
Destructuring is a feature in JavaScript that allows you to extract values from arrays and objects and assign them to variables. It is a convenient and efficient way to extract multiple values from data structures and avoid unnecessary repetitions in your code.
Here’s an example of destructuring values from an array:
const numbers = [1, 2, 3, 4, 5];
const [first, second, …rest] = numbers;
console.log(first); // 1
console.log(second); // 2
console.log(rest); // [3, 4, 5]
In the above example, the const keyword is used to declare variables first, second, and rest. The values from the numbers array are then destructured and assigned to these variables using the square brackets []. The …rest syntax is called the “spread operator” and is used to extract all remaining elements of the array into a new array.
Here’s an example of destructuring values from an object:
const person = {
name: ‘John Doe’,
age: 30,
location: ‘New York’
};
const { name, age, location } = person;
console.log(name); // John Doe
console.log(age); // 30
console.log(location); // New York
In the above example, the values from the person object are destructured and assigned to variables with the same name as the object properties. The curly braces {} are used to extract values from the object.
You can also give different names to the variables being destructured:
const person = {
name: ‘John Doe’,
age: 30,
location: ‘New York’
};
const { name: fullName, age: personAge, location: city } = person;
console.log(fullName); // John Doe
console.log(personAge); // 30
console.log(city); // New York
Destructuring is a powerful feature in JavaScript that can make your code more readable, concise, and expressive. By extracting values from arrays and objects and assigning them to variables, you can avoid repetitive and verbose code and write more efficient and maintainable code.
const colors = [‘red’,’green’,’blue’];
const [a,b,c] = colors;
console.log(a,b,c);
const numbers = [1,2,3,4,5];
const [first,second, …rest] = numbers;
console.log(numbers);
console.log(first);
console.log(second);
console.log(rest);
const person = {
name : ‘Laurence Svekis’,
age : 40,
loc : ‘Ontario’
}
console.log(person);
const {name,age,loc} = person;
console.log(name);
console.log(age);
console.log(loc);
const person1 = {
name : ‘Laurence Svekis’,
age : 40,
location : ‘Ontario’
}
const {name:fullName,age:personsAge,location:city} = person1;
console.log(fullName);
console.log(personsAge);
console.log(city);