728x90
Default Value
값을 할당하지 않으면 디폴트 값(사전에 정의된 값)을 할당한다.
// 할당된 값이 없을 경우
const [one, two, five = 50] = [10, 20];
console.log(five) // 50
// 할당된 값이 있을 경우
const [one, two, five = 50] = [10, 20, 70];
console.log(five) // 70
아래의 경우 오른쪽 one의 값인 10이 왼쪽 one 프로퍼티의 값으로 분할 할당된다.
const [one, two = one + 20, five = two + 50] = [10]
console.log(two) // 30
console.log(five) // 80
파라미터에서도 동일하다.
ten에 10이 설정되고, two에는 디폴트 값인 20이 할당된다.
만약 two에 디폴트 값을 설정하지 않는다면 two에 undefined가 뜬다.
디폴트 값이 있지만 넘겨 받은 파라미터 값이 있다면 디폴트 값은 무시된다.
// 넘겨 받은 파라미터 값이 없고 디폴트 값이 있을 경우
const add = (ten, two = 20) => ten + two;
const result = add(10);
console.log(result) // 30
// 넘겨 받은 파라미터 값이 있고 디폴트 값이 있을 경우
const add = (ten, two = 20) => ten + two;
const result = add(10, 50);
console.log(result) // 60
파라미터 값이 undefined라면 없는 것과 같다.
함수 point를 실행하면 20이 나오는데 one은 넘겨 받은 파라미터가 10이니 10이 설정된다.
하지만 two는 전달 받은 파라미터가 undefined라서 없는 것과 같아지는데, point 함수 실행 값이 디폴트 값으로 설정되어 있다.
const point = () => 20;
const add = (one, two = point()) => one + two;
const result = add(10, undefined);
console.log(result) // 30
728x90
'👋🏻 JavaScript > 📖 자바스크립트 ES6+' 카테고리의 다른 글
[JS] Number 오브젝트를 알아보자 (0) | 2023.06.19 |
---|---|
[JS] getter, setter를 알아보자 (0) | 2023.06.15 |
[JS] 구조 분해 할당을 알아보자2 (0) | 2023.06.15 |
[JS] Iteration(이터레이션)을 알아보자 (0) | 2023.06.14 |
[JS] 구조 분해 할당을 알아보자 (0) | 2023.06.13 |