JavaScript에서 변수 유형 가져오기

Nithin Krishnan 2023년10월12일

JavaScript JavaScript Variable

typeof 연산자를 사용하여 변수 유형 찾기
조건부 검사에서 typeof 연산자 사용
메모:

C, Java 등과 같은 다른 프로그래밍 언어와 비교하여 JavaScript는 개발자가 단일 키워드(var 키워드)로 모든 유형의 변수를 정의할 수 있는 자유를 제공합니다. JavaScript는 나중에 이러한 변수에 할당된 값에 따라 변수의 데이터 유형을 결정합니다. 변수의 데이터 유형을 결정하는 것은 쉬워 보입니다. 그러나 일부 시나리오는 문제를 해결할 수 있습니다. 특히 서버의 REST API 응답에서 반환된 값의 경우 처리하기 위해 추가로 코딩하기 전에 값 또는 변수의 유형을 알아야 할 수도 있습니다.

`typeof` 연산자를 사용하여 변수 유형 찾기

typeof는 적용되는 피연산자의 유형을 반환하는 자바스크립트의 단항 연산자입니다. 일반적으로 변수 유형을 문자열 개체로 반환합니다. 자바스크립트에는 typeof 연산자에 대한 표준 반환 유형이 있습니다.

string: typeof는 변수 유형 문자열에 대해 string을 반환합니다.
number: 정수 또는 부동 소수점 값을 보유하는 변수에 대해 number를 반환합니다.
boolean: true 또는 false 값을 보유하는 변수의 경우 typeof는 boolean을 반환합니다.
undefined: 변수에 값을 할당하지 않은 경우 변수의 유형은 JavaScript에 의해 undefined로 표시됩니다. 따라서 typeof 피연산자는 이러한 선언되지 않은 변수에 대해 undefined를 반환합니다.
object: 배열을 보유하는 변수, {}의 객체 또는 null 값이 할당된 변수의 경우 자바스크립트는 이러한 변수의 유형을 객체로 간주합니다. 따라서 typeof 피연산자는 object를 반환합니다.
function: JavaScript를 사용하면 변수에 기능을 할당할 수 있습니다. 그러한 경우, 그러한 변수의 유형은 function이 됩니다. typeof 연산자는 함수 할당에 대해 function을 반환합니다.

다음 코드 조각은 다양한 변수 할당 및 다양한 시나리오에 대한 typeof 연산자의 동작을 보여줍니다.

var s1 = 'hello';
var n1 = 120;
var n1 = 11.1234;
var b1 = true;
var x;
var u = undefined;
var o1 = null;
var o2 = {id: 1, value: 200};
var o3 = [1, 2, 3];
var f = function() {
  return 1 + 2
};

console.log(typeof s1);
console.log(typeof n1);
console.log(typeof n1);
console.log(typeof b1);
console.log(typeof x);
console.log(typeof u);
console.log(typeof o1);
console.log(typeof o2);
console.log(typeof o3);
console.log(typeof f);

출력:

"string"
"number"
"number"
"boolean"
"undefined"
"undefined"
"object"
"object"
"object"
"function"

조건부 검사에서 `typeof` 연산자 사용

연산자가 반환한 값을 확인하고 표준 유형 값과 비교하여 if 블록과 같은 조건부 검사에서 typeof 연산자를 사용할 수 있습니다. 연산자의 양쪽 끝에서 피연산자의 유형 검사를 포함하므로 비교를 위해 === 연산자를 사용합니다.

var a = 'hello';
if (typeof a === 'string') {
  console.log(true)
}

출력:

true

유사하게, number, boolean, object 및 function에 대한 조건부 검사를 수행할 수 있습니다. 모범 사례로서 우리는 자바스크립트의 typeof 연산자에 의해 반환된 표준 데이터 유형에 대한 상수 변수를 생성해야 합니다. 그런 다음 선언된 상수와 변수의 typeof를 비교합니다. 이 접근 방식을 사용하면 일반적으로 한 눈에 파악되지 않는 조건부 블록을 작성하는 동안 코딩을 쉽게 하고 오타를 줄일 수 있습니다. 더 잘 이해하려면 다음 코드를 참조하십시오.

const STRING_TYPE = 'string';
const NUMBER_TYPE = 'number';
var a = 'hello';
var b = 123;
if (typeof a === STRING_TYPE) {
  console.log(true)
}
if (typeof b === NUMBER_TYPE) {
  console.log(true)
}

출력:

true
true

메모:

new 키워드로 할당된 변수가 있는 경우 자바스크립트는 이러한 할당을 객체로 간주합니다. 따라서 typeof 연산자는 이러한 할당에 대해 object를 반환합니다. 다음 코드를 참조하십시오.

var s = new String('hello');
var n = new Number(100);
console.log(typeof s);
console.log(typeof n);

출력:

object
object

new 키워드를 사용하여 함수를 할당하면 해당 변수의 데이터 유형이 javascript에 의해 함수로 간주됩니다. new function()이 있는 typeof 변수는 object 대신 function으로 반환됩니다. 다음 코드를 살펴보자.

var fn = new Function();

출력:

"function"

모든 브라우저는 이전 버전의 Internet Explorer를 포함하여 자바스크립트의 typeof 연산자를 지원합니다. 따라서 여러 브라우저에서 지원되는 프로젝트에서 걱정 없이 연산자를 사용할 수 있습니다.

typeof 연산자를 사용하여 변수 유형 찾기

조건부 검사에서 typeof 연산자 사용

메모:

관련 문장 - JavaScript Variable

`typeof` 연산자를 사용하여 변수 유형 찾기

조건부 검사에서 `typeof` 연산자 사용