[ES6] const,let 정하는 방법

권준혁·2020년 11월 1일
0

javascript

목록 보기
2/19
post-thumbnail
post-custom-banner

const와 let의 사용시기에 대해 알아보겠습니다.

  • MDN문서에서의 정의 ( const, let )

    • const (constant) 선언은 블록 범위의 상수를 선언합니다. 상수의 값은 재할당할 수 없으며 다시 선언할 수도 없습니다.
    • let 구문은 블록 유효 범위를 갖는 지역 변수를 선언하며, 선언과 동시에 임의의 값으로 초기화할 수도 있습니다.

결론부터 밝히면
'const를 주로 사용하고 let을 필요시에만 사용한다'
입니다.

왜 그렇게 해야 할 까요?
const를 사용할 때의 이점이 있기 때문입니다.
가장 큰 이유는 const가 재할당이 안돼
코드의 가독성이 향상되기 때문입니다.

예제 코드를 보겠습니다.
상품 가격을 인수로 받아 총 금액을 리턴하는 함수입니다.

 function calculate (price) {
    let taxRate = 0.1
    let shipping = 5.00
    // ★
    let total = price + ( 100 * taxRate ) + shipping;
    return total
}

몇 줄 안되는 코드기 때문에 큰 문제는 없어보입니다.
하지만 코드가 // ★ 부분에 100줄이상의 코드를 추가해야 한다면 수정할 필요가 있습니다.

 function calculate (price) {
    const taxRate = 0.1
    const shipping = 5.00
    // ★
    let total = price + ( 100 * taxRate ) + shipping;
    return total
}

재할당이 필요없는 부분을 const로 수정했습니다.
코드를 처음 보는 사람이더라도 이제 변경되는 부분을 예측할 수 있게 되었습니다.
재할당 가능성이 있는 let에 좀 더 집중할 수 있습니다.

이렇게 드물게 let을 사용하면 가독성을 높힐 수 있습니다.

하지만 const도 불변값이 아닐 수 있습니다.

    const a = []
    a.push('something')
     console.log(a)    // a의 결과값?

const는 재할당할 수 없습니다.
하지만 조작(mutation)은 가능합니다.
a의 결과값은 ['something'] 이 됩니다.
Array.prototype.push() 등의 조작하는 함수는 예상치 못한 결과를 낼 수 있기 때문에 피하는 것이 좋습니다.


이 후에 조작하지 않고 배열을 다루는 방법에 대해 포스팅 하겠습니다.

profile
웹 프론트엔드, RN앱 개발자입니다.
post-custom-banner

0개의 댓글