-
分类
js包含两类不同类型的数据类型,基本数据类型和引用类型。
基本数据类型:Undefined,Null,String,Number,Boolean
引用数据类型:Object(包括Array,Date等等) -
值
基本数据类型按值访问的,可以操作保存在变量中的实际值
引用数据类型是保存在内存中的对象,按引用访问(地址指向一个内存)
⚠️因为因为保存和访问的方式不用所以在复制的时候也不同,值类型的会直接创建一个新值,改变时与原来的无关;引用类型只是复制指针,所以一个改变会导致相同引用的变量变化
- 检测数据类型
- typeof:用来检测基本的数据类型
// 基本数据类型
typeof '123' // "string"
typeof 123 // "number"
typeof NaN // "number"
typeof true // "boolean"
typeof undefined // "undefined"
/*注意这里null返回的是object*/
typeof null // "object"
// 引用类型
typeof {} // "object"
typeof [] // "object"
typeof /\d+/ // "object"
var fn = function () {}
typeof fn // "function"
根据上面的代码我们很容易观察到typeof检测引用数据的时候都会返回"object";
还有几个特殊的返回:
- 一个null的特殊返回(这里js里面认为null是一个空指针对象,后面会单独总结null以及undefined);
- 引用类型的function也是一个特殊的返回
- 正则在不同的浏览器根据版本不同返回值不同,上面的测试为chrome的61
- instanceof(它是根据原型链来识别的,如果变量是给定引用类型的实例则会返回true)
// 基本数据类型
'123' instanceof String // false
123 instanceof Number // false
undefined instanceof Undefined // 报错
null instanceof Null // 报错
true instanceof Boolean // false
// 引用数据类型
[] instanceof Array // true
[] instanceof Object // true
var obj = {}
obj instanceof Object // true
obj instanceof Array // false
var fn = function () {}
fn instanceof Object // true
fn instanceof Function // true
根据上面的测试我们发现String,Number,Boolean 总会返回false,这是因为基本类型不是对象;Undefined和Null会报错;而所有的引用类型用Object检测都会返回true,因为所有的引用类型的值都是Object的实例
- Object.prototype.toString.call() : 可以用识别所有的数据类型
Object.prototype.toString.call('123') // "[object String]"
Object.prototype.toString.call(123) // "[object Number]"
Object.prototype.toString.call(undefined) // "[object Undefined]"
Object.prototype.toString.call(null) // "[object Null]"
Object.prototype.toString.call([]) // "[object Array]"
Object.prototype.toString.call({}) // "[object Object]"
Object.prototype.toString.call(/\d+/) // "[object RegExp]"
根据上面的代码测试我们可以看出它可以准确的获取当前的数据类型
提供一个完整的写法
function typeDetection (type, data) {
if (arguments.length < 2 || typeof type !== 'string') { return }
const reg = /\s([A-Za-z]+)/
const dataType = reg.exec(Object.prototype.toString.call(data))[1] // 'Number'
return dataType.toLowerCase() === type.toLowerCase()
}
// 测试
typeDetection('array', []) // true
typeDetection('array', {}) // false
typeDetection('number', 123) // true
typeDetection('null', null) // true
好了今天就先总结到这里,根据不同的场景选择你需要的方式
网友评论