javascript数据类型判断typeof,instanceof,constructor,Object.prototype.toString.call()

2020-07-1508:59:46WEB前端开发Comments1,755 views字数 1949阅读模式

(1)typeof文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/19719.html

typeof 对于原始类型来说,除了 null 都可以显示正确的类型文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/19719.html

console.log(typeof 2);               // number
console.log(typeof true);            // boolean
console.log(typeof 'str');           // string
console.log(typeof []);              // object     []数组的数据类型在 typeof 中被解释为 object
console.log(typeof function(){});    // function
console.log(typeof {});              // object
console.log(typeof undefined);       // undefined
console.log(typeof null);            // object     null 的数据类型被 typeof 解释为 object
复制代码

typeof 对于对象来说,除了函数都会显示 object,所以说 typeof 并不能准确判断变量到底是什么类型,所以想判断一个对象的正确类型,这时候可以考虑使用 instanceof文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/19719.html

(2)instanceof文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/19719.html

instanceof 可以正确的判断对象的类型,因为内部机制是通过判断对象的原型链中是不是能找到类型的 prototype。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/19719.html

console.log(2 instanceof Number);                    // false
console.log(true instanceof Boolean);                // false 
console.log('str' instanceof String);                // false  
console.log([] instanceof Array);                    // true
console.log(function(){} instanceof Function);       // true
console.log({} instanceof Object);                   // true    
// console.log(undefined instanceof Undefined);
// console.log(null instanceof Null);
复制代码

可以看出直接的字面量值判断数据类型,instanceof可以精准判断引用数据类型(Array,Function,Object),而基本数据类型不能被instanceof精准判断。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/19719.html

我们来看一下 instanceof 在MDN中的解释:instanceof 运算符用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。其意思就是判断对象是否是某一数据类型(如Array)的实例,请重点关注一下是判断一个对象是否是数据类型的实例。在这里字面量值,2, true ,'str'不是实例,所以判断值为false。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/19719.html

(3)constructor文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/19719.html

console.log((2).constructor === Number); // true
console.log((true).constructor === Boolean); // true
console.log(('str').constructor === String); // true
console.log(([]).constructor === Array); // true
console.log((function() {}).constructor === Function); // true
console.log(({}).constructor === Object); // true
复制代码

这里有一个坑,如果我创建一个对象,更改它的原型,constructor就会变得不可靠了文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/19719.html

function Fn(){};
 
Fn.prototype=new Array();
 
var f=new Fn();
 
console.log(f.constructor===Fn);    // false
console.log(f.constructor===Array); // true 
复制代码

(4)Object.prototype.toString.call() 使用 Object 对象的原型方法 toString ,使用 call 进行狸猫换太子,借用Object的 toString 方法文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/19719.html

var a = Object.prototype.toString;
 
console.log(a.call(2));
console.log(a.call(true));
console.log(a.call('str'));
console.log(a.call([]));
console.log(a.call(function(){}));
console.log(a.call({}));
console.log(a.call(undefined));
console.log(a.call(null));

作者:Jake Zhang文章源自菜鸟学院-https://www.cainiaoxueyuan.com/gcs/19719.html

  • 本站内容整理自互联网,仅提供信息存储空间服务,以方便学习之用。如对文章、图片、字体等版权有疑问,请在下方留言,管理员看到后,将第一时间进行处理。
  • 转载请务必保留本文链接:https://www.cainiaoxueyuan.com/gcs/19719.html

Comment

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定