[Javascript] 구조분해할당 / 나머지매개변수 / 복제(전개구문)

구조분해할당 구문은 배열이나 객체의 속성을 분해해서 그 값을 변수에 담을 수 있게 하는 표현식

 

▶ 배열 구조분해

let [x,y] = [1,2];

//일반
let user1 = users[0];
let user2 = users[1];
let user3 = users[2];

//구조분해할당
let users = ['sian','jian','wian'];

 

let str = "한-서-현";
let [name1,name2,name3] = str.split('-');

console.log(user1); //한
console.log(user2); //서
console.log(user3); //현

 

let [a,b,c] = [1,2];
//a = 1
//b = 2
//c = undefined

 

이런 undefined 를 미리 방지하기 위해 기본값을 줄 수 있다

let [a=3, b=4, c=5] = [1,2];

a = 1
b = 2
c = 5

 

 

▶ 객체 구조분해

let user = {name : "sian" , age:23};
let {name, age} = user;

 

배열과 마찬가지로 객체에도 기본값을 줄 수 있다

 

 

---

※ 나머지 매개변수

 

자바스크립트에서 함수에 전달하는 인수의 갯수에는 제한이 없다

 

ex ) 

function showNmae(name){
	console.log(name);
}

showName('sian'); 
showName('sian','moongchi');
showName(); //undefined, 에러가 나진 않는다

두번째 showName 함수의 인자에 값을 2개 넣었다.

showName 은 인자가 1개만 들어갈 수 있는 함수이지만, 2개를 넣는다고 해서 오류가 나진 않는다.

자바스크립트는 함수에 전달하는 인수갯수의 제한이 없기 때문이다 !

다만, console 에는 sian 만 찍히고, 두번째 인자인 moongchi는 무시된다.

 

 

▷ Argument 

• Argument 는 함수로 넘어온 모든 인수에 접근할 수 있다
• 함수 내에서 이용 가능한 지역변수이다
• length 와 index 가 있어서 배열이라고 생각될 수 있겠지만, array 형태의 객체이다.   - (이게 무슨말인지 모르겠다... array 형태의 객체를 배열이라고 부르기로 사회적 약속을 한 것 아닌가요  . . . ? ) but 배열의 내장 메서드를 갖고 있지 않기 때문에 forEach 나 map 같은 것은 사용할 수 없다.  

 

▶ 나머지 매개변수 구문

나머지 매개변수는 정해지지 않은 갯수의 인수를 배열로 나타낼 수 있게 한다. 

function showName(...names){ //names 배열 안에 전달된 인수들이 들어간다
	console.log(names);
}

showName(); //[]
showName('sian ') // ['sian']
showName('sian', 'tom') //['sian','tom']

skills 스킬들은 몇개가 있을지 모르니까 나머지 매개변수인 ...skills 로 받음

따라서 나머지 매개변수는 마지막에 존재해야함 (인자로 받을때만) 

 

근데 이렇게는 사용할 수 있음

let arr1 = [1,2,3];
let arr2 = [4,5,6];

let result = [0, ...arr1, ...arr2, 7,8,9];


arr.push() / arr.splice() / arr.concat()

 

 

▶ 전개구문(Spread syntax) : 복제

오 ... 이렇게 객체를 복사하믄 Object.assign 을 사용하지 않아도 되군용