2. 변수와 데이터 타입

#1  변수 선언과 할당

변수 선언과 할당은 자바스크립트에서 매우 중요한 개념 중 하나입니다. 이를 코드 예시를 통해 살펴보겠습니다.

자바스크립트에서 변수는 var, let, const 키워드를 이용하여 선언할 수 있습니다. var 키워드는 이전에는 변수를 선언하는 키워드로 많이 사용되었지만, ES6에서 let과 const가 추가되면서 현재는 잘 사용되지 않습니다.

예를 들어, 다음과 같이 변수 num을 선언하고 값을 할당해보겠습니다.

var num = 10;
console.log(num); // 10

변수 num을 선언하고 값 10을 할당하였습니다. 이렇게 선언된 변수는 해당 스코프 내에서 사용할 수 있습니다. 만약 함수 내에서 선언된 변수라면, 그 함수 내에서만 사용할 수 있습니다.

변수를 선언하면, 이 변수에 다른 값을 할당할 수도 있습니다. 이를 재할당이라고 합니다. 예를 들어, 다음과 같이 변수 num에 값을 다시 할당해보겠습니다.

num = 20;
console.log(num); // 20

이렇게 하면 변수 num에는 20이 할당됩니다.

let과 const는 var와 유사하지만, 블록 스코프를 가지기 때문에 var와는 차이가 있습니다. 예를 들어, 다음과 같이 let을 이용하여 변수를 선언하고 값을 할당해보겠습니다.

let name = 'John';
console.log(name); // John

let으로 선언된 변수는 블록 스코프를 가지기 때문에, 함수 내에서 선언된 변수와 마찬가지로 해당 블록 내에서만 사용할 수 있습니다.

const는 let과 마찬가지로 블록 스코프를 가지지만, 한 번 할당한 값은 변경할 수 없습니다. 예를 들어, 다음과 같이 const로 선언된 변수를 선언하고 값을 할당해보겠습니다.

const PI = 3.141592653589793;
console.log(PI); // 3.141592653589793

const로 선언된 변수는 한 번 할당한 값은 변경할 수 없기 때문에, 이후에 다른 값을 할당하려고 하면 에러가 발생합니다.

 

const PI = 3.141592653589793;
PI = 3.14; // TypeError: Assignment to constant variable.

이와 같이 변수 선언과 할당은 자바스크립트에서 매우 중요한 개념입니다. 변수를 적절하게 활용하면, 좀 더 효율적인 코드 작성이 가능합니다.

 

#2  데이터 타입과 자료형 변환

자바스크립트에서는 다양한 데이터 타입을 지원합니다. 자바스크립트에서는 데이터 타입을 명시적으로 선언하지 않고, 변수에 할당된 값에 따라서 자동으로 데이터 타입이 결정됩니다. 이를 동적 타이핑(dynamic typing)이라고 합니다.

아래는 데이터 타입을 예시로 든 코드입니다.

// Number
let num = 123;
console.log(typeof num); // 출력: "number"

// String
let str = "hello";
console.log(typeof str); // 출력: "string"

// Boolean
let bool = true;
console.log(typeof bool); // 출력: "boolean"

// Null
let nul = null;
console.log(typeof nul); // 출력: "object" (주의!)

// Undefined
let und;
console.log(typeof und); // 출력: "undefined"

// Object
let obj = { name: "John", age: 30 };
console.log(typeof obj); // 출력: "object"

// Array
let arr = [1, 2, 3];
console.log(typeof arr); // 출력: "object"

// Function
let func = function() {
  console.log("Hello!");
}
console.log(typeof func); // 출력: "function"

 

위 코드에서 typeof 연산자를 사용하면 변수의 데이터 타입을 확인할 수 있습니다. null의 경우 typeof 연산자를 사용하면 "object"가 출력됩니다. 이는 자바스크립트 언어의 설계 결함으로 인해 발생한 문제입니다. 따라서 null의 데이터 타입을 확인하려면 별도의 처리가 필요합니다.

 

동적 타이핑으로 인해 변수의 데이터 타입은 언제든지 변경될 수 있습니다. 이를 자료형 변환(type conversion)이라고 합니다.

예를 들어, 문자열과 숫자 간의 연산을 하면 자바스크립트는 자동으로 숫자를 문자열로 변환하여 연산을 수행합니다. 이를 암시적 자료형 변환(implicit type conversion)이라고 합니다.

 

let num = 10; // 숫자 타입의 변수 선언 및 할당
let str = '20'; // 문자열 타입의 변수 선언 및 할당

console.log(num + str); // 1020 (num이 문자열로 변환된 후 연산이 수행됨)
console.log(typeof(num + str)); // string (연산 결과의 타입은 문자열임)

 

반면에, 명시적으로 데이터 타입을 변환하는 경우도 있습니다. 이를 명시적 자료형 변환(explicit type conversion)이라고 합니다. 자바스크립트에서는 Number(), String(), Boolean()과 같은 함수를 이용하여 명시적으로 데이터 타입을 변환할 수 있습니다.

 

let num = 10; // 숫자 타입의 변수 선언 및 할당
let str = '20'; // 문자열 타입의 변수 선언 및 할당

console.log(num + Number(str)); // 30 (str을 숫자로 명시적으로 변환한 후 연산이 수행됨)
console.log(typeof(num + Number(str))); // number (연산 결과의 타입은 숫자임)