JavaScript의 데이터 유형 감지 방법 요약

韦小宝
풀어 주다: 2018-03-14 18:30:35
원래의
1192명이 탐색했습니다.

이 글에서는 JavaScript에서 데이터 유형을 감지하는 방법에 대해 설명합니다. JavaScript에서 데이터 유형을 감지하는 방법을 모르거나 JavaScript에서 데이터 유형을 감지하는 방법에 관심이 있는 경우 함께 참여해 보세요. 이 기사를 살펴보세요. 헛소리는 줄이고 본론으로 들어가겠습니다.

그 전에 js의 유형에 대해 이야기해 보겠습니다. js에는 5가지 기본 유형과 하나의 복합 유형이 있습니다.
5가지 기본 유형: undefine, null, number, string, bollean
1가지 복합 유형: object

1.typeof

반환 값 유형: string

은 다음과 같이 감지됩니다.

                      /*5大基本类型*/

var a = 123;
console.log(typeof a == "number");      //true

var a = '123';
console.log(typeof a == "string");      //true

var a = true;
console.log(typeof a == "boolean");     //true

var a = undefined;
console.log(typeof a == "undefined");   //true

var a = null;
console.log(a == null);                 //true

            /*复杂类型*/

var a = function(){};
console.log(typeof a == "function");    //true
로그인 후 복사

다른 참조 유형 객체의 경우 typeof는 감지 및 구별할 수 없으며 날짜 유형, 정규식type과 같은 객체를 반환합니다. 등으로 인해 감지되는 항목을 구분할 수 없습니다(감지하려면 아래 다른 방법 사용)

typeof 메소드 함수 캡슐화

function typeOf(obj){
    return (obj === 'null') ? 'null' : (typeof obj)
}
로그인 후 복사

마지막에 특수 NaN

console.log(typeof NaN === "number");       //true
로그인 후 복사

2을 추가합니다. 객체를 감지하는 데 사용됩니다. 다른 객체의 인스턴스입니까

구문: object1 instanceof object2

매개 변수: object1-an 객체, 생성자-another 객체


반환 값 유형: Boolean

위의 추상 단어를 어떻게 이해합니까?

즉,

constructor

객체의 프로토타입 객체는 인스턴스 객체의 프로토타입 체인을 통해 접근할 수 있습니다. 이것이 인스턴스 오브가 작동하는 방식입니다. 이 역시 인스턴스 오브가 객체 자체의 구조에는 관심이 없다는 것을 보여줍니다. 객체와 생성자 관계에만 관심이 있습니다.

여기에 더 일반적으로 사용되는 예제가 나열되어 있습니다. 만약 정말로 인스턴스 오브에 대해 관심이 있다면 여기를 클릭하여 MDN 문서를 확인하세요

3. 생성자 속성

생성자 속성은 이 객체를 생성한 생성자에 대한 참조를 반환합니다.

반환 값 유형: 객체

여기서 주목해야 할 점은 var a = 1, var b = '123'...과 같이 우리가 일반적으로 생성하는 것은 실제로 해당 생성자를 참조하여 생성된다는 것입니다. 외부에서는 우리가 보는 표면 대신 유형에 대해 직접 생성됩니다.

유형별 테스트 방법은 다음과 같습니다.

         /*5大基本类型*/

var a = 123;
console.log(a.constructor == Number);   //true

var a = '123';
console.log(a.constructor == String);   //true

var a = true;
console.log(a.constructor == Boolean);  //true

var a = undefined;
console.log(a && a.constructor);        //undefined

var a = null;
console.log(a && a.constructor);        //null

            /*复杂类型*/

var a = function(){};
console.log(a.constructor == Function); //true

var a = new Date();
console.log(a.constructor == Date);     //true

var a = new Object();
console.log(a.constructor == Object);   //true
var a = {};
console.log(a.constructor == Object);   //true

var a = new Array();
console.log(a.constructor == Array);    //true
var a = [];
console.log(a.constructor == Array);    //true

var a = new RegExp('abc');
console.log(a.constructor == RegExp);   //true
var a = /^abc$/;
console.log(a.constructor == RegExp);   //true
로그인 후 복사

4.toString() 방법

이 방법은 객체 유형을 감지하는 가장 안전하고 정확한 방법입니다.

반환값 유형: 문자열

/*toString 检测类型函数*/
function toStringType(obj){
    return Object.prototype.toString.call(obj).slice(8, -1);
}
            /*5大基本类型*/

var a = 123;
console.log(toStringType(a));       //"Number"

var a = '123';
console.log(toStringType(a));       //"String"

var a = true;
console.log(toStringType(a));       //"Boolean"

var a = undefined;
console.log(toStringType(a));       //"Undefined"

var a = null;
console.log(toStringType(a));       //"Null"

            /*复杂类型*/

var a = function(){};
console.log(toStringType(a));       //"Function"

var a = new Date();
console.log(toStringType(a));       //"Date"

var a = new Object();
console.log(toStringType(a));       //"Object"
var a = {};
console.log(toStringType(a));       //"Object"

var a = new Array();
console.log(toStringType(a));       //"Array"
var a = [];
console.log(toStringType(a));       //"Array"

var a = new RegExp('abc');
console.log(toStringType(a));       //"RegExp"
var a = /^abc$/;
console.log(toStringType(a));       //"RegExp"
로그인 후 복사
반환된 문자열의 대소문자가 더 번거롭다고 생각되면 모두 소문자로 변환하면 됩니다.

코드는 다음과 같습니다.

function toStringType(obj){
    return Object.prototype.toString.call(obj).slice(8, -1).toLowerCase();
}
로그인 후 복사

이때, 의심 .

var a = 123;
console.log(a.toString()); //"123"
로그인 후 복사

1. 이렇게 쓰면 왜 "123"이 반환되나요?

답변: js의 각 개체에는 자체 toString 메서드가 미리 정의되어 있기 때문에 이는 toString


2을 다시 작성하는 것과 유사합니다. 이 기사에서 호출 메서드가 사용되는 이유는 무엇입니까? 기능은 무엇입니까?

답변: 호출의 기능은 범위를 현재 범위로 변경하는 것입니다. 기사를 예로 들면 객체의 범위 실행 환경을 a로 변경하는 것입니다.


3.

var a = 123;
console.log(Object.prototype.toString.call(a));  //"[Object Number]"
로그인 후 복사

이 예를 통해서 비교해보면 이해가 되실 텐데요, 이는 결과의 직관성을 위함입니다.

위 내용이 이 글의 전부입니다. 잘 모르신다면 혼자서도 쉽게 두 가지를 마스터하실 수 있습니다!



관련 권장 사항:

PHP 데이터 유형 감지 예제에 대한 자세한 설명

JavaScript의 데이터 유형 감지 방법 요약

위 내용은 JavaScript의 데이터 유형 감지 방법 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿