如何判断变量类型

2018-05-10  本文已影响0人  雪人苏苏_

在JS中如何判断变量的类型属于基础知识,很多时候我们会忽略。毕竟上手代码的时候可以现查。无论如何演变,我想基本功还是很重要的,熟练掌握总是百利而无一害。

1、首先第一种就是我们常用的typeof(),它会将类型信息当作字符串返回。如下:

console.log(typeof undefined); //undefined
console.log(typeof 5); //number
console.log(typeof true); //boolean
console.log(typeof 'hello world!'); //string

很完美对不对?但我们知道,这个世界几乎没有什么是完美的。看看下面的栗子就知道了:

console.log(typeof ['h', 'e', 'l', 'l', 'o']); //object
console.log(typeof { name: 'susu', age: 3 }); //object
console.log(typeof null); //object
console.log(typeof new Date()); //object

打印出来的结果都是object类型。通过上面的打印结果,我们知道typeof在判断变量类型的时候比较适合用来处理基本数据类型,如果是引用类型的值,typeof恐怕就心有余而力不足了。

2、instanceof:该运算符用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。

let arr = [1, 2, 3];
let obj = { name: 'susu', age: 3 };
console.log(obj instanceof Array); //false
console.log(obj instanceof Object); //true

通过instanceof很容易就能判断一个变量是数组还是对象,貌似比typeof要高级了一些。但如果遇到数组,情况可能跟我们想象的不一样了。

let arr = [1, 2, 3];
console.log(arr instanceof Array); //true
console.log(arr instanceof Object); //true

为什么都是true呢?看看上面instanceof运算符的定义,是用来测试一个对象在原型链上是否存在一个构造函数的prototype属性。只要熟悉原型链就会知道,每个对象都有一个proto属性,指向创建该对象的函数的prototype。instanceof的判断规则是通过proto和prototype能否找到同一个引用对象。通过打印下面的等式,我们就能知道为什么上面的栗子都会打印出true。

console.log(arr.__proto__.__proto__ === Object.prototype); //true
console.log(arr.__proto__ === Array.prototype); //true

3、constructor:此属性返回对创建此对象的数组函数的引用

let arr = [1, 2, 3];
let obj = { name: 'susu', age: 3 };
console.log(arr.constructor === Array); //true
console.log(arr.constructor === Object); //false
console.log(obj.constructor === Array); //false
console.log(obj.constructor === Object); //true

4、Object.prototype.toString.call():在js中该方法可以精准的判断对象类型,也是推荐使用的方法。

可以判断基本数据类型:

console.log(Object.prototype.toString.call(3)); //[object Number]
console.log(Object.prototype.toString.call(true)); //[object Boolean]
console.log(Object.prototype.toString.call(null)); //[object Null]
console.log(Object.prototype.toString.call('hello')); //[object String]
console.log(Object.prototype.toString.call(undefined)); //[object Undefined]

也可以判断引用数据类型:

let arr = [1, 2, 3];
let obj = {name: 'susu', age: 3};
let date = new Date();
function fn(){console.log('hello world!')}; 
       
console.log(Object.prototype.toString.call(arr)); //[object Array]    
console.log(Object.prototype.toString.call(obj)); //[object Object]      
console.log(Object.prototype.toString.call(date)); //[object Date]      
console.log(Object.prototype.toString.call(fn)); //[object Function]

以上。

上一篇 下一篇

猜你喜欢

热点阅读