详解js中的typeof

154 阅读2分钟

首先要给出的当然是这张值表:

表达式返回值
typeof true'boolean'
typeof 123'number'
typeof "abc"'string'
typeof function(){}'function'
typeof []'object'
typeof {}'object'
typeof null'object'
typeof undefined'undefined'
typeof unknownVariable'undefined'

从这张表可以看出,如果需要用typeof来判断类型,只有‘boolean’、‘number’、'string'、‘function’三种类型是靠谱的,用于判断其他类型会出现不可预期的错误请谨慎使用

针对typeof的软肋,我们有一些比较好的解决方式:

  • 判断Array 要使用Array.isArray(arr);
  • 判断null请使用myVar === null;
  • 判断某个全局变量是否存在用typeof window.myVar=== 'undefined';
  • 函数内部判断某个变量是否存在用typeof myVar === 'undefined'。

但是通过以上解决方法,我们还是没有办法判断 typeof myVar === 'undefined'的时候具体是定义还是未定义

于是我们想出了另外一种解决方案,可以封装成一个函数:

function isDefined(va) {
	//var va;
	//var va = null;
	//var va = 'xxxx';
	try{
	    // 已经声明
	    // 判断是否已经定义
	    if (va === undefined){ 
	    // 不能使用 ==,因为当 "var va = null;"时 被判定为未定义是错误的。
	    //if (typeof  va === 'undefined'){  // 这种方式也是不可取的。
	        // 未定义
	        window.console && console.log("变量未定义.");
	    }else {
	        // 已经定义了,可能为null 
	        window.console && console.log("变量已定义.");
	    }
	} catch(e){
	    // va 未声明
	    window.console && console.log("变量未声明,");
	}
}

判断数据类型得以完美解决~

ps: 用Object.prototype.toString.call()判断类型最爽~ 我们可以封装成一个简单的工具函数来判断类型,做项目的时候引入或者mixin就可以用了:

/**
* 判断一个变量哪种类型
* @param {*} obj - 待判断变量
* @returns {string} 类型名称
*/
export function typeOf(obj) {
 return toString.call(obj).slice(8, -1).toLowerCase()
}

试试吧骚年~