How to judge the data type of JavaScript?

Typeof

We all use typeof as a command to judge the data type, which is sufficient to meet the needs of data type judgment in normal scenarios:

var obj = {
    
    
   name: 'zhangxiang'
};

function foo() {
    
    
    console.log('this is a function');
}

var arr = [1,2,3];

console.log(typeof 1);  // number
console.log(typeof '1');  //string
console.log(typeof true);  //boolean
console.log(typeof null); //object
console.log(typeof undefined); //undefined
console.log(typeof obj); //object
console.log(typeof foo);  //function
console.log(typeof arr);   //object复制代码

It can be seen that the typeof command can judge all basic data types in javascript (Null, Undefined, Boolean, String, Number), although null uses typeof to return an object string, but it does not hinder its basic use, but in some
complex For different scenarios such as object and null, array and object, function and object, etc., typeof will appear to have insufficient energy.
So in general, typeof will be used in relatively simple scenarios, for example, you can almost determine the data What kind of data is it and then differentiate it a little bit. Give a simple example to illustrate the situation:

function unique(array){
  var hash = {};
  var result = [], key;
  array.forEach(function(item, index){
    key = item;
    if(typeof item === 'string') {
      key = '_' + item;
    }
    if(!hash[key]) {
      result.push(item);
    } else {
      hash[key] = true;
    }
  });
  return result;
}复制代码

instanceof

instanceof is actually suitable for judging custom class instance objects, not for judging native data types, for example:

// a.html
<script>
  var a = [1,2,3];
</script>复制代码
//main.html
<iframe src="a.html"></iframe>

<script>
  var frame = window.frame[0];
  var a = frame.a;
  console.log(a instanceof Array);  // false
  console.log(a.contructor === Array);  //false
  console.log(a instanceof frame.Array); // true
</script>复制代码

What causes the above results? In fact, iframes do not share the prototype chain, because they have independent execution environments, so the array a in frame a will not be an instance object of this execution environment. Reliable, like through
the unique array (or other data type) methods or properties of contructor sort, slice, etc., if there are sort and slice properties in the object, misjudgment will occur. So the most reliable method is to use Object .prototype.toString method.

Object.prototype.toString

Using the Object.prototype.toString method, you can get the exact type of the variable.

function foo(){
    
    };

Object.prototype.toString.call(1);  '[object Number]'
Object.prototype.toString.call('1'); '[object String]'
Object.prototype.toString.call(NaN); '[object Number]'
Object.prototype.toString.call(foo);  '[object Function]'
Object.prototype.toString.call([1,2,3]); '[object Array]'
Object.prototype.toString.call(undefined); '[object Undefined]'
Object.prototype.toString.call(null); '[object Null]'
Object.prototype.toString.call(true); '[object Boolean]'
....复制代码

The principle of Object.prototype.toString is that when called, it takes the value of the internal [[Class]] attribute value, and then concatenates it into a string like '[object ' + [[Class]] + ']' and returns it. Then we use the call method to get the data type of any value.