2022-03-09 노션페이지,
2022-04-17 노션페이지
기록된 노션을 다시 정리
헷갈렸던 부분
매개변수 기본값 설정 시 length 객체에 영향을 주지 않는다
당시 내가 이해한 영향을 주지 않는다는 말
- 기본값을 사용해도 원래 length값이 변하지 않는다.
ex)function sum(x = 0, y = 0) {return x + y;}
// 2개라 생각했지만 틀림
=> 올바른 뜻: length객체에 제외되므로 영향을 주지 않는다는 뜻일반객체는 이터러블이 아니지만 spread를 사용할 때
1. 매개변수 기본값
기존의 ES5에선 매개변수에 값을 입력하지 않거나 인수가 부족한 경우,
매개변수의 값은 undefined이다.function sum(x, y) { return x + y; } console.log(sum(1)); // NaN기본값 사용 이유
- 그렇기에 매개변수에 적절한 인수가 전달되었는지 함수 내부에서 확인할 필요가 있었다.
- 하지만 ES6에서 매개변수 기본값을 사용하므로 함수 내에서 수행하던 인수 체크 및 초기화를 간소화할 수 있게 되었다.
function sum(x = 0, y = 0) { return x + y; } console.log(sum(1)); // 1 console.log(sum(1, 2)); // 3!! 매개변수에 기본값 사용을 했을 경우 length프로퍼티
기본값이 있는 첫 번째 매개변수까지만 매개변수를 계산을 한다.
// defining a function with default parameter function func3(a, b = 10, c) { } // only parameters before the one with // default value are counted console.log(func3.length);
2. Rest 파라미터 (...rest)
지정한 매개변수 외에 나머지 매개변수들을 배열로 묶어버리는 것
나머지의 값을 받기 때문에 마지막에 사용하여야 함function foo(param, ...rest) { console.log(param); // 1 console.log(rest); // [ 2, 3, 4, 5 ] } foo(1, 2, 3, 4, 5); console.log(foo.length) // 1매개변수에 Rest 파라미터 사용을 했을 경우 length프로퍼티
Rest 파라미터도 기본값 사용과 마찬가지로 length 프로퍼티에 영향을 주지 않는다.
Rest파라미터 사용이유
- 기존에 사용했던 arguments는 유사배열이므로 배열로 변경하기위해 번거로움이 있었지만, Rest 파라미터는 배열로 바로 전달 받을 수 있어 간편함
- 화살표 함수에는 arguments객체가 없다.
3. Spread 문법
정말 간편한 문법인 것 같다!
- Spread 문법은 대상을 개별 요소로 분리한다.
- 사용 조건으로 Spread 문법의 대상은 이터러블이어야 한다.
// ...[1, 2, 3]는 [1, 2, 3]을 개별 요소로 분리한다(→ 1, 2, 3) console.log(...[1, 2, 3]) // 1, 2, 3앞에서 살펴본 Rest 파라미터도 Spread 문법을 사용을 한 것 이다.
Rest파라미터는 분해된 요소들을 모으고
Spread는 모여있는 요소들을 분해한다라고 생각하면 편하다.
일반객체에서도 spread 사용
일반 객체는 이터러블이 아니다.
이때, 일반 객체도 spread 문법을 사용할 수 있는 이유는,
객체 리터럴(Object Literal)이 이터러블 객체로 간주되기 때문// 이터러블이 아닌 일반 객체는 Spread 문법의 대상이 될 수 없다. console.log(...{ a: 1, b: 2 }); // TypeError: Found non-callable @@iterator --------------------------------------------- // 객체 이터럴 안에서 사용 const obj1 = { x: 1, y: 2 }; const obj2 = { ...obj1, z: 3 }; console.log(obj2); // { x: 1, y: 2, z: 3 }
