> 웹 프론트엔드 > JS 튜토리얼 > JavaScript에서 typeof와 instanceof의 차이점 소개(코드 예)

JavaScript에서 typeof와 instanceof의 차이점 소개(코드 예)

不言
풀어 주다: 2019-02-25 10:25:19
앞으로
2812명이 탐색했습니다.

이 글은 JavaScript의 typeof와 instanceof의 차이점을 소개합니다(코드 예제). 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

JavaScript의 typeof와 인스턴스of는 변수가 비어 있는지 또는 어떤 유형인지 확인하는 데 자주 사용됩니다. 하지만 둘 사이에는 여전히 차이점이 있습니다.

typeof

typeof는 피연산자 앞에 배치되는 단항 연산이며 피연산자는 모든 유형이 될 수 있습니다.

반환 값은 피연산자의 유형을 설명하는 문자열입니다. (typeof 연산자는 표현식의 데이터 유형을 나타내는 데 사용되는 문자열을 반환합니다.)

typeof는 실제로 매개 변수 유형을 결정하는 인스턴스입니다.

typeof는 일반적으로 다음 결과만 반환할 수 있습니다. , "문자열", "부울", "객체", "함수" 및 "정의되지 않음".

피연산자는 숫자입니다. typeof(x) = "number"

String typeof(x) = "string"

Boolean value typeof(x) = "boolean"

Object, array and null typeof(x) = "object"

function typeof(x) = "function"

console.log(typeof (123));//typeof(123)返回"number" 
console.log(typeof ("123"));//typeof("123")返回"string"
var param1 = "string";
var param2 = new Object();
var param3 = 10;
console.log(typeof(param1)+"\n"+typeof(param2)+"\n"+typeof(param3)); 
     // string object  number
로그인 후 복사

대신에 if(typeof a!="undefine"){alert("ok")}와 같이 typeof를 사용하여 변수가 존재하는지 확인할 수 있습니다. a가 존재하지 않으면(선언되지 않음) 오류가 발생하므로 if(a)를 사용하십시오. Array 및 Null과 같은 특수 객체에 typeof를 사용하면 항상 object가 반환됩니다.

배열은 동일한 이름을 가진 여러 입력과 같이 js에서 자주 사용됩니다. 동적으로 생성되는 경우 제출 시 배열인지 여부를 확인해야 합니다.

    if(document.mylist.length != "undefined" ) {} //这个用法有误.
    正确的是 `if( typeof(document.mylist.length) != "undefined" ) {}` 

     或 `if( !isNaN(document.mylist.length) ) {}`
로그인 후 복사

typeof의 피연산자는 정의되지 않으며 반환되는 값입니다.

JavaScript에서는 typeof 연산자를 사용하여 변수 유형을 결정하는 데 자주 사용됩니다. 참조 유형을 사용하여 값을 저장할 때 문제가 발생합니다. "개체"를 반환합니다. 객체가 다른 객체의 인스턴스인지 여부를 감지하려면 인스턴스가 필요합니다.

instanceof

instanceof 연산자는 객체의 프로토타입 체인에 생성자의 프로토타입 속성이 있는지 테스트하는 데 사용됩니다.

구문: ​​object 인스턴스of 생성자
매개변수: 개체(감지할 개체) 생성자(생성자)
설명: 인스턴스오브 연산자는 매개변수 개체의 프로토타입 체인에 constructor.prototype이 존재하는지 여부를 감지하는 데 사용됩니다.

instance: 인스턴스, example

a instanceof b?alert("true"):alert("false"); //a는 b의 인스턴스인가요? True: False

instanceof는 변수가 객체의 인스턴스인지 확인하는 데 사용됩니다.

如 :var a=new Array();

alert(a instanceof Array); // true,

同时 alert(a instanceof Object) //也会返回 true;

这是因为 Array 是 object 的子类。



再如:function test(){};

var a=new test();

alert(a instanceof test) 会返回true

alert(a==b);  //flase
로그인 후 복사

Case:

另外,更重的一点是 `instanceof` 可以在继承关系中用来判断一个实例是否属于它的父类型。

例如:

function Foo(){} 
Foo.prototype = new Aoo();//JavaScript 原型继承 
var foo = new Foo(); 
console.log(foo instanceof Foo)//true 
console.log(foo instanceof Aoo)//true

上面的代码中是判断了一层继承关系中的父类,在多层继承关系中,instanceof 运算符同样适用。


又如:

console.log(Object instanceof Object);//true 
console.log(Function instanceof Function);//true 
console.log(Number instanceof Number);//false 
console.log(String instanceof String);//false  
console.log(Function instanceof Object);//true  
console.log(Foo instanceof Function);//true 
console.log(Foo instanceof Foo);//false
로그인 후 복사
// 定义构造函数
function C(){} 
function D(){} 

var o = new C();

// true,因为 Object.getPrototypeOf(o) === C.prototype
o instanceof C; 

// false,因为 D.prototype不在o的原型链上
o instanceof D; 

o instanceof Object; // true,因为Object.prototype.isPrototypeOf(o)返回true
C.prototype instanceof Object // true,同上

C.prototype = {};
var o2 = new C();

o2 instanceof C; // true

o instanceof C; // false,C.prototype指向了一个空对象,这个空对象不在o的原型链上.

D.prototype = new C(); // 继承
var o3 = new D();
o3 instanceof D; // true
o3 instanceof C; // true
로그인 후 복사

instanceof에 관해서는 함수의 인수인 질문을 하나 더 삽입해야 합니다. 모두가 인수가 Array 라고 생각할 수 있지만, 테스트를 위해 instanceof 를 사용하면 인수가 비슷해 보이지만 Array 객체가 아니라는 것을 알게 될 것입니다.

또한:

Test var a=new Array();if (객체 인스턴스) Alert('Y');else Alert('N');

got'Y'

but if (창 인스턴스 오브 객체) ) Alert('Y');else Alert('N');

gets'N'

그래서 여기에서 instanceof로 테스트한 객체는 dom 모델 객체가 아닌 js 구문의 객체를 참조합니다.

typeof

alert(typeof(window))를 사용하면 객체를 얻을 때 약간의 차이가 있습니다

식이 obj instanceof Foo가 true를 반환한다고 해서 식이 항상 true를 반환한다는 의미는 아닙니다. 왜냐하면 Foo .prototype 속성의 값이 변경될 수 있고, 변경된 값이 obj의 프로토타입 체인에 존재하지 않을 수 있기 때문입니다. 이 경우 원래 표현식의 값은 false가 됩니다. 또 다른 경우에는 원래 표현식의 값도 변경됩니다. 즉, 객체 obj의 프로토타입 체인이 변경됩니다. 비록 현재 ES 사양에서는 객체의 프로토타입을 읽을 수만 있고 변경할 수는 없지만 비표준 __proto__ 마법 속성의 도움을 받을 수 있습니다. 예를 들어, obj.__proto__ = {}를 실행한 후 obj instanceof Foo는 false를 반환합니다.

예: String 객체와 Date 객체가 모두 Object 유형에 속함을 보여줍니다.
다음 코드는 String 및 Date 객체도 Object 유형에 속함을 증명하기 위해 instanceof를 사용합니다.

rreee

위 내용은 JavaScript에서 typeof와 instanceof의 차이점 소개(코드 예)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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