JavaScript_javascript 기술에서 instanceof와 typeof 연산자의 사용법과 차이점에 대한 자세한 분석

JavaScript에서 Instanceof와 typeof는 변수(인스턴스)의 유형을 결정하는 데 자주 사용되지만 용도는 여전히 다릅니다.

typeof 연산자
는 표현식의 데이터 유형을 나타내는 문자열을 반환합니다.

표현 유형 ;

expression 매개변수는 유형 정보를 찾아야 하는 표현식입니다.

설명
typeof는 피연산자 앞에 배치되는 단항 연산자입니다.

typeof 연산자는 유형 정보를 문자열로 반환합니다. typeof의 가능한 반환 값은 "number", "string", "boolean", "object", "function" 및 "undefine"의 6가지입니다.

(ECMAScript에는 Undefine, Null, Boolean, Number 및 String의 5가지 기본 유형이 있습니다.)

참고:

1. 위에서 ECMAScript의 5가지 기본 유형을 언급했습니다. typeof 연산자를 사용할 때 "객체 유형"과 "객체 값"(리터럴 값)의 차이를 구체적으로 구분해야 합니다. 예를 들어 Boolean 객체는 Boolean 기본 유형의 참조 유형이고, Boolean 객체의 가능한 두 가지 객체 값은 true와 false입니다. ECMAScript의 미리 정의된 객체(다른 언어의 클래스와 반대)를 해당 유형의 기본 값에 대한 캡슐화(또는 래퍼)로 생각할 수 있습니다. ECMAScript의 미리 정의된 모든 객체는 Object 객체에서 상속됩니다. 따라서 다음과 같은 상황이 존재합니다.

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

　var testvar = new Number(68 );
Alert(typeof testvar); //"객체" 출력
testvar= 68;
Alert(typeof testvar); //"숫자" 출력

또 다른 예 :

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

function Person( ){}
document.write ("
typeof(Person):" typeof(Person)) //function
var person = new Person();
document.write ("< ;br>typeof(사람): " typeof(사람)); //객체

注意：从传统意义上来说，ECMAScript 并不真正具有类。事实上，除了说明不存在类，在 ECMA-262 中根本没有出现“类”这个词。ECMAScript 定义了“对象定义”，逻辑上等价于其他程序设计语言中的类。

另外：这些预定义对象覆盖了Object 对象的 ValueOf() 方法，返回其原始值。而这些对象的所有属性和方法都可应用于相应类型的原始值上，因为它们是伪对象。

2、typeof 运算符对于 null 值会返回 "Object"。这实际上是 JavaScript 最初实现中的一个错误，然后被 ECMAScript 沿用了。现在，null 被认为是对象的占位符，从而解释了这一矛盾，但从技术上来说，它仍然是原始值。

提示：

1、值 undefined 并不同于未定义的值。但是，typeof 运算符并不真正区分这两种值。考虑下面的代码：

var oTemp;
alert(typeof oTemp);  //输出 "undefined"
alert(typeof oTemp2);  //输出 "undefined"

前面的代码对两个变量输出的都是 "undefined"，即使只有变量 oTemp2 从未被声明过。如果对 oTemp2 使用除 typeof 之外的其他运算符的话，会引起错误，因为其他运算符只能用于已声明的变量上。

2、当函数无明确返回值时，返回的也是值 "undefined"，如下所示：

function testFunc() {}
alert(testFunc() == undefined);  //输出 "true"3、类型Null，它只有一个专用值 null，即它的字面量。值 undefined 实际上是从值 null 派生来的，因此 ECMAScript 把它们定义为相等的。

alert(null == undefined);  //输出 "true"
尽管这两个值相等，但它们的含义不同：

undefined 是声明了变量但未对其初始化时赋予该变量的值 或 未声明过的变量（只能用于typeof，但作为赋值目标时编译器会自动将其声明为全局变量）。

null 则用于表示尚未存在的对象（即对象为空，或对象找不到）。如果函数或方法要返回的是对象，那么找不到该对象时，返回的通常是 null。

3、我们可以使用 typeof 来获取一个变量是否存在，如 if(typeof a!="undefined"){alert("ok")}，而不要去使用 if(a) 因为如果 a 不存在（未声明）则会出错。

对于 Array,Null 等特殊对象使用 typeof 一律返回 object，这正是 typeof 的局限性。如果我们希望获取一个对象是否是数组，或判断某个变量是否是某个对象的实例则要选择使用instanceof。

instanceof 运算符
在使用 typeof 运算符时采用引用类型存储值会出现一个问题，无论引用的是什么类型的对象，它都返回 "object"。ECMAScript 引入了另一个 Java 运算符 instanceof 来解决这个问题。

instanceof 运算符与 typeof 运算符相似，用于识别正在处理的对象的类型。与 typeof 方法不同的是，instanceof 方法要求开发者明确地确认对象为某特定类型。例如：

var oStringObject = new String("hello world");
alert(oStringObject instanceof String); //输出 "true"
这段代码问的是“变量 oStringObject 是否为 String 对象的实例？”oStringObject 的确是 String 对象的实例，因此结果是 "true"。尽管不像 typeof 方法那样灵活，但是在 typeof 方法返回 "object" 的情况下，instanceof 方法还是很有用的。

instanceof运算符

是一个二元运算符。返回一个 Boolean 值，指出对象是否是特定类的一个实例。

expression  instanceof class

参数

 expression  必选项。任意对象表达式。

 class　　必选项。任意已定义的对象类。

说明
如果 object 是 class 的一个实例，则 instanceof 运算符返回 true 。如果 object不是指定类的一个实例，或者 object 是 null ，则返回 false 。

用于判断一个变量是否某个对象的实例，

如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。

注意：

关于function 的 arguments，我们大家也许都认为 arguments 是一个 Array，但如果使用 instaceof 去测试会发现 arguments 不是一个 Array 对象，尽管看起来很像。

此外还有类似的情况，例如：

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

그러나 if (window instanceof Object) Alert('Y');else Alert('N')은 'N'입니다

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

현재 typeof를 사용할 때 몇 가지 차이점이 있습니다. 경고(typeof(window))는 객체를 가져옵니다

확장: JavaScript에서 instanceof 연산자의 원리는 무엇입니까?

js를 배우면서 js의 인스턴스가 특정 유형에 속하는지 판단할 때 함수 Person()과 같은 인스턴스 오브 연산자를 사용할 수 있다는 것을 배웠습니다.{}

var person = new Person(); 경고(person 인스턴스of Person);//true를 반환합니다

그럼 Instanceof 연산을 실행하고 true/false를 반환할 때 어떤 판단이 내려졌나요?

Person.prototype의 참조와 사람의 내부 포인터 [[prototype]]이 동일한지 판단하여 결과를 얻은 것이 아닐까요?

실제로 생성자의 프로토타입 속성이 가리키는 프로토타입 객체를 인스턴스의 "프로토타입 객체 체인"에서 찾을 수 있으면 true가 반환됩니다.

프로토타입은 전혀 인스턴스의 속성이 아니지만(또는 인스턴스의 프로토타입 속성이 정의되지 않음) 프로토타입 객체의 속성이 변조된 경우 이 판단 방법은 올바르게 반환될 수 없습니다.

그리고 원하는 결과를 얻기 위해 person.constructor == Person을 직접 판단할 수도 있나요?

다음 JavaScript 코드를 테스트해 보겠습니다.

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

function Person(name,sex){this.name=name;this.sex=sex;}
document.write ("
typeof Person:" typeof Person);
document .write ("< ;br>typeof Person.prototype:" typeof Person.prototype);
document.write ("
typeof Person.constructor:" typeof Person.constructor);
var person = new Person();

document.write("

var person = new Person();");
document.write("
사람 유형:" 사람 유형);
document.write("
사람 유형.prototype:" 사람 유형.prototype);
document.write("사람 유형.생성자:" 사람 유형.생성자);

document.write("

Function.constructor:" Function.constructor);

document.write("

Function.prototype:" Function.prototype );

document.write("

Person.constructor:" Person.constructor);

document.write("

Person.prototype:" Person.prototype );

document.write("

person.constructor:" person.constructor);
document.write("

person.prototype:" person.prototype);

출력은 다음과 같습니다.

Person 유형:기능

Person.prototype 유형:object
Person.constructor 유형:function

var person = new Person();

사람 유형:객체
사람 유형.프로토타입:정의되지 않음
사람 생성자 유형:함수

Function.constructor:function Function() { [네이티브 코드] }
Function.prototype:function Empty() {}

Person.constructor:function Function() { [네이티브 코드] }

Person.prototype:[객체 객체]

person.constructor:function 사람(이름, 성별){this.name=name;this.sex=sex;}

person.prototype:정의되지 않음

함수와 유사하게 Number()는 Number 객체의 생성자입니다. Number()는 매개변수를 숫자 유형으로 변환하고 변환 결과를 반환하는 데 사용됩니다(변환할 수 없는 경우 NaN을 반환합니다).

생성자는 JavaScript에서 덜 일반적으로 사용됩니다. Variable.constructor는 객체 클래스의 생성자의 문자열 표현을 반환합니다.

그런 다음 JavaScript에서 데이터 유형을 판단할 때 다음 방법을 사용하여 자세한 데이터 유형을 얻을 수 있습니다.

if((typeof a=="object") && (a.constructor==Array)){

…
}

참고: 생성자는 기존 변수만 판단할 수 있지만 typeof는 선언되지 않은 변수나 빈 개체(정의되지 않음 반환)를 판단할 수 있습니다.