1. 변수 교환(Swap variables) 두 개의 변수 값을 교환할 때, 기존의 방식으로는 임시 변수를 사용해야 했습니다. 하지만 Destructuring을 활용하면 아주 간단하게 변수를 교환할 수 있습니다.

let a = 10;
let b = 20;

[a, b] = [b, a];

console.log(a); // 20
console.log(b); // 10

위 예시에서는 a와 b의 값을 간단히 교환할 수 있습니다.

1. 함수에서 여러 값 반환(Returning multiple values from a function) 자바스크립트 함수는 단일 값을 반환할 수 있습니다. 하지만 Destructuring을 사용하면 함수에서 여러 값을 한 번에 반환할 수 있습니다.

function getNumbers() {
  return [1, 2, 3];
}

const [x, y, z] = getNumbers();

console.log(x); // 1
console.log(y); // 2
console.log(z); // 3

위 예시에서는 getNumbers 함수가 배열 형태로 여러 값을 반환하고, Destructuring을 통해 각 값을 개별 변수에 할당하고 있습니다.

1. 배열 일부 값 무시(Ignoring some values) 만약 배열의 일부 값을 무시하고 싶은 경우에도 Destructuring을 사용할 수 있습니다. 이를 위해 무시하고자 하는 값을 _로 할당하면 됩니다.

const numbers = [1, 2, 3, 4, 5];

const [first, second, , fourth, fifth] = numbers;

console.log(first);  // 1
console.log(second); // 2
console.log(fourth); // 4
console.log(fifth);  // 5

위 예시에서는 배열 numbers의 3번째 값은 무시하고, 나머지 값을 각각의 변수에 할당하고 있습니다.

이렇듯 배열의 Destructuring을 활용하면 코드를 더욱 깔끔하고 간결하게 작성할 수 있습니다. 자바스크립트 개발에 입문한 분들에게 특히 추천하는 개념이니, 앞으로 프로젝트에서 활용해 보시기 바랍니다.

#자바스크립트 #개발팁