面试题 封装函数判断数据类型
在js中有哪些数据类型
在javascript中数据类型可以分为两大类:一个是基本数据类型 另一个是引用数据类型
基本数据类型:string
number
boolean
undefined
null
symbol
引用数据类型:Object
js中判断数据类型的方法
1.typeof
能够返回部分数据正确的数据类型,但是有一些数据无法返回正确的数据类型。
typeof使用实例
console.log(typeof '') // string
console.log(typeof 1) // number
console.log(typeof Symbol()) // symbol
console.log(typeof true) // boolean
console.log(typeof undefined) // undefined
console.log(typeof null) // object
console.log(typeof []) // object
console.log(typeof new Date()) // object
console.log(typeof new RegExp()) // object
2.instanceof
用来判断 A 是否是 B 的实例。
function A(){
}
const b = new A()
// 我们这里就说 b 是 A 的一个实例对象
// 也可以说是 b 是从 A 构造而来,A 是 b 的构造函数
instanceof使用实例
console.log(b instanceof A) // true
console.log([] instanceof Array) // true
console.log({
} instanceof Object) // true
instanceof 也存在一个问题,检查的是原型
console.log([] instanceof Object); // true
3.constructor
获取到一个对象的构造函数
function B(){
}
const c = new B()
console.log(c.constructor) // ƒ B(){}
console.log(c.constructor === B) // true
constructor使用实例
console.log(''.constructor) // ƒ String() { [native code] }
console.log(new Number(1).constructor) // ƒ Number() { [native code] }
console.log(Symbol().constructor) // ƒ Symbol() { [native code] }
console.log(true.constructor) // ƒ Boolean() { [native code] }
console.log([].constructor) // ƒ Array() { [native code] }
console.log(new Date().constructor) // ƒ Date() { [native code] }
console.log(new RegExp().constructor) // ƒ RegExp() { [native code] }
经过上面测试,我们感觉constructor能够达到我们的要求
但是constructor
其实是有缺陷的
主要体现在两个方面:
null
和undefined
是无效的对象,不会有constructor
console.log(null.constructor) // 报错 因为null没有constructor
console.log(undefined.constructor) // 报错
- 函数的
constructor
是不稳定的,如果将一个自定义对象赋值给某个对象的原型对象,那么constructor
的指向会被更改
function A(){
}
var a = new A()
console.log(a.constructor) // ƒ A(){}
function B(){
}
B.prototype = {
}
var b = new B()
console.log(b.constructor) // ƒ Object() { [native code] }
4.toString
toString
是 Object上 面的原型方法,这是一个内部属性,默认返回对象类型,[object Xxx], Xxx就是对象的类型。
虽然toString
是位于Object上面,每个对象都有,但是基本上所有对象都对这个toString方法进行了重写。console.log([1,2,3].toString()); // 1,2,3
所以我们要调用toString
,必须调用Object原型上面的toString
Object.prototype.toString.call
toString使用实例
console.log(Object.prototype.toString.call('')); // [object String]
console.log(Object.prototype.toString.call(1)); // [object Number]
console.log(Object.prototype.toString.call(true)); // [object Boolean]
console.log(Object.prototype.toString.call(Symbol())); // [object Symbol]
console.log(Object.prototype.toString.call(undefined)); // [object Undefined]
console.log(Object.prototype.toString.call(null)); // [object Null]
console.log(Object.prototype.toString.call([])); // [object Array]
console.log(Object.prototype.toString.call({
})); // [object Object]
console.log(Object.prototype.toString.call(new Date())); // [object Date]
console.log(Object.prototype.toString.call(new RegExp())); // [object RegExp]
console.log(Object.prototype.toString.call(new Function())); // [object Function]
解答面试题
封装一个函数来判断变量的数据类型
// 解答面试题
function getType(data){
const type = typeof data;
if(type !== 'object'){
return type
}
return Object.prototype.toString.call(data).replace(/^\[object (\S+)]$/,'$1')
}
// 测试基本数据类型
console.log(getType(1)) // number
console.log(getType(true)) // boolean
console.log(getType("")) // string
console.log(getType(undefined)) // undefined
console.log(getType(null)) // Null
// 测试引用数据类型
console.log(getType(new Date())); // Date
console.log(getType(new RegExp())); // RegExp
console.log(getType([])); // Array
上面的正则表达式中的 \S 表是匹配非空白字符,replace是字符串的一个方法。