JavaScript var, let, const 차이

1. var

- 자바스크립트에서 변수를 선언하기 위한 선언자이다.

- 변수의 유효 범위의 대한 문제가 존재한다.

ex) 기존의 존재하는 변수 a를 재선언하여도 에러가 발생하지 않는다.

<script>
    var a = 5;
    console.log(a);
    var a = "e";
    console.log(a);
</script>

2. let

- 위 같은 var의 문제점을 보완하기 위해 ECMAScript 6부터 추가된 변수 선언자다.

ex) 위 var과는 다르게 이미 존재한다는 에러 메시지를 보여준다.

<script>
    let a = 5;
    console.log(a);
    let a = "e";
    console.log(a);
</script>

※ var보단 let을 사용해주는 것이 더욱 에러 발생을 대비할 수 있다.

3. const

- let과 마찬가지로 ECMAScript 6부터 추가된 선언자 이다.

- let과는 다르게 선언 시 한번만 초기화 할 수 있는 상수 이다.

- 단, 배열이나 객체와 같은 참조타입일 경우 값(프로퍼티)을 수정할 수 있다.

JavaScript 변수

 변수형

 변수 데이터 형으로는 숫자, 문자열 외에도 클래스, 객체, 함수 등등이 있다.

// 기본적인 변수 선언
let i = 5;     // 숫자형
let s = "test" // 문자열
const PI = 3.14 // 상수

// 클래스(Class)
function MyC() { }
let myC = MyC();


// 객체(Object)
function MyC() { }
let myO = new MyC();


// 함수(Function)
function fun() { }
let func = fun;
 

클래스, 객체, 함수 형을 구현할 때는 모두 function을 사용한다.

 주석

- 한 줄 : // 

- 여러 줄 : /*   */

 변수 값 확인하기

1. document.write() 

: html의  body 영역에 출력할 수 있다. 이곳에는 html 태그를 사용할 수도 있다.

let v = 20;
document.write("변수 : ", v);   // ','를 사용
document.write("변수 : " + v);  // '+'를 사용

ㄴ 문자열과 숫자형을 +하면 숫자형을 문자열로 변환 한다.

2. console.log()

: 디버깅 함수 중 하나로서 특정 부분에 삽입하여 값을 확인하기 용이하다. 이를 사용하면 오류를 찾거나 특정 어느 부분에서 값이 잘못되었는지를 확인하기 편하다. 

단, document처럼 body영역에 출력하는 것이 아니라 Console에 출력한다.            ( Chrome일 경우 [F12] - Console 에서 확인 )

알림 창 띄우기

1. alert("출력할 문자열")

: 알림 창을 띄워 값을 출력한다. 값을 확인하거나 할 때 사용한다.

2. prompt("텍스트", "기본값")

: 알림 창을 띄워 값을 입력 받는다. 

	function say() {
		let who;
		who = prompt("입력 테스트 중", "기본");
		if(who) {
			alert(who + "확인함");
		}
		else {
			alert(who + "취소함");
		}
	}

 위 코드처럼 if문을 사용하여 확인과, 취소에 따라 실행을 다르게 해줄 수 있다.

 단, 취소를 눌렀을 때는 변수의 값이 저장 안 됨으로 초기화 된 변수를 사용해야 한다.

※ undefined  vs.  null

 보통 변수를 선언하고 값을 할당하지 않으면 값이 아직 없다는 의미로 undefined가 들어간다.

null 또한 값이 없다는 의미로 의미상으로는 같다.

 하지만 null은 '아무것도 참조하지 않는다'는 의미로서 주로 객체를 초기화할 때 사용한다는 차이점이 존재한다.