전개연산자 Spread

전개연산자는 ... 을 사용하며, 객체나 배열을 복사하여 값을 추가할 때 사용한다.

 

객체의 전개연산

//spread

// 객체와 배열의 배부, 함수의 인자에서 사용.
// 이거받고 이거 추가해 :)
//거대한 객체에서 값을 추가하고 싶을때 사용한다.

const student = {
	"name" : '김구름'
}

const univStudent = {
	...student,
	"major" : '컴퓨터 공학과' 
}

const univvvStudent = {
	...student,
	...univStudent,
	"class":'B'
}


console.log(student, univStudent, univvvStudent);
//{ name: '김구름' } { name: '김구름', major: '컴퓨터 공학과' } { name: '김구름', major: '컴퓨터 공학과', class: 'B' }

---

배열의 전개연산

const addNumbers = [1,3,5,7,9];
const eventNumbers = [2,4,6,8,10];

const allNumbers = [...addNumbers, ...eventNumbers, 11];

console.log(allNumbers);
//[ 1, 3, 5, 7, 9, 2, 4, 6, 8, 10, 11 ]

---

함수 인자로서의 전개연산 < **

직접 작성해본 예제인데, 생각할게 꽤 있다. 변수의 스코프와 전개연산, forEach 와 map 중 함수의 선택, 내부 함수의 화살표 함수.

// 전개연산자는 함수의 인자 값에 많이 쓰인다.
const sum = (...allNumbers) => {
	let summ = 0;
	allNumbers.map( num => summ += num);
	return summ;
}

console.log(sum(...allNumbers));

//66

---

Rest 인자를 한번에 배열이나 객체로 받아들이는 방식, 디스트럭쳐링에서 다른 값을 분리

const addNumbers = [1,3,5,7,9];
const eventNumbers = [2,4,6,8,10];

const allNumbers = [...addNumbers, ...eventNumbers, 11];


console.log(...allNumbers);
// 1 3 5 7 9 2 4 6 8 10 11 <<< 전개 연산시 각 값들로 나뉜다.


// Rest 문법은 함수의 인자를 객체, 배열화한다.
const sum = (...allNumbers) => {
	console.log(allNumbers);// [ 1, 3, 5, 7, 9, 2, 4, 6, 8, 10, 11 ] <<< 맵핑 시켰다.
	let summ = 0;
	allNumbers.map( num => summ += num);
	return summ;
}


sum(...allNumbers);

//rest 문법은 부분 집합을 만들어 낸다.
const koreanUnivStudent = {
	"name":'김구름',
	"major":'컴공',
	"region":'서울'
}

const {name, ...rest} = koreanUnivStudent;

console.log(rest);