JavaScript_Basic 지식에서 typeof 및 instanceof 연산자 사용에 대한 토론

WBOY
풀어 주다: 2016-05-16 17:33:32
원래의
1122명이 탐색했습니다.

JavaScript 코드를 작성할 때 typeof와 instanceof 두 연산자가 때때로 사용되므로 반드시 사용해야 합니다. 하지만! 이를 사용할 때 원하는 결과를 직접 얻는 것은 항상 어렵습니다. 일반적으로 "이 두 연산자는 아마도 JavaScript의 가장 큰 디자인 결함일 것입니다. 왜냐하면 원하는 결과를 얻는 것이 거의 불가능하기 때문입니다"
typeof
설명: typeof는 표현식의 데이터 유형 문자열을 반환하며, 반환 결과는 숫자, 부울, 문자열, 객체, 정의되지 않음, 함수를 포함한 js의 기본 데이터 유형입니다.
설명으로 볼 때 문제가 없는 것 같습니다.

다음 코드는 숫자 변수를 작성하고 typeof 이후의 결과는 "number"입니다.

코드 복사 코드는 다음과 같습니다.

var a = 1; .log( typeof(a)); //=>number

Number 유형의 생성자를 사용하여 변수를 생성하는 경우 typeof 이후의 결과는 "object"입니다.

코드 복사 코드는 다음과 같습니다.
var a = new Number(1);
console.log(typeof(a)); //=>object

위 두 가지 출력 결과는 문제가 없어 보이는데, 이는 책에서 나온 당연한 이야기인 것 같습니다. . 왜냐하면 자바스크립트는 이런 식으로 설계되었기 때문입니다.

하지만! 문제는 typeof가 호출되기 때문에 변수가 값을 사용하여 직접 생성되었거나 유형 생성자를 사용하여 생성되었는지 여부에 관계없이 변수의 유형을 정확하게 반환해야 한다는 것입니다. 내가 당신을 또 무엇에 이용해야 합니까?
다음의 경우:

코드 복사 코드는 다음과 같습니다.
var a = 1;
var b = new Number(1);

정확히 말하면 a와 b 변수의 유형이 Number여야 원하는 결과를 얻을 수 있습니다.
정확한 유형 정보는 Object.prototype에 정의된 toString 메서드를 사용하여 얻은 변수의 내부 속성 [[Class]] 값에 저장됩니다.

유형 정보 가져오기:

코드 복사 코드는 다음과 같습니다.
var a = 1;
var b = new Number(1);
console.log(Object.prototype.toString.call(a))
console.log(Object.prototype.toString. call(b ));

출력:

코드 복사 코드는 다음과 같습니다.
[객체 번호]
[객체 번호]

이미 매우 간단하지 않습니까? 약간의 처리를 수행하여 직접적인 결과를 얻어보겠습니다.

코드 복사 코드는 다음과 같습니다.
var a = 1
var b = new; 번호(1);
console.log( Object.prototype.toString.call(a).slice(8,-1))
console.log(Object.prototype.toString.call(b). Slice(8,-1));

출력:
Number
Number
원하는 결과입니다.
더 나은 사용을 위해 변수가 특정 유형인지 확인하는 방법을 캡슐화합니다.

function is(obj,type) {
var clas = Object.prototype.toString.call(obj).slice(8, -1)
return obj !== un Defined && obj !== null && clas === type;
}

몇 가지 변수를 정의하고 테스트해 보겠습니다.

코드 복사 코드는 다음과 같습니다.
var a1=1; a2=Number(1 );
var b1="hello";
var b2=new String("hello")
var c1=[1,2,3]; =new Array(1 ,2,3);
console.log("a1의 유형:" typeof(a1))
console.log("a2의 유형:" typeof(a2)); console.log(" b1의 유형:" typeof(b1));
console.log("b2의 유형:" typeof(b2))
console.log("c1의 유형:" typeof(c1)) ;
console .log("c2's typeof:" typeof(c2));
출력:
a1의 typeof:number
a2의 typeof:object
b1의 typeof:string
b2의 typeof :object
c1의 typeof:object
c2의 typeof:object


우리가 사용하는 새로 생성된 함수는 다음과 같습니다.
코드 복사 코드는 다음과 같습니다.

console.log("a1은 숫자:" is(a1,"Number"))
console.log("a2는 숫자:" is(a2,"Number"))
console .log( "b1은 문자열입니다:" is(b1,"String"));
console.log("b2는 문자열입니다:" is(b2,"String"))
console.log(" c1은 배열입니다:" is(c1,"Array"));
console.log("c2는 배열입니다:" is(c2,"Array"));
출력:
a1은 숫자입니다: true
a2는 숫자:true
b1은 문자열:true
b2는 문자열:true
c1은 배열:true
c2는 배열:true

참고: typeof 실제 사용은 변수가 정의되었는지 또는 값이 할당되었는지 감지하는 것입니다.
instanceof
설명: 개체가 특정 데이터 유형인지 또는 변수가 개체의 인스턴스인지 확인합니다.
instanceof 연산자는 두 개의 내장 유형 변수를 비교할 때 무력하며 결과에도 만족하지 못할 것입니다.
코드 복사 코드는 다음과 같습니다.

console.log("abc" instanceof String ); / / false
console.log("abc" instanceof Object); // false
console.log(new String("abc") instanceof String) // true
console.log( new String("abc")instanceofObject); // true

사용자 정의 개체를 비교할 때만 관계를 정확하게 반영합니다.
코드 복사 코드는 다음과 같습니다.

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