javascript/javascript 심화지식
나머지 매개변수, 전개구문 / (Rest parameters, Spread syntax)
honey.kikiki
2021. 7. 12. 23:19
728x90
나머지 매개변수, 전개구문
(Rest parameters, Spread syntax)
...
인수전달
function showname(name) {
console.log(name);
}
showname("Mike"); // 'Mike'
showname("Mike", "Tom"); // '?
showName(); // undefined
arguments
1. 함수로 넘어 온 모든 인수에 접근
2. 한수내에서 이용 가능한 지역 변수
3. length / index
4. array 형태의 객체
5. 배열의 내장 메서드 없음 (forEach, map)
function showname(name) {
console.log(arguments.length);
console.log(arguments[0]);
console.log(arguments[1]);
}
showName("Mike", "Tom");
//2
// "Mike"
// "Tom"
나머지 매개변수
function showName(...names) {
console.log(names);
}
showName(); // []
showName("Mike"); // ["Mike"]
showName("Mike", "Tom"); // ["Mike", "Tom"]
전달 받은 모든 수를 더해야함
function add(...number) {
let result = -number.forEach((num) => {
result += num;
});
console.log(result);
//6
//55
}
function add(...number) {
let result = number.reduce((prev, cur) => {
prev + cur;
});
console.log(result);
//6
//55
}
add(1, 2, 3);
add(1, 2, 3, 4, 5, 6, 7, 8, 9, 10);
user 객체르 만들어 주는 생성자 함수를 만든다
function User(name, age, ...skill) {
this.name = name;
this.age = age;
this.skills = skills;
} // 나머지 매개변수는 마지막에 있어야한다
const user1 = new user("Mike", 30, "html", "css");
const user2 = new user("Mike", 20, "js", "React");
const user2 = new user("Mike", 10, "English");
전개구문 : 배열
let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let result = [...arr1, ...arr2];
// result = [1,2,3,4,5,6]
let result = [0, ...arr1, ...arr2, 7, 8, 9];
// result = [0,1,2,3,4,5,6,7,8,9]
arr.push() / arr.splice()/ arr.concat() 대신사용한다
let arr = [1, 2, 3];
let arr2 = [...arr]; //[1,2,3]
let user = { name: "Mike", age: 30 };
let user2 = { ...user };
user2.name = "Tom";
// user.name = 'Mike'
// user2.name = 'Tom'
복제가 가능하다
arr1 을 [4,5,6,1,2,3]으로
let arr1 = [1,2,3]
let arr2 = [4,5,6]
arr2.reverse().forEach((num) => {
arr1.unshift(num)
//[6,5,4,1,2,3] 차례대로 앞으로 들어가기 떄문에 숫자를 역순으로 바꾸어준다 .reverse
//[4,5,6,1,2,3]
});
전개구문을 이용하면 간단하게 가능하다
arr1 = [...arr2, ...arr1]
//[4,5,6,1,2,3]
-------------------------------------------
let user = { name: "Mike" };
let info = { age: 30 };
let fe = ["JS", "React"];
let lang = ["korea", "English"];
user = Object.assign({}, user, info, {
skills: [],
});
{
name: "Mike";
age: 30;
}
fe.forEach((item) => {
user.skills.push(item);
});
lsng.forEach((item) => {
user.skills.push(item);
});
{
name: "Mike";
age: 30;
skills: ["JS", "React", "korea", "English"];
}
전개 구문을 사용할시 위에를 간단하게 사용가능
user = {
...user,
...info,
skills: [...fe, ...lang],
};