TIP 2: let과 const로 유효 범위 충돌을 줄여라

let:

 

• 변수를 반드시 재할당해야 하는 경우에 사용 (var과의 공통점)
• 블록 유효범위를 따름, 변수를 선언한 중괄호를 안에서만 적용 (var과의 차이점)

 

---

예제코드

 

function getLowestPrice(item) {
  var count = item.inventory; // <label id="sale.count1"/>
  var price = item.price;

  if (item.salePrice) {
    var count = item.saleInventory; // <label id="sale.count2"/>
    if (count > 0) {
      price = item.salePrice;
    }
  }

  if (count) { // <label id="sale.if2"/>
    return price;
  }

  return 0;
}

위의 코드에서는 var를 사용하여 count라는 같은 이름의 변수를 재할당해주어 버그가 난다. 

 

 

function getLowestPrice(item) {
  let count = item.inventory;
  let price = item.price;

  if (item.salePrice) {
    let count = item.saleInventory;
    if (count > 0) {
      price = item.salePrice;
    }
  }

  if (count) {
    return price;
  }

  return 0;
}

위의 경우, if 블록 안에서 let (item.saleInventory)으로 count를 선언했기에

함수를 시작 할 때 선언한 변수 count (item.inventory)와 충돌하지 않는다.

 

 

const도 블록 내에서 유효한 변수 선언 방법으로 사용될 수 있다.

위의 코드에서는 count를 재할당하지 않기 때문에 let 대신에 const를 사용하는 게 더 간결하다. 

const를 사용한 코드는 아래와 같다. 

 

function getLowestPrice(item) {
  const count = item.inventory;
  let price = item.price;

  if (item.salePrice) {
    const saleCount = item.saleInventory;
    if (saleCount > 0) {
      price = item.salePrice;
    }
  }

  if (count) {
    return price;
  }

  return 0;
}

 

*추가로, let과 const는 같은 이름의 변수를 다시 선언할 수 없다는 점을 잘 기억해두자!

(var는 같은 변수를 선언해도 충돌이 나지 않는다. 따라서 더 혼란을 줄 수 있다.)