What is the difference between destructuring and the spread operator in JavaScript?

What is the difference between destructuring and the spread operator in JavaScript?

Destructuring allows you to unpack values from arrays or properties from objects into distinct variables. The spread operator, on the other hand, is used to expand elements of an iterable (like an array) into individual elements.

Can you give me an example of destructuring?

Sure! For example, if you have an object like const person = { name: 'Alice', age: 25 };, you can destructure it like this: const { name, age } = person; This assigns 'Alice' to name and 25 to age.

And how about the spread operator?

The spread operator can be used to create a new array or object. For instance, if you have an array const arr = [1, 2, 3];, you can create a new array with additional elements like this: const newArr = [...arr, 4, 5];, resulting in [1, 2, 3, 4, 5].

Are there any performance differences between the two?

Generally, destructuring and the spread operator have similar performance characteristics, but it can depend on the context and how they are used. It's best to profile in performance-critical applications.