[JavaScript] 변수(variable), 데이터 타입

seonjeong·2023년 1월 30일
0

JavaScript

목록 보기
1/8
post-thumbnail

💖 변수(variable)

: 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름

🔥 var

특징
1. 변수 중복 선언 허용
2. 함수 레벨 스코프
3. 변수 호이스팅

// 변수 중복 선언 허용
var x = 1;
var y = 1;

var x = 100;
// 초기화문이 없는 변수 선운문은 무시된다
var y;

console.log(x);	// 100
console.log(y);	// 1

// 함수 레벨 스코프
var x = 1;
if(true) {
  	// 함수 외부에서 선언한 변수는 코드 블록 내에서 선언해도 모두 전역 변수가 된다
	var x = 10;
}

var i = 10;
for(var i = 0; i < 5; i++) {
	console.log(i);	// 0 1 2 3 4
}

console.log(x);	// 10
console.log(i);	// 5

// 변수 호이스팅
foo = 123;
console.log(foo); // 123
var foo;

🔥 let

: var 키워드의 단점을 보완하기 위해 도입

특징
1. 변수 중복 선언 금지
2. 블록 레벨 스코프
3. 변수 호이스팅 : 선언 단계, 초기화 단계가 분리되어 진행

// 변수 중복 선언 금지
let bar = 123;
let bar = 456;	// SyntaxError -> 중복 선언 허용하지 않음

// 블록 레벨 스코프
// 모든 코드 블록을 지역 스코프로 인정
let foo = 1;

{
	let foo = 2;
  	let bar = 3;
}

console.log(foo);	// 1
console.log(bar);	// ReferenceError: bar is not defined

// 변수 호이스팅
// 선언 단계 : 런타임 이전 실행
// 초기화 단계 : 변수 선언문에 도달했을 때 실행
console.log(foo);	// ReferenceError: foo is not defined

let foo;	// --- 변수 선언문에서 초기화 단계 실행
console.log(foo);	// undefined

foo = 1;	// --- 할당문에서 할당 단계 실행
console.log(foo);	// 1

let bar = 1;
{
	console.log(bar);	// ReferenceError: Cannot access 'bar' before initialization
  						// 호이스팅이 발생하기 때문
  	let bar = 2;
}

🔥 const

: var 키워드의 단점을 보완하기 위해 도입
: 상수를 선언하기 위해 사용(반드시X)
: let키워드의 특징과 대부분 동일

특징
1. 선언과 초기화
2. 재할당 금지
3. 상수

// 선언과 동시에 초기화가 되어야 함
const foo = 1;

// 재할당 금지
foo = 2;	// TypeError

// 상수
// 세율을 의미하는 0.1은 변경할 수 없는 상수로서 사용될 값
const TAX_RATE = 0.1;

let preTaxPrice = 100;	// 세전가격
let afterTaxPrice = preTaxPrice + (preTaxPrice*TAX_RATE);	// 세후가격

console.log(afterTaxPrice);	// 110

*호이스팅(hoisting)

: 함수 선언문이 코드의 선두로 끌어올려서 해당 함수 유효 범위의 최상단에 선언하는 것

console.log(score);	// undefined

var score;	// 1. 변수 선언문  --- 런타임 이전
score = 80;	// 2. 값이 할당	   --- 런타임

console.log(score);	// 80

: 변수 선언이 런타임(소스코드가 한 줄씩 순차적으로 실행되는 시점)이 아니라 그 이전 단계에서 먼저 실행되기 때문에 에러가 발생하지 않는다.

💖 데이터 타입

🔥 숫자 타입(number)

: 숫자. 정수와 실수 구분 없이 하나의 숫자 타입만 존재
: C나 자바같이 int, long, float, double 등 다양한 숫자 타입 X
: 2진수, 8진수, 16진수 값을 참조하면 모두 10진수로 해석된다

// 모두 숫자 타입
var integer = 10;	// 정수
var double = 10.12;	// 실수
var negative = -20;	// 음의 정수

var binary = 0b01000001;	// 2진수
var octal = 0o101;			// 8진수
var hex = 0x41;				// 16진수

console.log(binary);	// 65
console.log(octal);		// 65
console.log(hex);		// 65

// 숫자 타입은 모두 실수로 처리된다.
console.log(1===1.0); // true

🔥 문자열 타입(string)

: 개행X. 공백을 표현하려면 \로 시작하는 이스케이프 시퀀스를 사용해야 한다

// 문자열 타입
var string;
string = "문자열";
string = '문자열';
string = `문자열`;

var template1 = '<ul>\n\t<li><a href="#">Home</a></li>\n</ul>';	// 일반 문자열
var template2 = `<ul>
	<li><a href="#">Home</a></li>
</ul>`;	// 템플릿 리터럴 -> 그대로 적용

console.log(template1);
console.log(template2);
/*
<ul>
	<li><a href="#"></a></li>
</ul>
*/

🔥 불리언 타입(boolean)

: true / false

var foo = true;
console.log(foo);	// true

foo = false;
console.log(foo);	// false

🔥 그 외

: undefined타입 , null타입, 심벌 타입(symbol), 객체 타입

profile
🦋개발 공부 기록🦋

0개의 댓글