자바스크립트의 syntax sugar를 이용해서 좀 더 편하고 빠르게 코딩 테스트 코드 작성하기
## 구조 분해 할당
```javascript
// 배열 구조 분해 할당
const arr = ['a', 'b', 'c'];
let [first1, second] = arr;
console.log(first1, second); // a b
let [first2, , third] = arr;
console.log(first2, third); // a c
```
배열의 구조 분해 할당은 인덱스 순서로 이루어진다.
만약에 뛰어넘고 싶은 인덱스가 있다면 `,` 을 이용해서 구분해주면 된다.
```javascript
// 객체 구조 분해 할당
const team = {name: 'samsung lions', color: 'blue'};
const {name:teamName, color} = team;
console.log(teamName, color); // samsung lions blue;
```
객체의 구조 분해 할당은 키를 이용하면 되고, 만약에 다른 이름으로 구조 분해 할당하고 싶다면 `{key: name}` 식으로 `:` 뒤에 할당하고 싶은 이름을 작성하면 된다.
### 값 교환하기 (swap)
temp 변수를 이용하는 로직
```javascript
let a = 1;
let b = 18;
let temp;
temp = a;
a = b;
b = temp;
```
구조 분해 할당을 이용하면 temp 변수 없이도 swap 로직을 작성할 수 있다.
```javascript
let a = 1;
let b = 18;
[b, a] = [a, b];
```
### 비구조화 할당
비구조화 할당은 함수에 객체를 인수로 전달할 때 필요한 것만 꺼내서 사용할 수 있는 문법이다.
사용 방법은 구조 분해 할당과 비슷하다.
```javascript
function sayHello({name, job}) {
console.log(`Hello, ${job} ${name}!`);
}
const person = {
name: 'Bob',
age: '32',
job: 'developer',
nickname: 'Mr, Bob'
}
sayHello(person); // Hello, developer Bob!
```
## 스프레드 연산자
```javascript
// 배열 병합
const arr1 = [1, 2, 3, 4];
const arr2 = ['a', 'b', 'c', 'd'];
const arr = [...arr1, ...arr2];
console.log(arr); // [ 1, 2, 3, 4, 'a', 'b', 'c', 'd' ]
```
배열은 스프레드 연산자를 사용한 순서대로 병합된다.
```javascript
// 객체 병합
const person = {
name: 'Bob',
job: 'developer',
nickName: 'Mr.Bob',
};
const gameRank = {
nickName: 'Mr.Bob',
rank: 42,
}
const userInfo = {...person, ...gameRank};
console.log(userInfo);
// {
// name: 'Bob',
// job: 'developer',
// nickName: 'Mr.Bob', // 덮임
// rank: 42
// }
```
객체 역시 스프레드 연산자를 사용한 순서대로 병합된다.
키가 같은 것이 있다면 나중에 사용된 값으로 덮어진다.
### 배열 내 중복 제거하기
Set을 이용하면 중복을 간단히 제거할 수 있다.
```javascript
const names = ['kim', 'park', 'song', 'yoon', 'kim', 'jeong'];
const uniqueNames = [...new Set(names)];
console.log(uniqueNames); // [ 'kim', 'park', 'song', 'yoon', 'jeong' ]
```
## `&&`와 `||` 연산자로 조건문 대체하기
`&&` 연산자는 앞 요소가 truthy면 뒤 요소를 실행한다.
```javascript
// 앞 요소가 truthy면 뒤 요소 실행
const flag = true;
flag && console.log('hey!'); // hey! 출력
!flag && console.log('hey!'); // false
```
비슷하게 `||` 연산자는 뒤 요소가 falsy면 뒤 요소를 실행한다.
```javascript
// 유저 정보가 없으면 게스트로 설정
const userData = undefined;
const user = userData || {name: 'guest'};
console.log(user); // { name: 'guest' }
```
두 연산자는 falsy 값을 필터링 할 때 유용하게 사용할 수 있다!