Javascript JS arguments, 나머지 매개변수, 전개 구문(Rest parameters, Spread syntax)

arguments - 나머지 매개변수가 없을때 사용했다. 지금은 잘 사용하지 않음

• 함수로 넘어 온 모든 인수에 접근
• 함수내에서 이용 가능한 지역 변수
• length / index
• Array 형태의 객체
• 배열의 내장 메서드 없음 (forEach, map) 사용 불가

// arguments 사용
function showName(name) {
  console.log(arguments.length);
  console.log(arguments[0]);
  console.log(arguments[1]);
}
showName('Mike', 'Tom'); // 각각 2, 'Mike', 'Tom' 이 출력됨

 

나머지 매개변수(Rest parameters) - 주의 나머지 매개변수는 항상 끝에 들어가야함.

// 나머지 매개변수
// ex 1)
function showName(...names) {
  console.log(names);
}
showName('Mike', 'Tom'); // 결과, ["Mike","Tom"]

// ex 2) forEach 활용
function add(...nums) {
  let result = 0;
  nums.forEach((num) => (result += num));
  console.log(result);
}
add(1,2,3);
add(1,2,3,4,5,6,7,8,9,10);

// ex3) reduce 활용
function add2(...nums) {
  let result = nums.reduce((prev, cur) => prev + cur);
  console.log(result);
}
add2(1,2,3);
add2(1,2,3,4,5,6,7,8,9,10);

// ex4)
function User(name, age, ...skills) {
  this.name = name;
  this.age = age;
  this.skills = skills;
}
const user1 = new User('Mike', 30, 'html', 'css');
const user2 = new User('Mike', 30, 'JS', 'React');
const user3 = new User('Mike', 30, 'English');
console.log(user1);
console.log(user2);
console.log(user3);

 

전개 구문(Spread syntax)

// 전개 구문 : 배열
let arr1 = [1,2,3];
let arr2 = [4,5,6];
let result = [0, ...arr1, ...arr2, 7, 8, 9]; // [0,1,2,3,4,5,6,7,8,9]

// 전개 구문 : 배열 복제
let arr = [1,2,3];
let arrCopy = [...arr]; // [1,2,3]

// 전개 구문 : 객체 복제
let user = {name:'Mike', age:30};
let user2 = {...user};
user2.name = "Tom";
console.log(user.name); // 결과, "Mike"
console.log(user2.name); // 결과, "Tom"