Update 32-Destructuring-Array.md

Author: sajidhamdard

notes/English/32-Destructuring-Array.md

@@ -0,0 +1,287 @@
+### What is destructuring and Destructuring Arrays in javascript. Explain with example
+Destructuring is a feature in JavaScript that allows you to extract values from arrays, objects, and other structures into distinct variables.
+
+Destructuring Arrays is the process of breaking down an array into individual elements, and assigning those elements to separate variables. This can be done using array destructuring syntax, which uses square brackets on the left-hand side of the assignment operator to specify the variables to which the array elements should be assigned.
+
+Here's an example:
+
+```javascript
+const numbers = [1, 2, 3];
+
+// Destructuring the array into individual variables
+const [a, b, c] = numbers;
+
+console.log(a); // Output: 1
+console.log(b); // Output: 2
+console.log(c); // Output: 3
+```
+
+In this example, we have an array `numbers` containing three values. We use array destructuring to assign each value to a separate variable `a`, `b`, and `c`. Now we can use these variables independently, as shown in the console.log statements.
+
+
+### How to Reverse values using destructuring in javascript. Explain with example 
+To reverse values using destructuring in JavaScript, you can use an array with the `reverse()` method and then destructure the reversed array into new variables. Here's an example:
+
+```javascript
+const numbers = [1, 2, 3, 4, 5];
+
+// reverse the array
+numbers.reverse();
+
+// destructure the reversed array
+const [five, four, three, two, one] = numbers;
+
+console.log(one); // Output: 5
+console.log(two); // Output: 4
+console.log(three); // Output: 3
+console.log(four); // Output: 2
+console.log(five); // Output: 1
+```
+
+In this example, we first create an array of numbers, then use the `reverse()` method to reverse the order of the elements in the array. We then destructure the reversed array into variables named `one`, `two`, `three`, `four`, and `five`. Finally, we log each variable to the console to confirm that the values have been reversed.
+
+
+### How to Return two values from function in javascript. Explain with example
+In JavaScript, it is not possible to directly return two values from a function. However, there are several ways to achieve this:
+
+1. Using an Array: We can create an array and store the values that we want to return in it. Then, we can return the array from the function.
+
+```javascript
+function twoValues() {
+  var x = 10;
+  var y = 20;
+
+  return [x, y];
+}
+
+var result = twoValues();
+console.log(result[0]); // Output: 10
+console.log(result[1]); // Output: 20
+```
+
+2. Using an Object: We can create an object and assign the values that we want to return to its properties. Then, we can return the object from the function.
+
+```javascript
+function twoValues() {
+  var x = 10;
+  var y = 20;
+
+  return { 
+    a: x, 
+    b: y 
+  };
+}
+
+var result = twoValues();
+console.log(result.a); // Output: 10
+console.log(result.b); // Output: 20
+```
+
+3. Using Destructuring: We can use destructuring to extract the values returned by the function into separate variables.
+
+```javascript
+function twoValues() {
+  var x = 10;
+  var y = 20;
+
+  return [x, y];
+}
+
+var [a, b] = twoValues();
+console.log(a); // Output: 10
+console.log(b); // Output: 20
+```
+
+
+### What is Destructuring of nested array in javascript. Explain with example
+Destructuring of nested array in JavaScript is a way to extract values from an array that contains other arrays, objects or primitives.
+
+For example, consider the following nested array:
+
+```javascript
+const nestedArr = [1, [2, 3], [4, 5, [6, 7]]];
+```
+
+To extract the values of this array using destructuring, we can do the following:
+
+```javascript
+const [a, [b, c], [d, e, [f, g]]] = nestedArr;
+```
+
+Here, the variables `a`, `b`, `c`, `d`, `e`, `f` and `g` are assigned the values from the corresponding positions in the `nestedArr` array.
+
+So, after running the above code, `a` will contain 1, `b` will contain 2, `c` will contain 3, `d` will contain 4, `e` will contain 5, `f` will contain 6, and `g` will contain 7.
+
+
+### how to set default values in destructuring in javascript. Explain with example
+In JavaScript, default values can be set in destructuring by using the `=` operator. The default value will be used if the corresponding variable in the destructuring assignment is undefined.
+
+Here's an example:
+
+```javascript
+// Without default values
+let person = { name: "John" };
+let { name, age } = person;
+console.log(name); // "John"
+console.log(age); // undefined
+
+// With default values
+let personWithAge = { name: "Jane" };
+let { name: newName, age = 25 } = personWithAge;
+console.log(newName); // "Jane"
+console.log(age); // 25
+```
+
+In the second example, we're setting a default value of 25 for the `age` variable. If `age` is undefined in the object being destructured (`personWithAge`), the default value of 25 will be used instead. We're also renaming the `name` variable to `newName` using the syntax `{ name: newName }`.
+
+
+### What is Destructuring Objects in javascript. Explain with example
+Destructuring objects in JavaScript is a way to extract values from an object and assign them to variables in a concise and readable manner.
+
+Here's an example:
+
+```javascript
+const person = {
+  name: 'Alice',
+  age: 30,
+  address: {
+    city: 'New York',
+    state: 'NY'
+  }
+};
+
+// Destructuring assignment
+const { name, age, address: { city } } = person;
+
+console.log(name); // 'Alice'
+console.log(age); // 30
+console.log(city); // 'New York'
+```
+
+In the above example, we are using destructuring assignment to extract the `name`, `age`, and `city` properties from the `person` object. The syntax `{ name, age, address: { city } }` specifies which properties to extract and how to assign them to variables.
+
+Note that we can also rename variables during destructuring:
+
+```javascript
+const { name: fullName, age: yearsOld } = person;
+
+console.log(fullName); // 'Alice'
+console.log(yearsOld); // 30
+``` 
+
+This allows us to use a different variable name for clarity or to avoid naming conflicts.
+
+
+### How to Extract any value from object in javascript using destructring. Explain with example
+To extract any value from an object in JavaScript using destructuring, you can use the following syntax:
+
+```javascript
+const { property } = object;
+```
+
+where `property` is the name of the property you want to extract and `object` is the object containing that property.
+
+Here's an example:
+
+```javascript
+const person = {
+  name: "John",
+  age: 30,
+  gender: "male"
+};
+
+const { name } = person;
+
+console.log(name); // Output: "John"
+```
+
+In this example, we're extracting the value of the `name` property from the `person` object using destructuring. The value is assigned to a variable named `name`, which we then log to the console. 
+
+You can also extract multiple properties at once by separating them with commas:
+
+```javascript
+const { name, age } = person;
+
+console.log(name, age); // Output: "John" 30
+```
+
+
+### How to rename Object property name in destrcutring in javascript. Explain with example
+In JavaScript destructuring, you can rename an object property by using the colon (:) syntax. Here's an example:
+
+```javascript
+const person = { firstName: 'John', lastName: 'Doe' };
+const { firstName: first, lastName: last } = person;
+
+console.log(first); // Output: "John"
+console.log(last); // Output: "Doe"
+```
+
+In the above example, we are renaming `firstName` to `first` and `lastName` to `last` while destructuring the `person` object. This means that we are creating two new variables `first` and `last` whose values are the respective values of the `firstName` and `lastName` properties of the `person` object.
+
+
+### Default values in destructuring in javascript. Explain with example
+In JavaScript, it's possible to set default values for variables when using destructuring assignment. This means that if the value being destructured is undefined or null, a default value will be used instead.
+
+Here's an example:
+
+```javascript
+const { name = "Anonymous", age = 18 } = {};
+console.log(name); // Output: "Anonymous"
+console.log(age); // Output: 18
+```
+
+In this code, we are using object destructuring to create two variables `name` and `age`, with default values of "Anonymous" and 18 respectively. Since we're destructuring an empty object `{}`, the values of `name` and `age` will be the defaults we specified.
+
+
+### Destructuring of Nested Object in javascript. Explain with example
+Destructuring is a feature in JavaScript that allows you to extract values from objects and arrays and assign them to variables. When dealing with nested objects, destructuring can provide a concise way to access their properties.
+
+Here's an example of destructuring a nested object:
+
+```javascript
+const user = {
+  name: 'John',
+  age: 30,
+  address: {
+    street: '123 Main St',
+    city: 'Anytown',
+    state: 'CA',
+    zip: '12345'
+  }
+};
+
+// Extracting nested object properties using destructuring
+const { name, age, address: { street, city, state, zip }} = user;
+
+console.log(name); // Output: John
+console.log(age); // Output: 30
+console.log(street); // Output: 123 Main St
+console.log(city); // Output: Anytown
+console.log(state); // Output: CA
+console.log(zip); // Output: 12345
+```
+
+In the example above, we have an object `user` with a nested object `address`. We use destructuring to extract the properties `name`, `age`, `street`, `city`, `state`, and `zip` from the `user` object by assigning them to variables with the same names. We also use the syntax `address: { ... }` to destructure the nested `address` object.
+
+
+### How to use destrcutring in Function in javascript. Explain with example
+Destructuring is a way to extract values from arrays or objects into distinct variables. You can use destructuring in function arguments to unpack arguments passed to the function.
+
+Here's an example of how to use destructuring in a function:
+
+```javascript
+function printName({firstName, lastName}) {
+  console.log(`${firstName} ${lastName}`);
+}
+
+const person = { firstName: 'John', lastName: 'Doe' };
+
+printName(person); // output: "John Doe"
+```
+
+In the above example, we define a function `printName` that takes an object as an argument. The object has two properties, `firstName` and `lastName`. Instead of accessing these properties with dot notation (`person.firstName` and `person.lastName`), we use destructuring to extract the values and assign them to separate variables within the function signature.
+
+We then define an object `person` with the same property names, and call the `printName` function with `person` as an argument. The function logs the full name to the console by combining the `firstName` and `lastName` variables.
+
+Note that the argument provided to `printName` must be an object with the expected property names. If any of the properties are missing or have different names, the destructuring will fail and the function will throw an error.