ES6

SPREAD (전개구문)

으누아빠 2021. 3. 31. 18:43
반응형

SPREAD

전개 구문을 사용하면 배열이나 문자열과 같이 반복 가능한 문자를 0개 이상의 인수 (함수로 호출할 경우) 또는 요소 (배열 리터럴의 경우)로 확장하여, 0개 이상의 키-값의 쌍으로 객체로 확장

=> 즉 변수를 가져가서 풀어해친다.

console.log(...[1, 2, 3]) // 1, 2, 3
console.log(...'Hello'); // H e l l o

const friends = [1, 2, 3];
const family = ['a', 'b', 'c'];

console.log([friends, family]); //[Array(3), Array(3)]
console.log([...friends, ...family]); //[1, 2, 3, "a", "b", "c"]

const name = ["kang", "kim"];
const newName = ["park", ...name];

//추가
console.log(newName); //["park", "kang", "kim"]

const kang = {
  username: "kang"
};

//추가
console.log({ ...kang, age: 47 }); //{username: "kang", age: 47}

const days = ["Mon", "Tue", "Wed"];
const weekend = ["Sat", "Sun"];
const fullWeek = [...days, "Thu", "Fri", ...weekend];
console.log(fullWeek); //["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]

const lastName = "Smith";
const user = {
  name: "kang",
  age: 47,
  ...(lastName !== "" && { lastName })
};

console.log(user); //{name: "kang", age: 47, lastName: "Smith"}

'ES6' 카테고리의 다른 글

for...of()  (0) 2021.04.01
Rest  (0) 2021.04.01
DESTRUCTURING [구조분해할당]  (0) 2021.03.31
Array.findIndex() 및 array.fill()  (0) 2021.03.31
Array.of() 및 Array.from()  (0) 2021.03.31