자바스크립트에서 객체나 배열의 특정 값을 추출하고 필터링하는 작업은 매우 일반적입니다. 이러한 작업을 더욱 간편하게 하기 위해 ES6부터 소개된 Destructuring(해체 할당) 문법을 사용할 수 있습니다. Destructuring을 사용하면 한 줄로 코드를 작성하여 원하는 값을 추출하고 필터링할 수 있습니다.

객체에서 값 필터링하기

const user = {
  name: 'John',
  age: 30,
  email: 'john@example.com',
  isAdmin: true
};

const { name, age } = user;
console.log(name); // John
console.log(age); // 30

위의 예제에서는 객체 user에서 name과 age를 추출하여 변수에 할당하는 것을 볼 수 있습니다. 이렇게 변수에 직접 추출하여 할당할 수 있기 때문에 필요한 값만을 간편하게 추출할 수 있습니다.

배열에서 값 필터링하기

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

const [first, second, ...rest] = numbers;
console.log(first); // 1
console.log(second); // 2
console.log(rest); // [3, 4, 5]

위의 예제에서는 배열 numbers에서 첫 번째와 두 번째 값을 추출하고, 나머지 값들은 rest 배열에 할당하는 것을 볼 수 있습니다. 이렇게 배열에서도 Destructuring을 활용하여 필요한 값들을 간편하게 추출하고 다룰 수 있습니다.

값 필터링하기와 함께 사용하기

Destructuring을 사용하여 값 필터링을 할 때에는, 조건문을 함께 활용하여 원하는 조건에 맞는 값을 추출할 수 있습니다.

const user = {
  name: 'John',
  age: 30,
  email: 'john@example.com',
  isAdmin: true
};

const { name, age, isAdmin } = user;

if (isAdmin) {
  console.log(name); // John
  console.log(age); // 30
}

위의 예제에서는 객체 user에서 isAdmin이 true이면 name과 age 값을 추출하는 코드입니다. 이렇게 Destructuring과 조건문을 함께 사용하여 필요한 값만을 추출하고 필터링할 수 있습니다.

이처럼 Destructuring을 사용하면 자바스크립트에서 간편하게 객체나 배열의 값을 필터링할 수 있습니다. Destructuring을 활용하여 코드를 더욱 간결하고 가독성있게 작성할 수 있으므로, 활용해보시기 바랍니다.

#JavaScript #Destructuring