JS / ES6, ES11

출처: https://www.youtube.com/watch?v=36HrZHzPeuY

---

ES6

 

1. Shorthand property names

key와 value가 동일한 경우 줄여쓰기 가능 

 

<예시>

{
    const es6 = {
        name: 'js',
        age: 'very long',
    };

    const name = 'js';
    const age = 'very long'

    const es7 = {
        name, 
        age,
    }
}

 

2. Destructuring assignment

오브젝트의 key와 value에 접근할때 예를들면 

student.name 이런식으로 쓰는데 이걸 

const { name, level } = student; 이렇게 작성가능 

 

3. Spread syntax 

배열 복사할때 [...배열명]

[...배열명1, ...배열명2] 이렇게 가볍게 병합가능 

//object복사도 되는데 이때 이름이 똑같으면 뒤에 작성된 값이 위로 덮어씌여진다는 점 주의 

 

4. Default parameters

함수 파라미터자리에 원래 값이 들어가는데 호출시 내가 빈값을 주면 undefined 가 뜬다 

이럴때 보통 

if(파라미터명 == null){

  파라미터명 = '디폴트 값';

} 이런식으로 하는데 

그냥 함수명(파라미터명 = '디폴트 값') 해주면 됨 

 

5. Ternary operator 삼항 조건 연산자

// ( ? ' ' : ' ' ) <= 이건데 하도 많이 해서 정리하기 귀찮

 

6. Template Literals 

// 이것도 문자 안에 변수넣을때 백틱에 ${변수명}하는거 

 

---

ES11

 

1. Optional chaining

console.log(person.job && person.job.manager && person.job.manager.name); 

이게 

console.log(person.job?.manager?.name);

이거랑 같음 

 

2. Nullish coalescing operator

or로 사용하는 || 를 ?? 로 사용하는거 

or은 뒤에 코드가 쓰일려면 앞이 false여야 하는데 

빈배열'', 숫자0, null, undefined 전부 false인데 

예를들면 

const num = 0;

const meg = num ?? 'undefined';

이때 ||을 쓰면 undefined가 찍힘 왜냐면 0은 false니까 

근데 ??을 쓰면 숫자 0이 찍힘 왜냐면 숫자0도 0이라는 숫자값이니까