Rest and Spread

Jeong Ha Seung·2021년 11월 30일

ES6

목록 보기
5/9

Spread

const friends = [1, 2, 3, 4];

console.log(friends); //(4) [1, 2, 3, 4]
console.log(...friends); //1 2 3 4

//위 2개의 차이는 정말 크다. ...는 unpacking 개념과 비슷하다고 봐도 무방할듯

const family = ["a", "b", "c"];

console.log([friends, family]); //(2) [Array(4), Array(3)]
console.log([friends + family]); //(1) ["1,2,3,4a,b,c"]
console.log([...friends, ...family]); //{name: "nico", age: 24, sexy: true, hello: "hello"}

const friends = ["nico", "lynn"];

const newFriends = [...friends, "joey"];

console.log(newFriends);

const objectnico = {
  username: "nico"
};

console.log({ ...objectnico, password: 123 });

const first = ["mon", "tue", "wed"];

const weekend = ["sat", "sun"];

const fullweek = [...first, "thu", "fri", ...weekend];

console.log(fullweek);

const lastName = prompt("Last name : ");
const user = {
  username: "nico",
  age: 24,
  // lastName: lastName !== "" ? lastName : undefined,
  ...(lastName !== "" && { lastName }) .//빈 값이면 안되고 lastName이 존재해야 함
};

console.log(user);

Rest

const infiniteArgs = (...kimchi) => console.log(kimchi);

infiniteArgs("1", 2, true, "lalala");

const bestFriendMaker = (firstone, ...rest) => {
  console.log(`mybestfriend is ${firstone}`);
  console.log(rest); //나머지 값
};

bestFriendMaker("nico", "lynn", "dall");

const user = {
  NAME: "nico",
  age: 24,
  password: 12345
};
user["password"] = null;
console.log(user); //{name: "nico", age: 24, password: null}

const killage = ({ age, ...rest }) => rest;
const cleanuser = killage(user);
console.log(cleanuser); //{name: "nico", password: null}

//default로 country="KR"
const setCountry = ({ country = "KR", ...rest }) => ({ country, ...rest }); 

console.log(setCountry(user)); //{country: "KR", name: "nico", age: 24, password: null}

//기존 user array에 있는 NAME을 destructuring을 이용하여 name으로 변경
const rename = ({ NAME: name, ...rest }) => ({ name, ...rest });
console.log(rename(user)); //{newname: "nico", age: 24, password: null}
profile
블로그 이전했습니다. https://morethan-haseung-log.vercel.app

0개의 댓글