前言

类型判断是我们在日常工作中经常会遇到的一个功能,本文将给大家详细介绍关于 类型判断的相关内容,下面话不多说了,来一起看看详细的介绍吧

中数据类型分为两种:

  • 简单数据类型:Undefined, NULL, Boolean, Number, String
  • 复杂数据类型:

接下来我们就来看看怎么做数据类型判别吧?

首先来看看 typeof

Type Result
Undefined "undefined"
Null " " (see below)
Boolean "boolean"
Number "number"
String "string"
Symbol (new in ECMA 2015) "symbol"
Host (provided by the JS environment) Implementation-dependent
Function (implements [[Call]] in ECMA-262 terms) "function"
Any other " "

来点code demo吧

let a = undefined;
typeof a
"undefined"

let b = false;
typeof b
"boolean"

let c = 12;
typeof c
"number"

let d = '12';
typeof d
"string"

let f = function () {};
typeof f
"function"

接下来我们就来看看那些奇怪的现象吧

let str = new String('abc');
typeof str
" "

let num = new Number(12);
typeof num
" "

var func = new Function();
typeof func; 
"function"

typeof null
" "

使用构造函数创建的变量,使用typeof判断会返回“ ”结果,但是Function函数例外,由它创建的变量typeof返回的是“function”

接着就来说说typeof null == " "。这个相信前端开发的小伙伴都知道是这个结果了,But why? 这其实是 第一个版本就存在的一个bug,历史原因可以看看这篇文章The history of typeof null

关于如何判断数组

let arr = [1, 2, 3];
typeof arr
" "

上面这个结果大家应该不陌生,那该如何正确判断数组类型呢

1、instanceof

arr instanceof Array //true

2、isArray

Array.isArray(arr) // true

3、constructor.name

arr.constructor.name // "Array"

第三种用法用的人应该比较少,不少前端的的小伙伴都没用过。对于复杂类型 ,它的每个实例都有constructor属性。

instanceof vs isArray

当检测Array实例时, Array.isArray 优于 instanceof,因为Array.isArray能检测 s.

var   = document.createElement(' ');
document.body.appendChild( );
xArray = window. s[window. s.length-1].Array;
var arr = new xArray(1,2,3); // [1,2,3]

// Correctly checking for Array
Array.isArray(arr); // true
// Considered harmful, because doesn't work though  s
arr instanceof Array; // false

这段代码是从MDN copy的。补充以下结果,发现第三种方法constructor.name也能正确判断出。

arr.constructor.name //"Array"

关于NaN

使用isNaN判断NaN。

isNaN(1/'a') // true

我们知道NaN == NaN结果是false,那如何判断两个NaN变量呢?

比较两个NaN变量,使用es6的 .is()即可。

let nan1 = NaN
let nan2 = NaN
 .is(nan1, nan2)
true

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对脚本之家的支持。

收藏 打印