코딩/JavaScript

자바스크립트의 변수

tomsdaily 2024. 6. 23. 22:41
반응형

자바스크립트(JavaScript)는 웹 개발에서 널리 사용되는 프로그래밍 언어로, 변수는 데이터를 저장하고 조작하는 데 중요한 역할을 합니다. 이번 글에서는 자바스크립트에서 변수를 선언하고 사용하는 방법에 대해 자세히 알아보겠습니다.

변수 선언

자바스크립트에서 변수를 선언하는 방법은 크게 세 가지가 있습니다: var, let, const입니다. 이 세 가지 키워드는 각각의 특성과 사용 용도가 다릅니다.

1. var

var 키워드는 ES6(ECMAScript 2015) 이전에 변수를 선언하는 유일한 방법이었습니다. var로 선언된 변수는 함수 스코프를 가지며, 중복 선언이 가능합니다.

var name = "Alice";
console.log(name); // "Alice"

var name = "Bob";
console.log(name); // "Bob"

var는 호이스팅(hoisting)이라는 특성을 가지는데, 이는 변수를 선언하기 전에 사용할 수 있게 합니다. 다만, 초기화되기 전의 값은 undefined입니다.

console.log(age); // undefined
var age = 25;
console.log(age); // 25

2. let

let 키워드는 ES6에서 도입된 변수 선언 방법으로, 블록 스코프(block scope)를 가집니다. 이는 변수가 선언된 블록 내에서만 유효함을 의미합니다.

let city = "Seoul";
console.log(city); // "Seoul"

{
    let city = "Busan";
    console.log(city); // "Busan"
}

console.log(city); // "Seoul"

let으로 선언된 변수는 중복 선언이 불가능하며, 호이스팅은 되지만 초기화되기 전에는 접근할 수 없습니다.

console.log(country); // ReferenceError: Cannot access 'country' before initialization
let country = "Korea";
console.log(country); // "Korea"

3. const

const 키워드도 ES6에서 도입된 변수 선언 방법으로, let과 마찬가지로 블록 스코프를 가집니다. const로 선언된 변수는 재할당이 불가능하며, 선언과 동시에 초기화해야 합니다.

const language = "JavaScript";
console.log(language); // "JavaScript"

// language = "Python"; // TypeError: Assignment to constant variable.

const는 객체나 배열을 선언할 때도 사용됩니다. 객체나 배열 자체는 재할당할 수 없지만, 객체의 속성이나 배열의 요소는 변경할 수 있습니다.

const user = {
    name: "Alice",
    age: 25
};

user.age = 26; // 가능
console.log(user.age); // 26

const numbers = [1, 2, 3];
numbers.push(4); // 가능
console.log(numbers); // [1, 2, 3, 4]

변수 스코프

변수 스코프는 변수가 유효한 범위를 의미합니다. 자바스크립트에서는 주로 두 가지 스코프가 있습니다: 함수 스코프와 블록 스코프.

함수 스코프

var 키워드로 선언된 변수는 함수 스코프를 가집니다. 이는 변수가 함수 내에서만 유효함을 의미합니다.

function greet() {
    var message = "Hello";
    console.log(message); // "Hello"
}

greet();
// console.log(message); // ReferenceError: message is not defined

블록 스코프

let과 const 키워드로 선언된 변수는 블록 스코프를 가집니다. 이는 변수가 선언된 블록 내에서만 유효함을 의미합니다.

{
    let blockScoped = "I'm block scoped";
    const anotherBlockScoped = "I'm also block scoped";
    console.log(blockScoped); // "I'm block scoped"
    console.log(anotherBlockScoped); // "I'm also block scoped"
}

// console.log(blockScoped); // ReferenceError: blockScoped is not defined
// console.log(anotherBlockScoped); // ReferenceError: anotherBlockScoped is not defined

결론

자바스크립트의 변수는 데이터를 저장하고 조작하는 데 중요한 역할을 합니다. var, let, const 키워드를 통해 변수를 선언할 수 있으며, 각 키워드의 특성과 사용 용도를 이해하는 것이 중요합니다. 이를 통해 보다 안전하고 효율적인 코드를 작성할 수 있습니다.

이번 글에서는 자바스크립트 변수의 기본 개념과 선언 방법, 스코프에 대해 알아보았습니다. 자바스크립트의 변수를 잘 활용하여 더욱 깔끔하고 유지보수하기 쉬운 코드를 작성하시기 바랍니다.

이 글이 자바스크립트 변수를 이해하는 데 도움이 되길 바랍니다. 질문이나 추가적인 피드백이 있다면 언제든지 댓글로 남겨주세요!

 
반응형