> 웹 프론트엔드 > JS 튜토리얼 > JavaScript의 요일별 변수: 실제 사례를 통해 'const', 'let' 및 'var' 이해하기

JavaScript의 요일별 변수: 실제 사례를 통해 'const', 'let' 및 'var' 이해하기

WBOY
풀어 주다: 2024-08-31 06:32:32
원래의
730명이 탐색했습니다.

Day astering Variables in JavaScript: Understanding `const`, `let`, and `var` with Real-World Examples.

JavaScript로 작업할 때 가장 먼저 배우게 되는 것 중 하나는 변수 선언 방법입니다. 변수는 숫자, 텍스트 또는 복잡한 데이터와 같은 정보를 저장하는 컨테이너와 같습니다. JavaScript에서는 변수를 선언하는 방법이 const, let, var 세 가지가 있습니다. 이들 각각에는 고유한 규칙과 모범 사례가 있어 처음에는 다소 혼란스러울 수 있습니다. 이번 게시물에서는 각각의 사용 시기와 방법을 이해하는 데 도움이 되도록 간단한 예를 들어 설명하겠습니다.

예제 코드

간단한 코드부터 살펴보겠습니다.

`자바스크립트
const accountId = 14423;
var accountEmail = "aman@google.com";
accountPassword = "12345";
accountCity = "jamshedpur";
계정 롤을 시키세요;

// accountId = 13242; // 허용되지 않음 - 오류가 발생합니다

console.table([accountEmail, accountId, accountRoll, accountPassword]);
`

const 이해

우리가 선언한 첫 번째 변수는 const를 사용하는 accountId입니다. const 키워드는 값이 절대 변하지 않는 변수를 선언하려는 경우에 사용됩니다. const 변수에 값을 할당하면 다른 변수에 다시 할당할 수 없습니다. 예:

const accountId = 14423;
accountId = 13242; // This will throw an error!
로그인 후 복사

위 예에서 const 변수는 초기 할당 후에는 변경할 수 없기 때문에 accountId를 다시 할당하려고 하면 오류가 발생합니다.

const에 대한 주요 사항:

  • 재할당 불가: const 변수에 값이 할당되면 변경할 수 없습니다.
  • 블록 범위: 변수는 선언된 블록 내(예: {} 내)에서만 액세스할 수 있습니다.

이해하자

다음으로 let을 사용하여 accountPassword를 선언했습니다. 나중에 값이 변경될 수 있는 변수를 선언하려는 경우 let 키워드가 사용됩니다. const와 달리 let 변수를 다시 할당할 수 있습니다.

let accountPassword = "12345";
accountPassword = "67890"; // This is perfectly fine!
로그인 후 복사

그러나 const와 마찬가지로 let도 블록 범위이므로 선언된 블록 내에서만 액세스할 수 있습니다.

let의 핵심 사항:

  • 재할당 가능: 할당된 후에 let 변수의 값을 변경할 수 있습니다.
  • 블록 범위: 변수는 선언된 블록 내에서만 액세스할 수 있습니다.

var 이해

마지막으로 accountEmail을 선언한 var에 대해 이야기해 보겠습니다. var는 JavaScript에서 변수를 선언하는 오래된 방법입니다. let 및 const와 비교할 때 몇 가지 주요 차이점이 있습니다.

var accountEmail = "aman@google.com";
var accountEmail = "john@google.com"; // This is allowed!
로그인 후 복사

보시다시피 let, const와 달리 동일한 범위에서 var 변수를 오류 없이 다시 선언할 수 있습니다. 이는 때때로 버그와 예상치 못한 동작으로 이어질 수 있으며, 이것이 바로 많은 개발자가 let과 const를 선호하는 이유입니다.

var에 대한 핵심 사항:

  • 재할당 및 재선언 가능: 값을 변경하고 var 변수를 재선언할 수도 있습니다.
  • 함수 범위: 블록 범위인 let 및 const와 달리 var는 함수 범위입니다. 즉, 선언된 함수 내에서 액세스할 수 있지만 블록에만 국한되지는 않습니다.

빠른 비교

차이점을 요약하여 간단히 비교해 보겠습니다.

{
    var x = 10;
    var x = 20; // Allowed, no error

    let y = 10;
    let y = 20; // Not allowed, will throw a syntax error
}
로그인 후 복사

실제 예: console.table 사용

코드 끝에서 console.table을 사용하여 깔끔한 테이블 형식으로 변수 값을 표시합니다.

console.table([accountEmail, accountId, accountRoll, accountPassword]);
로그인 후 복사

accountEmail, accountId, accountRoll 및 accountPassword의 현재 값이 포함된 테이블을 출력합니다. 디버깅하거나 작업을 확인할 때 변수를 시각화하는 편리한 방법입니다.

결론

깨끗하고 버그 없는 JavaScript 코드를 작성하려면 const, let 및 var의 차이점을 이해하는 것이 중요합니다. 간단히 요약하자면 다음과 같습니다.

  • 변수를 일정하게 유지하려면 const를 사용하세요.
  • 변수 값이 변경될 것으로 예상되는 경우 let을 사용하세요.
  • (함수 범위 동작으로 인해) 특별한 이유가 없는 한 var를 사용하지 마세요.

이 세 가지 키워드를 마스터하면 더욱 안정적이고 유지 관리가 쉬운 JavaScript 코드를 작성할 수 있습니다. 더 자세한 내용은 언제든지 MDN 문서를 참조하세요.

코딩 잘 하시고 다음편에서 만나요!!

위 내용은 JavaScript의 요일별 변수: 실제 사례를 통해 'const', 'let' 및 'var' 이해하기의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:dev.to
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿