기본 데이터 타입

자바스크립트의 기본 데이터 타입은 문자열, 숫자, 불린 이다. 변수를 선언할 때, 변수명 앞에는 const, let, var 중 하나를 붙인다. const와 let은 블록 레벨 스코프 변수다. var는 함수 레벨 스코프 변수다. const는 재할당이 없는 변수에, let은 재할당이 필요한 변수에 붙인다. var는 되도록 사용을 피하는 게 좋다.

const 변수 예

const city = "서울";//또는 '서울'
const result = 1200 / 1000;
const onGlass = true;
alert('city: ' + city);
alert('result: ' + result);
alert('onGlass: ' + onGlass);

let 변수 예

let sum = 0;
for (let i = 1;i <= 10;i++) {
	sum += i;	
} 
alert('1부터 10까지의 합: ' + sum);

let sum = 0; 을 const sum = 0; 으로 고치면, sum += i; 라인에서 다음 에러가 발생한다.
TypeError: Assignment to constant variable.

배열 요소를 조작하는 건 배열 변수 재할당이 아니다. 아래 코드는 const로 선언한 배열 변수에 배열 요소를 추가하고 있다.

const years = new Array(1969, 1970);
years[57] = 2026;
alert("years.length=" + years.length);
alert("years=" + years);
for (let idx in years) {
    alert(years[idx]);
}

다음은 배열 변수 재할당에 대한 예다.

const regExp = new RegExp('java', 'gi'); // /java/gi
const testStr = "https://java-school.net is the best site to learn Java";
let retArr = regExp.exec(testStr);
alert(retArr[0]);
retArr = regExp.exec(testStr);
alert(retArr[0]);

RegExp 객체의 exec() 함수는 배열을 리턴한다.
참조: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec

전역 변수와 지역 변수

전역 변수 (Global Variable): 코드의 가장 바깥 영역에 선언된 변수로, 애플리케이션 전역에서 접근할 수 있다.

지역 변수 (Local/Block Variable): 함수나 중괄호 {} 블록 내에서 선언된 변수로, 선언된 블록 내부에서만 접근할 수 있다.

const a = 2;//전역 변수
function test() {
	const a = 1;//지역 변수
	alert(a);
}
test();
alert(a);

주석

// 한 줄 주석
/* */ 여러 줄 주석

식별자

문자, 숫자, _, $을 조합한 어떠한 문자열도 가능하다. 대소문자를 구별한다. 예약어는 사용할 수 없다.

undefined

undefined는 변수가 선언되고 초기화되지 않은 상태에서 값을 참조했을 때 '값이 할당되지 않았다'라는 의미이다.

var i;
alert('i: ' + i);

let i;
alert('i: ' + i);

다음 코드는, Uncaught SyntaxError: missing = in const declaration 에러를 발생시킨다.

const i;
alert('i: ' + i);

형변환

if 조건절에서 단독으로 쓰인, 0, "", NaN, null, undefined는 불린 false로 형 변환된다.

let i;
if (i) {
	alert('i: ' + "true");
} else {
	alert('i: ' + "false");
}

다음 코드는, Uncaught SyntaxError: missing = in const declaration 에러를 발생시킨다.

const i;
if (i) {
	alert('i: ' + "true");
} else {
	alert('i: ' + "false");
}

자바스크립트에선 값이 같은지 비교하는 연산자가 두 개 있다. ==는 비교 전 피연산자의 형이 다르면 형 변환을 수행 후, 값이 같은지 검사한다. ===는 피연산자의 형이 같은지 검사하고, 형이 같으면 값이 같은지 검사한다.

if ('7' == 7) {
	alert("true");
} else {
	alert("false");
}

if ('7' === 7) {
	alert("true");
} else {
	alert("false");
}

자바스크립트 엔진은 null과 undefined를 비교할 때, 두 값을 '값이 없음'을 나타내는 유사한 값으로 취급하도록 정의되어 있다.

if (null == undefined) {
	alert("true");
} else {
	alert("false");
}

null의 형은 object이고, undefined 형은 undefined 그 자체다. 형이 다르면, ===는 false를 리턴한다.

if (null === undefined) {
	alert("true");
} else {
	alert("false");
}

암묵적 형 변환은 개발자가 의도적으로 형을 변환하지 않아도, 자바스크립트 엔진이 자동으로 형을 변환하는 것을 말한다.

alert("20" + 30);
alert(2026 + "년");

alert("20" - 30);
alert("20" * 30);
alert("20" / 30);
alert("20" - 30);
alert("20" + 30);//산술 연산자보다 문자열 연결 연산자가 우선

if ("20" > 30) {
	alert("true");
} else {
	alert("false");
}

의도치 않은 암묵적 형 변환은 디버깅을 힘들게 한다. 명시적 형 변환을 사용하는 것이 유리하다.

명시적 형 변환은 String(), Number(), Boolean() 함수를 사용한다.

명시적 문자열 형 변환

alert(String(20) + '30');
alert(String(2026) + "년");
alert((2026).toString() + "년");//toStinrg() 함수를 사용할 수 있다

명시적 숫자 형 변환

alert(Number("20") * 30);
alert(Number("20") / 30);
alert(Number("20") - 30);
alert(Number("20") + 30);

alert(Number("3.14"));

alert(parseInt("3.14"));

alert(parseInt("10px"));