Detailed explanation on the use of js type judgment

This time I will bring you a detailed explanation of the use of js type judgment. What are the precautions for using js type judgment? . The following is a practical case, let's take a look.

jsType conversiontypeof will also recognize null as object, and the returned type is less. We use Object.prototype.toString to achieve

First edition

function isArray(value){
  return Object.prototype.toString.call(value) === "[object Array]";
}
function isFunction(value){
  return Object.prototype.toString.call(value) === "[object Function]";
}

But writing it this way, it is very troublesome to judge arrays, functions, and objects one by one. It is more procedural

Second edition

We want to use type(obj) to return the corresponding type String, because typeof is lowercase, so we also return the lowercase standard

function type(obj){
  // -1 代表截止到倒数一位
  return Object.prototype.toString.call(obj).slice(8,-1).toLowerCase()
}
type([]) // "array"

But this will happen every time The need to slice and toLowerCase the judged types is also relatively performance-intensive, and there are only a few judged types, so we can use objects to cache possible results in advance

third edition

//将types放外面 而不是放在type函数里面, 利用闭包,优化性能,不用每次判断都声明一次typess
var types = {
  '[object Function]': 'function',
  '[object Number]': 'number',
  ...
}
function type(obj) {
  var str = Object.prototype.toString.call(obj)
  return types[str]
}

Of course we can also optimize the above types in this way

// 参考自jquery源码
var types = {}
当然也可以直接用数组存储
"Boolean Number String Function Array Date RegExp Object Error".split(" ").forEach(function(e,i){
  types [ "[object " + e + "]" ] = e.toLowerCase();
}) ;

Judgewindow object

Use the window attribute of the window object to equal Self

function isWindow( obj ) {
  // obj !== undefined 是为了防止没传参数的时候后面报错
  // Uncaught TypeError: Cannot read property 'window' of undefined的错误
  
  return obj !== undefined && obj === obj.window;
}

Judge whether it is a dom element

isElement = function(obj) {
  return !!(obj && obj.nodeType === 1);
}

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the PHP Chinese website!

Recommended reading:

How to use the v-model directive in vue.js to achieve two-way data binding

How to use swiper

in vue

The above is the detailed content of Detailed explanation on the use of js type judgment. For more information, please follow other related articles on the PHP Chinese website!