JS four kinds of judgment data types of methods: typeof, instanceof, constructor, Object.prototype.toString.call ()

1.typeof

Copy the code
1 console.log(typeof "");  //string
2 console.log(typeof 1);  //number
3 console.log(typeof true);  //boolean
4 console.log(typeof null);  //object
5 console.log(typeof undefined);  //undefined
6 console.log(typeof []);  //object
7 console.log(typeof function(){});  //function
8 console.log(typeof {});  //object
Copy the code

Console output:

Analyzing the basic data types typeof is no problem, but encountered reference data types (eg: Array) is ineffective.

2.instanceof

Copy the code
1 console.log("1" instanceof String);
2 console.log(1 instanceof Number);
3 console.log(true instanceof Boolean);
4 //            console.log(null instanceof Null);
5 //            console.log(undefined instanceof Undefined);
6 console.log([] instanceof Array);
7 console.log(function(){} instanceof Function);
8 console.log({} instanceof Object);
Copy the code

Disregarding null and undefined (two special), the console output:

You can see the first three basic data types are created with object literal, but it is not an example of its class, this is a bit strange. Behind the reference data are three types, the correct result can be obtained. If we are to create the basic data types through new keywords, you will find that, then it will output true, as follows:

Why come to talk about took null and undefined Why is rather special, in fact, logically speaking, belongs to the class is null Null, undefined is Undefined, but it is not: the console output the following results:

The browser simply does not know these two goods, direct error. In the first instance you may have discovered, the result of typeof null is object, typeof undefined result is undefined

In particular null, in fact, this is a failure js design, early type ready to change the null is null, because at that time already had a lot of sites use a null, if the change will result in logic many sites loophole in question, there is no change over, so it has been left until now. As learners, we only need to remember just fine.

3.constructor

Copy the code
1 console.log(("1").constructor === String);
2 console.log((1).constructor === Number);
3 console.log((true).constructor === Boolean);
4 //console.log((null).constructor === Null);
5 //console.log((undefined).constructor === Undefined);
6 console.log(([]).constructor === Array);
7 console.log((function() {}).constructor === Function);
8 console.log(({}).constructor === Object);
Copy the code

(Here still put aside null and undefined) At first glance, constructor seems perfectly cope with basic data types and reference data types, data types can be detected, in fact not the case, look at why:

Copy the code
1 function Fn(){};
2 
3 Fn.prototype=new Array();
4 
5 var f=new Fn();
6 
7 console.log(f.constructor===Fn);
8 console.log(f.constructor===Array);
Copy the code

我声明了一个构造函数,并且把他的原型指向了Array的原型,所以这种情况下,constructor也显得力不从心了。

看到这里,是不是觉得绝望了。没关系,终极解决办法就是第四种办法,看过jQuery源码的人都知道,jQuery实际上就是采用这个方法进行数据类型检测的。

4.Object.prototype.toString.call()

Copy the code
 1 var a = Object.prototype.toString;
 2 
 3 console.log(a.call("aaa"));
 4 console.log(a.call(1));
 5 console.log(a.call(true));
 6 console.log(a.call(null));
 7 console.log(a.call(undefined));
 8 console.log(a.call([]));
 9 console.log(a.call(function() {}));
10 console.log(a.call({}));
Copy the code

Reference blog: https://www.cnblogs.com/xuniannian/p/7452086.html

Reference blog: https://www.cnblogs.com/zt123123/p/7623409.html

Guess you like

Origin www.cnblogs.com/nayek/p/11671747.html