자료형

🧩 선언

---

JavaScript의 선언 방법은 3가지 이다.

 

키워드	설명
var	변수를 선언, 동시에 값을 초기화
let	블록 스코프 지역 변수를 선언, 동시에 값을 초기화
const	블록 스코프 읽기 전용 상수를 선언

 

1️⃣ Var (function scope)

 

var 문에서 변수에 초기 값을 지정하지 않는다면, 변수는 값이 설정될 때 까지 undefined 값을 가진다.

 

👀 함수 유효 범위

어떤 함수 안에서 선언된 모든 변수는 그 함수 전체에 걸쳐 유효하다.

• 변수가 선언되기 전에도 유효

 

Hoisting

자바스크립트 코드는 함수 안에 모든 변수를 함수의 맨 위로 끌어올린 것처럼 동작한다.

var foo = "boo";
function test() {
   console.log(foo); // boo가 아닌 undefined을 출력
   var foo = "foo";
   console.log(foo); // "foo"
}

// 실제 실행되는 코드
function test() {
   var foo;
   console.log(foo); // undefined
   foo = "foo";
   console.log(foo); // "foo"
}

 

2️⃣ let (block scope)

 

👀 블록 유효 범위

 

let은 변수가 선언된 블록, 구문 또는 표현식 내에서만 유효한 변수를 선언한다.

var 키워드가 블록 범위를 무시하고 전역 변수나 함수 지역 변수로 선언되는 것과 다른 점이다.

 

if (true) {
   let x = 5;
}

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

 

 

❌ Hoisting

function test() {
   console.log(foo); // Reference Error 발생
   let foo = "foo";
   console.log(foo); // "foo"
}

test(); // ReferenceError: Cannot access 'foo' before initialization

 

3️⃣ const (block scope)

 

블록 범위의 상수를 선언

 

상수의 값은 재할당할 수 없으며 다시 선언할 수도 없다.

• 따라서, 처음 선언시 반드시 초기화를 해주어야 한다.

function test() {
  console.log(foo);
  const foo = "foo";
}

test(); // ReferenceError: Cannot access 'foo' before initialization

 

📍 함수 호이스팅

 

함수에서는 함수 선언으로는 호이스팅이 되지만, 함수 표현식으로는 호이스팅 되지 않는다.

/* 함수 선언으로 호이스팅 하기 */

foo(); // "bar"

function foo() {
    console.log("foo");
}

boo(); // TypeError: boo is not a function

var boo = function () {
    console.log("boo");
};

 

🤖 데이터 구조 및 형

---

 

8가지 데이터 형을 정의

• 7가지 원시 데이터 형 + Object

 

원시 데이터 형

데이터 형	설명
Boolean	true, false
null	null 값을 나타내는 키워드
undefined	값이 정의되어 있지 않은 최상위 속성
Number	정수 또는 실수형 숫자
BigInt	임의 정밀도의 실수. 예) 9007199254740992n
String	문자열
Symbol	인스턴스가 고유하고 불변인 데이터 형

 

🌀 자료형 변환

 

JavaScript는 동적 형지정 언어이다.

• 변수를 선언 시, 데이터 형을 지정할 필요가 없다.
• 데이터 형이 필요에 의해 자동으로 변환된다.

var answer = 1;
console.log(answer); // 1

answer = "Test";
console.log(answer); // "Test"

• 동적 형지정 언어이므로, 오류 메시지가 발생하지 않는다.

 

📌 숫자와 ‘+’ 연산자

 

숫자와 문자열 사이에 + 연산자를 포함한 식에서 JS는 숫자를 문자열로 변환한다.

var x = "Test : " + 3; // "Test : 3"

 

 

⚠️ 다른 연산자를 포함한 식은 숫자 값을 문자열로 변환하지 않는다.

var x = "37" - 7; // 30
var y = "37" + 7; // 377

 

📖 참고자료

문법과 자료형 - JavaScript | MDN

Literal (리터럴) - MDN Web Docs 용어 사전: 웹 용어 정의 | MDN

변수 선언