자바스크립트의 변수
자바스크립트의 변수 선언은 3가지 방법이 있다.
var, let, const이다.
var
var은 재할당 재선언이 가능한 선언방식이다.
하지만 현재 잘 사용되지 않고 있다.
왜냐하면 재선언이 문제가 있기 때문이다.
예를들어
1
2
3
4
5
6
var aaa = "hi";
console.log(aaa)
var aaa = "bye";
console.log(aaa)
//결과: hi bye
두 개의 변수는 같은 코드상에서 작성된 것이다.
원래라면 aaa값이 이미 선언되었기 때문에 오류가 나야한다.
하지만 오류없이 정상적으로 작동이 된다.
그게 왜 문제일까 생각해보면
코드가 길어지고 복잡해졌을 때
한번 선언된 변수인지 모르고 다시 선언해서 사용한다면
코드가 꼬이게되고 예상치못한 값이 들어갈 수 있다.
let
그래서 ES6이후 새롭게 let이 추가되었다.
1
2
3
4
5
6
var aaa = "hi";
console.log(aaa)
var aaa = "bye";
console.log(aaa)
//결과: Uncaught SyntaxError: Identifier 'aaa' has already been declared
let은 이 재선언을 해결한 것을 확인할 수 있다.
1
2
3
4
5
6
let aaa = "hi";
console.log(aaa)
aaa = "bye";
console.log(aaa)
//결과: hi bye
물론 이런식의 재할당은 가능하다.
그러므로 앞으로는 let을 사용하도록 하자.
const
const는 재선언 재할당 모두 안되는 방식이다.
1
2
3
4
5
6
7
8
9
const aaa = "hi";
console.log(aaa)
//결과: hi
const aaa = "bye";
console.log(aaa)
//결과: Uncaught SyntaxError: Identifier 'aaa' has already been declared
aaa = "bye";
console.log(aaa)
//결과: Uncaught TypeError:Assignment to constant variable.
한번 선언하면 그 값이 절대 바뀌지 않는 것이다.
자바스크립트의 연산자
연산자는 다른 언어와 비슷하다.
수학연산자들 +, -, /, *, % 가 존재하고
논리연산자, 비교연산자, 삼항연산자 등이 존재한다.
논리연산자
논리연산자에는 &&, ||, !이 있다.
and연산
x && y x를 true로 변환할 수 있는 경우 y를 반환하고, 그렇지 않으면 x를 반환한다.
or연산
x || y x를 true로 변환할 수 있는 경우 x를 반환하고, 그렇지 않으면 y를 반환한다.
not연산
!x 단일 피연산자를 true로 변환할 수 있으면 false를 반환하고 그렇지 않으면 true를 반환한다.
or연산을 다음과 같이 사용할 수도 있다.
1
2
3
4
let name;
let result = name || "empty";
console.log(result);
//결과: empty
name변수에 값이 없기 때문에
empty라는 문자열이 result에 들어간 것이다.
비교연산자
비교연산자에는 ==, ===, !=, !==, >, >= 등이 존재한다.
==이 특이한데 다른 언어에서 쓰이는 것과 다르다.
1
2
3
4
5
6
7
8
1 == 1
//true
"1" == 1
//true
0 == false
//true
null == undefined
//true
자바스크립트의 동등연산자(==)는
두 피연산자의 자료형이 다른경우
같게 변환시킨 후 비교하게 된다.
그렇기때문에 숫자 1과 문자열 1을 같다고 보는 것이다.
===는 다른 언어에서 쓰이는 일치연산자와 같다.
두 피연산자의 자료형까지 비교한다.
삼항연산자
다른 언어의 삼항연산자와 같다.
1
2
3
4
let num = 11;
let result = (num > 10) ? "ok" : "no";
console.log(result);
//결과: ok
자바스크립트의 타입
자바스크립트의 타입에는
Boolean, Null, Undefined, Number, String, Symbol, Object가 있다.
자바스크립트는 C나 Java와는 다르게
변수를 선언할 때 타입을 정해주지 않는다.
그렇기때문에 변수의 타입은 변수가 선언될 때 정해지는게 아니고
실행될 때 타입이 정해지게 된다.
예를들어
1
2
3
4
5
6
7
8
9
function test(x) {
console.log(typeof x);
}
test("abcd");
//결과: string
test(false);
//결과: boolean
test(12);
//결과: number
이런식으로 x라는 변수의 타입은 실행시에 정해지는 것이다.
참고로 변수가 어떤 타입인지 알아보고 싶다면 어떻게 해야할까
이럴때는 typeof를 사용하면 된다.
1
2
3
4
5
6
7
8
9
10
typeof "12";
//"string"
typeof 12;
//"number"
typeof true;
//"boolean"
typeof [];
//"object"
typeof new Date();
//"object"
typeof를 사용하면 기본적인 타입을 구분할 수 있다.
하지만 객체의 종류까지는 구분하지 못한다.
그래서 toString.call()을 사용한다.
1
2
3
4
5
6
7
8
9
10
Object.prototype.toString.call(document);
//"[object HTMLDocument]"
Object.prototype.toString.call(123);
//"[object Number]"
Object.prototype.toString.call("ab");
//"[object String]"
Object.prototype.toString.call(false);
//"[object Boolean]"
Object.prototype.toString.call(new Date());
//"[object Date]"
이것을 사용하면 객체의 종류까지 다 판별할 수 있다.