ES6 Rest, Spread Operator

1286 단어 JavaScriptJavaScript

Rest Operator

함수의 인자, 배열, 객체 중 나머지 값을 묶어 사용하도록 한다.

함수 인자

function getMin(...rest) {		// 인자들을 배열로 담음
	return rest.reduce((a, b) =>
    	a < b ? a : b)
}

getMin(7, 4, 5, 1)				// 1

배열

let arr = [1, 2, 3, 4, 5];
let [head, ...tail] = arr;		// arr 배열의 첫 번째 원소를 head, 나머지 값들을 tail에 배열로 묶음

객체

let o = {
    name: "Daniel",
    age: 23,
    address: "Street",
    job: "Software Engineer",
};

let { age, name, ...rest } = o;		// age, name을 제외한 나머지 필드는 rest 변수로 할당

Spread Operator

묶인 배열 혹은 객체를 각각의 필드로 변환한다. 등장 순서에 따라 필드가 덮어씌워 질 수 있다.

배열

let arr1 = [1, 2, 3];
let arr2 = [0, ...arr1, 4, 5];		// [0, 1, 2, 3, 4, 5]

let str1 = 'Spread';
let str2 = [...str1];				// ['S', 'p', 'r', 'e', 'a', 'd']

객체

let o = {
    name: "Daniel",
    age: 23,
    address: "Street",
    job: "Software Engineer",
};

let p1 = { ...o, name: "An" }		// 기존의 name 필드에 덮어씌움
let p2 = { name: "An", ...o }		// 기존의 name 필드가 덮어씌움

console.log(p1.name);				// "An"
console.log(p2.name);				// "Daniel"

좋은 웹페이지 즐겨찾기