es6(2)

// 1. 단축 속성명 : property shorthend
// 정말 많이 쓰이고 쓰는 것보다 모르면 해석하기가 힘들다
const name = "nbc";
const age = "30";

// key - value가 있는 객체이다 
// {name : age} 가 아니다
// 객체이기에 변수명이 중복되지 않는다
const obj = { name, age };

// const obj = { 
//     name : name, 
//     age : age
// };
// key - value가 같다면 생락 가능하다  

// 2. 전개 구문 = spread oprerator
// 요소들이 전개 된다
// 기존 주고를 벗어버리고 새로운 구조를 덧입혀야 될 때 사용한다
// 구조분해할당과 함께 가장 많이 사용되는 es6 문법 중 하나!

// 배열의 경우
let arr = [1, 2, 3];
console.log(arr);
console.log(...arr);

// 기존 배열의 요소를 추가할 때
// 쓰레드 문법을 사용하면 더 간단하게 만들 수 있다

let newArr = [...arr, 4];
// -> let newArr = [1, 2, 3, 4];
console.log(newArr);

// Q. arr.push(4);를 사용하는 경우
// A. arr 배열이 바뀐다 

// Q. ... 없이 추가하면 
// A. let newArr = [arr, 4]; => [[1, 2, 3], 4]; 이차원배열이 됨

// 객체의 경우
let person = {
    name : "mjm",
    age : 30
};

let person2 = {
    name : "MJM",
};

let personTest = {...person};
let personTest2 = {...person, person2};
let personTest3 = {...person, ...arr};
let personTest4 = {...person, ...person2};

console.log(personTest); // 전개한 것들을 다시 {}로 묶어 다시 객체가 되어 변화가 없다
console.log(personTest2); // person객체에 person2: { name: 'MJM' } 프로퍼티 추가되었다
console.log(personTest3); // 인덱스와 값이 프로퍼티로 추가되었다
console.log(personTest4);  // { name: 'MJM', age: 30 } 같은 키가 있는 경우 뒤에 키의 값으로 덧입혀졌다

// 하지만 핵심은 이렇게 전개해주는 게 핵심이며 재구성은 하나의 예시일 뿐 
// 더 많은 활용 방법들이 있다

// 3. 나머지 매개변수(rest parameter) (...args)
// 매개변수의 수가 정해져 있지 않은 경우에 사용
function exampleFunc(a, b, c){
    console.log(a, b, c);
} 

function exampleFunc2(a, b, c, ...args){
    console.log(a, b, c, ...args);
    console.log(args) // 배열로 들어간다
    console.log(...args) // ...으로 배열을 전개해준다 
}
exampleFunc(1,2,3,4,5) // 정해진 매개변수를 넘어가면 생락됨
exampleFunc2(1,2,3,4,5) // 정해진 매개변수에 추가로 매개변수가 더해져도 유동적이다

// 템플릿 리터널(Template Literal) 
// backtick(`) 작은 따옴표 아님 
const testValue = 123
console.log("Hello World", + testValue )
console.log(`Hello World + ${testValue}`)
console.log(`
    Hello
        My name is Javascript!!!

        Nice to meet you!!!
`) // 멀티 라인을 지원한다

 

다른 건 모르겠고 템플릿 리터널은 가독성도 편의성도 진짜 좋아 보인다 이래서 es6를 많이 언급하는구나 싶으면서도

이것도 저것도 진짜 많이 쓰인다고 하는데 앞이 깜깜하다