JS 中的数据类型检测方案

  1. typeof
1
2
3
4
5
6
7
8
9
10
11
12
console.log(typeof 1);               // number
console.log(typeof true);            // boolean
console.log(typeof 'mc');            // string
console.log(typeof Symbol)           // function
console.log(typeof Symbol());        // symbol
console.log(typeof function(){});    // function
console.log(typeof console.log());   // undefined
console.log(typeof []);              // object
console.log(typeof {});              // object
console.log(typeof null);            // object
console.log(typeof undefined);       // undefined

优点：能够快速区分基本数据类型

缺点：不能将 Object、Array 和 Null 区分，都返回 object

  1. instanceof
1
2
3
4
5
6
console.log(1 instanceof Number);                    // false
console.log(true instanceof Boolean);                // false
console.log('str' instanceof String);                // false
console.log([] instanceof Array);                    // true
console.log(function(){} instanceof Function);       // true
console.log({} instanceof Object);                   // true

优点：能够区分 Array、Object 和 Function，适合用于判断自定义的类实例对象

缺点：Number，Boolean，String 基本数据类型不能判断

  1. Object.prototype.toString.call()
1
2
3
4
5
6
7
8
9
var toString = Object.prototype.toString;
console.log(toString.call(1));                      //[object Number]
console.log(toString.call(true));                   //[object Boolean]
console.log(toString.call('mc'));                   //[object String]
console.log(toString.call([]));                     //[object Array]
console.log(toString.call({}));                     //[object Object]
console.log(toString.call(function(){}));           //[object Function]
console.log(toString.call(undefined));              //[object Undefined]
console.log(toString.call(null));                   //[object Null]

优点：精准判断数据类型

缺点：写法繁琐不容易记，推荐进行封装后使用

var && let && const

ES6 之前创建变量用的是 var,之后创建变量用的是 let/const

三者区别：

  • var 定义的变量，没有块的概念，可以跨块访问, 不能跨函数访问。
  • let 定义的变量，只能在块作用域里访问，不能跨块访问，也不能跨函数访问。
  • const 用来定义常量，使用时必须初始化(即必须赋值)，只能在块作用域里访问，且不能修改。
  • var 可以先使用，后声明，因为存在变量提升；let 必须先声明后使用。
  • var 是允许在相同作用域内重复声明同一个变量的，而 let 与 const 不允许这一现象。
  • 在全局上下文中，基于 let 声明的全局变量和全局对象 GO（window）没有任何关系 ;
  • var 声明的变量会和 GO 有映射关系；
  • 会产生暂时性死区：

暂时性死区是浏览器的 bug：检测一个未被声明的变量类型时，不会报错，会返回 undefined
如：console.log(typeof a) //undefined
而：console.log(typeof a)//未声明之前不能使用
let a

  • let /const/function 会把当前所在的大括号(除函数之外)作为一个全新的块级上下文，应用这个机制，在开发项目的时候，遇到循环事件绑定等类似的需求，无需再自己构建闭包来存储，只要基于 let 的块作用特征即可解决