Efficient Variable Assignment with Array and Object Destructuring in JavaScript


Array destructuring in JavaScript is a convenient way to extract values from arrays and assign them to variables. The basic syntax for array destructuring is as follows:

let [variable1, variable2, ..., variableN] = array;

For example, if you have an array of numbers and you want to assign the first, second and third elements to separate variables, you can use array destructuring like this:

let numbers = [10, 20, 30, 40, 50];
let [a, b, c] = numbers;
console.log(a); //10
console.log(b); //20
console.log(c); //30

In the above example, the first element of the numbers array is assigned to the variable "a", the second element is assigned to the variable "b", and the third element is assigned to the variable "c".

You can also use destructuring to extract elements from nested arrays. For example, you can de-structure an array of arrays like this:

let nestedArray = [[1, 2], [3, 4], [5, 6]];
let [[a, b], [c, d], [e, f]] = nestedArray;
console.log(a); //1
console.log(b); //2
console.log(c); //3
console.log(d); //4
console.log(e); //5
console.log(f); //6

You can also use destructuring to extract elements from the end of an array like this:

let numbers = [10, 20, 30, 40, 50];
let [a, b, ...c] = numbers;
console.log(a); //10
console.log(b); //20
console.log(c); // [30,40,50]

In the above example ...c is called rest pattern, it will gather all the remaining element into an array

In summary, array destructuring in JavaScript is a convenient way to extract values from arrays and assign them to variables. It allows you to easily extract elements from arrays and assign them to variables in a concise and readable way.

Array destructuring in JavaScript on Objects

In JavaScript, you can also use de-structuring to extract values from objects and assign them to variables. The basic syntax for object de-structuring is as follows:

let {property1: variable1, property2: variable2, ..., propertyN: variableN} = object;

For example, if you have an object with properties "name", "age" and "gender" and you want to assign the values of those properties to separate variables, you can use object destructuring like this:

let person = {name: "Tiya", age: 5, gender: "female"};
let {name, age, gender} = person;
console.log(name); // "Tiya"
console.log(age); // 5
console.log(gender); // "female"

You can also use destructuring to extract values from nested objects. For example, you can de-structure an object with nested objects like this:

let address = {street: "Cherry Road", city: "Salem", state: "Tamil Nadu", zip: "636007"};
let employee = {name: "Tiya", age: 12, gender: "female", address};
let {name, age, gender, address: {city, state, zip}} = employee;
console.log(name); // "Tiya"
console.log(age); // 30
console.log(gender); // "female"
console.log(city); // "Salem"
console.log(state); // "Tamil Nadu"
console.log(zip); // "636007"

You can also use destructuring to set default values for properties that might be missing from the object. For example, you can destructure an object and set default values for properties like this:

let {name = "guest", age = 25, gender = "unknown"} = person;
console.log(name); // "John"
console.log(age); // 30
console.log(gender); // "male"

In the above example, if the person object does not contain the name,age and gender properties, the destructuring will assign the default values to the variables.

In summary, object destructuring in JavaScript is a convenient way to extract values from objects and assign them to variables. It allows you to easily extract properties from objects and assign them to variables in a concise and readable way, also it allows you to set default values for properties that might be missing from the object.

List of Programs


JS Practical Questions & Answers


JS Practical Project