typeof 연산자

typeof 연산자는 typeof 키워드 다음에 값을 입력하면 그 typeof 값을 평가해서 해당하는 자료형을 문자열로 되돌려 준다. 사용하는 값이 어떤 자료형인지 간편하게 확인 가능. 단순한 값 뿐만 아니라 변수나 함수에도 활용 가능.

	console.log(typeof 101); //number
	console.log(typeof 'Javascript'); //string
	console.log(tyleof true); //boolean

이런 식으로 값을 작성하고 실행시켜 보면 주석에 단 내용처럼 콘솔에 표시가 된다.

	console.log(typeof 1); //number
    console.log(typeof 1.0); //number
    console.log(typeof "1"); //string
    console.log(typeof '1'); //string
    console.log(typeof `1`); //string

위 코드에 숫자 1을 다양한 형태로 작성하고 각각의 자료형을 확인하는 코드 작성. 출력해보면 자바스크립트는 소수와 정수를 따로 구분하지 않기 때문에 1과 1.0 모두 number로 출력이 되고 나머지 3줄은 문자열로 취급이 돼서 string 출력.

	let name = "Javascript";
    
    function sayHello(){
    	console.log('Hello !');
    };
    
    console.log(typeof name); //string
    console.log(typeof sayHello); //function

name 이라는 변수와 sayHello 라는 함수를 만들고 typeof 연산자를 활용해서 각각의 자료형을 확인해봤다. name은 string으로 출력되고, sayHello는 function으로 출력이 된다.

	console.log(typeof 'Hello' + 'Javascript');
    console.log(typof 10-3);

위 코드에서 첫 번째 줄을 보면 문자열을 더해주니까 string 두 번째 줄은 number이 출력이 될 것 같다. 하지만 저장하고 실행해보면 stringJavascript, NaN 이라는 값이 출력이 된다. (????왜지)
NaN은 not a number의 약자로 숫자가 아닌 값을 표현하는 값이라고 한다. 왜 이런 결과가 나왔을까.
문제는 연산의 순서가 내가 의도하지 않은 방식으로 실행됐기 때문이다. typeof 연산자는 기본적으로 사칙연산자들보다 우선순위가 높다.
그래서 첫 번째 줄에서 더하기 연산보다 typeof 'Hello'를 먼저 해버린 것. typeof 'Hello'의 값은 string이고 + 문자열 Javascript가 되어서 stringJavascript가 출력되는 것이다.
두 번째 줄에서도 typeof 10을 먼저 해버렸기 때문에 typeof 10은 문자열 number가 되는데, 문자열 number - 3 이 되어서 문자열과 숫자값을 연산하려다 보니까 '이것은 숫자가 아닌 값이다.'라는 의미의 NaN이 나온 것이다.
내가 원하는 값이 나오게 하려면 간단하게 괄호를 씌워주면 되는 일.

	console.log(typeof ('Hello' + 'Javascript'));
    console.log(typof (10-3));

이렇게 저장하고 실행하면 string, number 라는 예상했던 값이 나온다. typeof 연산자도 연산자기 때문에 다른 연산자와 함께 사용시 연산의 우선순위를 고려해야 된다는 점 기억하기.

문제

Q1) 다음 중 코드의 실행결과로 number 가 출력되는 경우를 모두 선택하세요.

① console.log(typeof 2);
② console.log(typeof 4 - 2);
③ console.log(typeof 'number');
④ console.log(typeof (3 * 3));

(1) typeof 2는 숫자 2의 자료형을 문자열로 반환하기 때문에 1번 선택지의 결과는 number
(2) typeof 4 - 2는 연산 우선순위에 따라, typeof 4의 결과인 문자열 'number' 와 숫자 2의 뺄셈이 된다. 선택지 2를 다시 정리하면 'number' - 2 가 되는데, 문자열과 숫자는 뺄셈을 할 수 없기 때문에, 결과는 NaN
(3) typeof 'number'는 문자열 'number'의 자료형을 반환하기 때문에 결과는 string
(4) typeof (3 * 3)은 연산 우선순위에 따라, typeof 9가 됨. 따라서 숫자 9의 자료형인 number가 출력

답 : 1, 4

Q2) 다음 코드는 콘솔에 어떤 값을 출력할까요 ?

	console.log(typeof typeof(3+5));

① boolean
② string
③ number
④ function

예시 코드를 보면 typeof가 두 번 연결되어 있음. 연산 우선순위에 따라 괄호 안에 있는 연산을 먼저 수행하면 console.log(typeof typeof 8);이 됨. typeof는 오른쪽에 있는 값의 자료형을 문자열 로 반환하는 연산자임. 그렇게 되면 console.log(typeof 'number'); 이 됨. 그럼 number은 문자열이니까 콘솔에는 string이 출력됨.

답 : 2

profile
front-end developer

0개의 댓글

관련 채용 정보