Skip to content

Instantly share code, notes, and snippets.

@Kishimoto96
Created March 28, 2023 18:54
Show Gist options
  • Save Kishimoto96/50d100eb026ea0b179d5e0b39f00ce20 to your computer and use it in GitHub Desktop.
Save Kishimoto96/50d100eb026ea0b179d5e0b39f00ce20 to your computer and use it in GitHub Desktop.

Destructuring & Spread Operator:

  1. What is destructuring in JavaScript and how does it work?
  2. How can the spread operator be used in JavaScript?
  3. What are some practical use cases for using destructuring and the spread operator in JavaScript?
  4. How does destructuring and the spread operator differ from traditional assignment and concatenation in JavaScript?
  5. Can destructuring and the spread operator be used with non-array and non-object data types in JavaScript?
@afrakucukaydin
Copy link

Room 12 ---- Özlem--Ahmad--Afra--Nour Eddin
1- Destructuring is extracting values from arrays or objects and assign them to variables. The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into distinct variables.

2- Spread operator can be used to expand an array, copy an array, combine objects, clone an object, pass arguments to a function.
EX: array1=[1,2,3,4,5];
array2=[...array1,6789];
The new array create new reference and any change to it , it will noit affect the original array.

3- Use cases for using destructuring: Assigning values from objects or arrays, Function parameters, Swapping variables.

Use cases for using spread operator: Copying arrays and objects, merging arrays.

4-

@houzifahabbo
Copy link

houzifahabbo commented Mar 30, 2023

Team members: @houzifahabbo @MOHAMMAD-ALMOHAMMAD @tomiece317
1- Destructuring in JavaScript is a feature that allows you to extract values from arrays and objects and assign them to variables in a more concise and readable way. With destructuring, you can declare variables and assign them the values of specific properties or elements from an array or object.

2- The spread operator in JavaScript is represented by three dots (...) and can be used in several ways, like copying an array or using it as a parameter for a function.

3- for destructuring, we can easily swap two array values without a third variable and we can access the object element more easily without having to redeclare it every time we want to use it, for the spread operator we can use it to clone an array.

4- Destructuring and the spread operator provide a more concise and efficient way of working with arrays and objects in JavaScript, compared to traditional assignment and concatenation.

5- yes you can use it with for example strings, here's an example code

const str="hello world"
let str2=[...str]
console.log(typeof str2) //-> object
const [a,b,c,...rest] = str
console.log(a,b,c,rest) //->h e l [ 'l', 'o', ' ','w', 'o', 'r','l', 'd']
const [str3]=str
console.log(str3) //-> h

@sack-ali
Copy link

group team 1.fatima 2. abdulmalik 3.abdulrahman 4. sakarie
1.Destructuring in JavaScript is a way to extract values from arrays or objects and assign them to variables in a more concise and readable way. It allows you to access nested values or multiple values in a single statement, and it can also be used to provide default values if the destructured value is undefined.
2.The spread operator in JavaScript is represented by three dots ... and is used to spread or expand an iterable object, such as an array, object or string into individual elements. It can be used in various ways to achieve different outcomes, some of which include:
A.Concatenating Arrays:
B.Copying Arrays C.Merging Objects D.Passing Arguments E.Converting Strings to Arrays
3.Destructuring and the spread operator are powerful features of JavaScript that can be used to simplify your code and make it more expressive. Here are some practical use cases for using them:
A.Destructuring Arrays and Objects: B.Passing Function Arguments C.Merging Arrays and Objects 4.Filtering Array

@motaz99
Copy link

motaz99 commented Mar 30, 2023

Ismail, Fatma, Abdulsalam, Motaz

1- Destructuring is a feature in JavaScript that allows you to extract values from arrays or objects and assign them to variables in a more concise way. Instead of accessing each value using its index or key and assigning it to a variable, destructuring allows you to do this in a single line of code.

2- We can create a shallow copy of objects and arrays using the spread operator because the objects and arrays are non-perimitive values, and use pass-by reference with them.

3- When we want to a copy of an array or obj we need to use the sperade operator cuz there is no other way to create a real copy directly so we can make a shallow copy, and for the restructuring, it is useful for extract values from objs or arrays and assign them into variable

@Sara-Nefise
Copy link

Team Members @muhammedhasann, Guled Khadar Abdi, Joud Khanji, Sara Nafisa

  1. Destructuring is a JavaScript expression that makes it possible to unpack values from arrays or properties from objects into distinct variables. For example, if you have an array x with values [1, 2, 3, 4, 5], you can use destructuring to assign the first two values of the array to variables y and z like this: const [y, z] = x;. After this assignment, y will be equal to 1 and z will be equal to 2.
    Similarly, you can destructure objects. For example, if you have an object obj with properties {a: 1, b: 2}, you can use destructuring to assign the values of properties a and b to variables a and b like this: const {a, b} = obj;. After this assignment, a will be equal to 1 and b
    will be equal to 2.

const numbers = [1, 2, 3];
const expandedNumbers = [...numbers, 4, 5];
console.log(expandedNumbers); // Output: [1, 2, 3, 4, 5]

spread opreator uses for shallow copy for an array or object
3. Destructuring use cases: Extracting values from arrays or object, Specifying default values,Swapping variables
spread operator use cases: Merging arrays and objects,Copying arrays and objects, Converting strings to arrays
5. yes, destructuring and spread Operator works with String and functions too




@irodamrj
Copy link

irodamrj commented Mar 30, 2023

1- Destructuring lets us pull out a specific parts of an array, object or a string. It would be easier to assign values to our variables.
2-spread operator allows us to do shallow copy on arrays, objects and strings. when we use spread operator to copy, and then make a modification to the copied array/objects/strings, it wouldnt affect the original ones.
3-when we want to get some of the attributes from an nested object, we can use destructuring. For spread operator: we can crate new array from the existing one.
4-In traditional assignment, we can create only one variable and assign it at a time. In destructuring, we can easily create and initialize more than one variable at a time. For concatenation: we can use spread operator with strings, objects and arrays.
5-NO

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment