JavaScript基础（三）typeof操作符

typeof操作符

typeof操作符返回一个字符串，表示未经计算的操作数的类型

typeof operand
typeof (operand)

类型	结果
undefined	"undefined"
null	"object"
Boolean	"boolean"
Number	"number"
String	"string"
Symbol	"symbol"
宿主对象(Js环境提供)	Implementation-dependent
函数对象	"function"
其他对象	"object"

// Numbers
typeof 37 === 'number';
typeof 3.14 === 'number';
typeof Math.LN2 === 'number';
typeof Infinity === 'number';
typeof NaN === 'number'; // 尽管NaN是"Not-A-Number"的缩写
typeof Number(1) === 'number'; // 但不要使用这种形式!

// Strings
typeof "" === 'string';
typeof "bla" === 'string';
typeof (typeof 1) === 'string'; // typeof总是返回一个字符串
typeof String("abc") === 'string'; // 但不要使用这种形式!

// Booleans
typeof true === 'boolean';
typeof false === 'boolean';
typeof Boolean(true) === 'boolean'; // 但不要使用这种形式!

// Symbols
typeof Symbol() === 'symbol';
typeof Symbol('foo') === 'symbol';
typeof Symbol.iterator === 'symbol';

// Undefined
typeof undefined === 'undefined';
typeof declaredButUndefinedVariable === 'undefined';
typeof undeclaredVariable === 'undefined'; 

// Objects
typeof {a:1} === 'object';

// 使用Array.isArray 或者 Object.prototype.toString.call
// 区分数组,普通对象
typeof [1, 2, 4] === 'object';

typeof new Date() === 'object';

// 下面的容易令人迷惑，不要使用！
typeof new Boolean(true) === 'object';
typeof new Number(1) === 'object';
typeof new String("abc") === 'object';

// 函数
typeof function(){} === 'function';
typeof class C{} === 'function'
typeof Math.sin === 'function';
typeof new Function() === 'function';

null

在 JavaScript 最初的实现中，JavaScript 中的值是由一个表示类型的标签和实际数据值表示的。对象的类型标签是 0。由于 null 代表的是空指针（大多数平台下值为 0x00），因此，null的类型标签也成为了 0，typeof null就错误的返回了"object"。（reference）

使用new操作符

// All constructor functions while instantiated with 'new' keyword will always be typeof 'object'
var str = new String('String');
var num = new Number(100);

typeof str; // It will return 'object'
typeof num; // It will return 'object'

// But there is a exception in case of Function constructor of Javascript

var func = new Function();

typeof func; // It will return 'function'

语法中的括号

// Parentheses will be very much useful to determine the data type for expressions.
var iData = 99;

typeof iData + ' Wisen'; // It will return 'number Wisen'
typeof (iData + ' Wisen'); // It will return 'string'

正则表达式

对正则表达式字面量的类型判断在某些浏览器中不符合标准：

typeof /s/ === 'function'; // Chrome 1-12 , 不符合 ECMAScript 5.1
typeof /s/ === 'object'; // Firefox 5+ , 符合 ECMAScript 5.1

暂存死区

块级作用域 let const，在声明之前进行typeof操作会抛出一个ReferenceError。块级作用域在块的头部处于"暂时性死区“，知道被初始化，在这期间访问变量会引发错误。

例外

typeof document.all === 'undefined'

IE

在IE 6,7和8上，很多宿主对象是对象而不是函数。例如：

typeof alert === 'object'

常见问题

1. typeof 的返回值总共有多少个？

答："number","string","boolean","undefined","object","function","symbol"这7个返回值

2. typeof 为什么要区分object和function？

答：函数在ECMAScript中是对象，不是一种数据类型，函数还包含一些特殊属性，因此有必要使用typeof来区分。实际使用过程中有这个需求。

3.typeof的不足之处有哪些

答：typeof操作符不能准确的区分对象，数组，正则。返回值为"object"。部分早期浏览器版本对正则对象返回"function"。IE67中typeof alert //object，其他浏览器type alert //function

4.判断下列表达式的值

typeof 1/0   //NaN
typeof (1/0)  //number
typeof typeof 1/0 // NaN
typeof typeof (1/0) // string
typeof (typeof 1/0) // number

5.用typeof来判断对象的潜在陷阱是什么

答：JavaScript对于typeof []==='object',typeof null === 'object',typeof function(){}==='function',所以在使用typeof来做判断时需要考虑这些情况。当然也可以选择替代方法，Object.prototype.toString.call([])来进行判断，返回值类似于[object Array],可以加上正则处理为 Object.prototype.toString.call([]]).replace(/\[object\s|\]/g,'')

参考资料：

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/typeof