1 분 소요

jQuery의 $.type(), $.isArray() 등 타입 검사 유틸리티 메소드를 활용하면 값의 정확한 타입을 확인하고 조건 분기를 더 안정적으로 처리할 수 있습니다.


1. 정확한 타입 확인: $.type()

자바스크립트의 typeof는 일부 타입에 대해 애매한 결과를 반환하지만, jQuery의 $.type()은 더 명확한 값을 제공합니다.

console.log($.type(true));           // "boolean"
console.log($.type([]));             // "array"
console.log($.type(null));           // "null"
console.log($.type(/regex/));        // "regexp"

활용 상황

  • 디버깅 시 콘솔에 타입 출력
  • 조건 분기에서 정확한 비교 수행
  • null, array, object 구분이 필요한 경우

2. 주요 타입 검사 유틸리티

2.1. $.isArray()

$.isArray([]);            // true
$.isArray("string");      // false

배열인지 확인할 때 사용합니다.


2.2. $.isFunction()

$.isFunction(function() {}); // true
$.isFunction(123);           // false

콜백 함수 유효성 검증 등에서 사용됩니다.


2.3. $.isNumeric()

$.isNumeric("123");   // true
$.isNumeric([7]);     // false

문자열 숫자도 포함하여 숫자인지 확인합니다.


2.4. $.isEmptyObject()

$.isEmptyObject({});                 // true
$.isEmptyObject({ a: 1 });           // false

프로퍼티가 없는 순수 객체 여부를 확인할 때 유용합니다.


2.5. $.isPlainObject()

$.isPlainObject({});                     // true
$.isPlainObject(new Date());            // false
$.isPlainObject(new String("abc"));     // false

단순 리터럴 객체만 참을 반환합니다.


2.6. $.isWindow()

$.isWindow(window);      // true
$.isWindow({});          // false

현재 창 또는 iframe의 window 객체인지 검사합니다.


2.7. $.isXMLDoc()

$.isXMLDoc(document);    // false
$.isXMLDoc(xmlDoc);      // true (XMLDocument일 경우)

XML DOM 문서 여부 판단에 사용합니다.


3. 종합 예제

$("button").on("click", function () {
  const results = `
    Array: ${$.isArray([])}<br>
    Function: ${$.isFunction(function () {})}<br>
    Numeric (123): ${$.isNumeric(123)}<br>
    Numeric ("123"): ${$.isNumeric("123")}<br>
    Empty Object: ${$.isEmptyObject({})}<br>
    Plain Object: ${$.isPlainObject({ a: 1 })}<br>
    Window Object: ${$.isWindow(window)}<br>
    Type of RegExp: ${$.type(/abc/)}<br>
  `;
  $("#text").html(results);
});

질문 정리

typeof$.type()은 어떻게 다른가요?

typeof null은 “object”를 반환하지만 $.type(null)은 “null”로 정확하게 판단합니다.

문자열 숫자는 $.isNumeric()에서 true가 나오나요?

→ 네, "123"처럼 숫자로 해석 가능한 문자열은 true로 반환됩니다.

빈 객체와 빈 배열은 구분할 수 있나요?

.isEmptyObject(){}만 true이며, 배열은 false입니다. 배열 길이는 arr.length === 0으로 따로 확인하세요.

폼 데이터 직렬화 후 객체 여부를 판단할 수 있나요?

serializeArray() 결과는 배열이므로 .isArray()로 판단 가능합니다.


마무리 요약

메소드 설명
$.type() 값의 정확한 타입 문자열을 반환
$.isArray() 배열인지 확인
$.isFunction() 함수인지 확인
$.isNumeric() 숫자 또는 숫자 문자열 여부 확인
$.isEmptyObject() 빈 객체인지 확인
$.isPlainObject() 순수 객체인지 확인
$.isWindow() window 객체인지 확인
$.isXMLDoc() XML 문서인지 확인

카테고리:

업데이트:

댓글남기기