[JavaScript] 02. 자바스크립트 기본 문법01

자바스크립트에서 변수를 선언하는 방법은 let, const, var 키워드를 사용하여 선언합니다.

# 변수(Variable)

변수란, 어떤 값을 저장하기 위한 공간을 의미합니다. 자바스크립트에서는 let 키워드를 사용하여 변수를 선언합니다.
또한, 자바스크립트에서 변수 선언 시 특정 데이터 타입을 지정하지 않아도 사용할 수 있습니다.

let name;
let major = "ComputerScience";
let age = 24;

 

++ undefined와 null 차이점
undefined와 null 모두 값이 없음을 의미 하지만, 둘은 전혀 다른 개념이라고 해요!
undefined는 정의되지 않은 값을 의미하고, null은 명시적으로 값이 비어있음을 의미합니다.

 

# 상수(Constant)

상수는 변하지 않는 값을 의미하는데, 자바스크립트에서는 const 키워드를 사용하여 상수를 선언합니다.
상수로 선언해서 사용할 때에는 재할당 할 수 없음으로 변경하지 않는 값을 저장할 때 사용해야 해요!

const age = 24;
age = 20; //error!​

✓ 상수로 선언된 값을 변경하게 된다면 에러가 발생하니 주의해서 사용해야 합니다.

 

# var 키워드

var 키워드 는 variable의 앞 세 글자를 따서 만들어졌으며, 변수를 선언하는 오래된 방식입니다. 
하지만, var 키워드를 사용했을 때 나타는 여러 단점들을 보완하기 위하여 ES6에서 let와 const 키워드가 등장시켰다고 해요!

var name = "송우든";

 

# var 키워드 단점

var 키워드의 단점은 아래와 같이 크게 3가지가 존재합니다. 

1) 중복된 변수명 사용 문제
2) 변수의 유효 범위 문제

3) 호이스팅(Hoisting) 문제

 

✓ 호이스팅(Hoisting)이란, 코드 중간에 선언된 변수를 최상단으로 올리는 것을 의미합니다.

var name = "송우든";

console.log(major); // 3) 호이스팅 문제 

if(name === "송우든"){ 
	var result = true; // 1) 중복된 변수명 사용 문제 
}
else { 
   	var result = false;
}

var major = "ComputerScience";

console.log(result); // 2) 변수의 유효범위 문제

 

# 변수명 규칙 

자바스크립트에서 변수명을 정의할 때에는 문자, 숫자와 특수기호 _ 와 $만 사용이 가능합니다.
또한, 변수명의 첫 글자에는 숫자가 올 수 없고, 대소문자를 구분하여 사용합니다. 

let 1foo = 5; // (x) → 변수명은 숫자로 시작할 수 없음!
let foo!@; // (x) → 특수기호는 _(언더바)와 $(달러)만 가능!

 

# 자료형

자바스크립트는 동적 타입 언어로, 변수에 저장되는 값의 타입이 바뀔 수 있습니다. 자바스크립트의 타입은 크게 원시타입과 객체타입으로 분류할 수 있는데요! 원시타입에는 숫자, 문자열, 논리값 등이 포함됩니다.

let name = "송우든"; // 문자열
let age = 24; // 숫자
let isStudent = true; // 논리타입

 

# 템플릿 리터럴(Template Literal)

템플릿 리터럴은 일부만을 변경하여 반복 또는 재사용할 수 있는 틀을 의미합니다. 또한, 표현식의 값을 문자열에 추가하여 사용할 수 있어요! 이때, `백틱(BackTick)로 묶어서 사용합니다.

let name = "송우든";

console.log(`나의 이름은${name} 입니다.`); // 출력 : 나의 이름은 송우든 입니다.

 

# 형변환

형변환에는 문자형으로 형변환, 숫자형으로 형변환, 논리형으로 형변환이 있습니다.

 

먼저, 문자형으로 형변환시 String()을 사용합니다.
특히, alert문 사용할 때 전달받은 자료형과 관계없이 문자형으로 형변환이 발생합니다.

let foo = 1000;
console.log(typeof foo); // 출력 : number

foo = String(foo); // 1) 문자형으로 형변환
console.log(typeof foo); // 출력 : string

 

두번째는 숫자형으로 형변환을 할 때에는 Number()을 사용합니다.
수학과 관련된 함수 또는 표현식에서 자동으로 형변환이 일어나는데요! 이때, 문자열을 숫자로 변환하게 된다면 
NaN(Not a Number)으로 값이 변환됩니다. (전달받은 값을 undefined로 인식하기 때문에)
또한, null 값을 숫자로 변환시, 0으로 변환됩니다.

let foo = "wooden";
console.log(Number(foo)); // 출력 : NaN

let bar = null;
console.log(Number(bar)); // 출력 : 0

console.log("12" / "2"); // 출력 : 6
console.log("10" - "5"); // 출력 : 5
console.log("6" + "3"); // 연산 불가능!(문자열을 연결해주는 연산자로 인식) 출력 : 63

 

마지막으로 논리형으로 형변환은 Boolean() 사용합니다.

console.log(Boolean(1))

 

 

 

참고 자료 및 사이트 : ko.javascript.info/intro