ES6문법

Shortand property names (변수를 이용해 객체 선언)

같은 이름의 key와 값일 경우 생략

const name = 'khw';
const age = 24;

const me2 ={
    name:name,
    age:age
}

이런 형태의 객체의 key와 value가 같은 이름일 경우에

const name = 'khw';
const age = 24;

const me ={
    name,
    age
}

이런식으로 나타낼 수 있다.

Destructing assignment (객체를 이용해 변수 선언)

변수의 이름이 key의 이름과 같은 이름일 경우

const me ={
    name:'khw',
    age:24
}

const {name,age} = me;

console.log(name,age)

변수의 이름이 key의 이름과 다른 이름일 경우

const me ={
    name:'khw',
    age:24
}

const {name:name1,age:age1} = me;

console.log(name1,age1)

배열에서도 사용가능

const fruit = ['apple','banana'];

const [red,yellow] = fruit;

console.log(red,yellow);		// apple banana

Spread Syntax

[...[ ] ] 형태 (객체이던 상태 유지 => 주소값 전달)

const obj1 = {key:'key1'};
const obj2 = {key:'key2'};
const obj3 = [obj1,obj2];
const obj4 = [...obj3];     // [...[obj1,obj2]]

console.log(obj4[0] === obj1);		//[1]
console.log(obj4[0].key === obj1.key);	//[2]
obj2.key = 'key1000';		
console.log(obj2.key,obj4[1].key);	//[3]

위 내용을 보면
[1] 서로 같은 주소값인 obj1을 나타내므로 true
[2] 서로 같은 주소값에서의 key를 나타내므로 true
[3] 서로 같은 obj2의 바뀐 주소값을 나타내므로 key1000 key1000

{...{ } } 형태 (객체이던 상태가 ...에 의해 부서지고 다시 병합 => Value값 전달)

const obj1 = {key:'key1'};
const obj2 = {key:'key2'};

const obj3 = {...obj2};

console.log(obj3.key === obj2.key);			//[1]
console.log(obj3===obj2);				//[2]

obj2.key = 'key10000';
console.log(obj2.key, obj3.key);			//[3]

★ Obj의 주소값이 아닌 값이 Value값이 복사되는 것 같다.

[1]의 경우 둘다 같은 Value를 가지므로 true이다.
[2]의 경우 Value값을 복사하므로 서로 다른 주소값을 지니므로 false.
[3]의 경우 obj2에만 영향을 끼치는 key값의 변화이기 때문에 obj2.key는 값이 바뀌고 obj3.key는 값이 기존에 복사한 key2로 유지된다.

배열 합치기

const fruit1 = ['apple','banana'];
const fruit2 = ['orange','melon'];

const allFruit = [...fruit1,...fruit2];
console.log(allFruit);		//[ 'apple', 'banana', 'orange', 'melon' ]

default Parameter

function printMessage(message)
{
    console.log(message);
}
printMessage('hello');
printMessage();

결과가 매개변수가 존재하지않아 undefined라고 나오는 것을 다른것으로 표현하기 위해서는 if문 대신

function printMessage_Change(message='default message')
{
    console.log(message);
}
printMessage_Change('hello');
printMessage_Change();

이렇게 Default인 경우의 매개변수 값을 정해 놓을 수 있다.

출처 : 드림코딩앨리