자바스크립트 var, let 및 const

키워드 var , let 및 const는 무엇을 합니까?
이 키워드는 JavaScript에서 변수를 선언하는 데 사용됩니다.

var firstName = 'Bob';
let lastName = 'Bobson';
const age = 20;

let 및 var 모두 선언 후 값을 변경할 수 있으며 값 없이 초기화할 수 있습니다. const로 선언된 변수는 변경할 수 없으며 변수를 선언할 때 값을 할당해야 합니다.

var firstName = 'Bob';
let lastName = 'Bobson';
const age = 20;

firstName = 'John'; // Runs without issue 
lastName = 'Smith'; // Runs without issue
age = 80; // Causes TypeError: Assignment to constant variable.

// Variables declared without assigning a value

let firstName; //Runs without issue
var lastName; // Runs without issue
const age; // Causes SyntaxError: Missing initializer in const declaration

주의할 몇 가지 사항const

변수가 개체인 경우 개체 속성 값을 변경할 수 있으며 추가 속성도 추가할 수 있습니다. 변수를 재할당할 수 없습니다.

변수가 배열인 경우 배열의 값이 변경될 수 있지만 변수를 재할당할 수는 없습니다.

때때로 const 변수가 모두 대문자로 쓰여진 것을 볼 수 있습니다 const PORT = 8080 . 이것은 스타일 선택입니다.

// Objects
const obj = {
  firstName: 'Bob',
};

obj.firstName = 'John'; // Runs without issue
obj.lastName = 'Bobson'; // Runs without issue
delete obj.firstName; // Runs without issue
obj = {}; // Causes TypeError: Assignment to constant variable.

// Arrays
const arr = [1, 2, 3];
arr.push(4); // Runs without issue
arr = []; // Causes TypeError: Assignment to constant variable.

범위 이해
JavaScript에는 세 가지 유형의 범위가 있습니다. 변수의 범위는 프로그램의 다른 부분이 변수에 액세스할 수 있는지 결정합니다.

기능 범위

블록 스코프

글로벌 범위

기능 범위
함수 내에서 선언된 변수는 기능적 범위를 갖습니다. 변수를 var , let 또는 const 로 선언하든 상관없이 변수는 선언된 함수 내에서만 액세스할 수 있습니다.

// Function Scope
function doSomething() {
  var firstName = 'Bob';
  let lastName = 'Bobson';
  const age = 20;
}
doSomething();

console.log(firstName);
console.log(lastName);
console.log(age);

// The three variables are not accessible outside of 
// the function so they cause a ReferenceError

블록 범위{} 에 코드를 래핑하여 블록 범위를 만들 수 있습니다. let 및 const 둘 다 정의된 블록 외부에서 액세스할 수 없습니다. 반면에 var는 정의된 블록 외부에서 액세스할 수 있습니다.

// Block Scope
{
  var firstName = 'Bob';
  let lastName = 'Bobson';
  const age = 20;
}

console.log(firstName); // Will run
console.log(lastName); // Causes ReferenceError: lastName is not defined
console.log(age); // Causes ReferenceError: age is not defined

블록 범위 지정은 for-loops 에서도 볼 수 있습니다.

for (var x = 0; x < 10; x++) {
  console.log(x);
}

console.log(x);
// Runs without issues

for (let x = 0; x < 10; x++) {
  console.log(x);
}

console.log(x);
// Causes ReferenceError: x is not defined

글로벌 범위
기능 범위 및 블록 범위 외부에서 선언된 변수입니다. JavaScript 프로그램에서 전역적으로 액세스할 수 있습니다. 이와 같이 제한된 수의 변수를 선언하는 것이 좋습니다. JavaScript 프로그램에 많은 전역 변수가 있으면 프로그램이 더 복잡해짐에 따라 예상치 못한 버그가 발생할 수 있습니다.

var firstName = 'Bob';
let lastName = 'Bobson';
const age = 20;

// Function Scope
function doSomething() {
  console.log(firstName);
  console.log(lastName);
  console.log(age);
}
doSomething();

// Block Scope
{
  console.log(firstName);
  console.log(lastName);
  console.log(age);
}

// Prints the variables without any errors

주요 내용

var를 사용하지 말고 let 및 const를 대신 사용하십시오. var는 블록 범위 지정이 아니므로 프로그램에 예기치 않은 버그가 발생할 수 있습니다.

값이 변경되지 않을 것임을 알고 있는 경우 const를 사용하십시오. 값이 변경될 때let 사용

더 많은 정보는 MDN 문서에서 찾을 수 있습니다:

var

let

const

질문이나 피드백이 있으면 댓글을 남겨주세요.