JavaScript 中如何判断变量的类型
注:本文是作者阅读网络资料后的个人总结。 一定有什么疏忽。 希望大家能在评论区指出错误之处
文章目录
前言在后端开发的过程中,熟练使用JavaScript语言是重中之重,而在使用的过程中,我们经常会遇到需要我们判断变量类型的情况。 本文致力于帮助您了解和掌握几种常见的判断方法并找出它们之间的区别。
众所周知,在ECMAScript规范中,一共定义了7种数据类型,分为基本类型和引用类型两大类。
基本类型:字符串、数字、布尔值、符号、未定义、空值
引用类型:对象
一、typeof
一般来说,typeof是最常用的,简单方便,但是它有一个致命的缺点。 我们来看下面一段代码:
typeof 'hhh'; // string 有效
typeof 1; // number 有效
typeof true; //boolean 有效
typeof Symbol(); // symbol 有效
typeof undefined; //undefined 有效
typeof new Function(); // function 有效
typeof null; //object 无效
typeof [] ; //object 无效
typeof new Date(); //object 无效
您注意到任何问题了吗?
我们发现返回的结果是用该类型的字符串形式表示的(全部大写字母),包括以下7种类型:string、number、boolean、symbol、undefined、object、function
是的,只包括这七个,与我们的预期相差甚远! 那么数组呢? 那空呢?
遗憾的是我们普通的玩家typeof无法判断稍微复杂一点的参考类型
但如果 typeof 如此多才多艺,那么剩下的玩家应该放在哪里呢?
俗话说:腹中天地宽,渡船常有。
老哲学家
综上所述:
对于原始类型,除了 null 之外,都会返回正确的结果。
对于引用类型,除了函数之外,返回所有对象类型。
对于 null,返回对象类型。
下一篇:Instanceof
二、Instanceof
和typeof相比,这位兄弟有点难懂
简单来说:instanceof检测原型javascript 判断 类型,表达式为:AinstanceofB,如果A是B的实例,则返回true,否则返回false。
说到原型,有些人可能会有点沮丧
诚然,原型链说起来并不难,但并不是一个简单的知识点,这里就不重复了。 不了解这部分的朋友可以先学习一下原型链的知识。
相信大家都看过这张图。 这是一张解释原型链原理的经典图。
前面提到,instanceof运算符的右边是实例对象,右边是构造函数,左边的变量暂时称为A,右边的变量暂时称为B,那么表达式为:
B 的一个实例
这个多项式的意义在于,它检测一侧构造函数的原型对象(prototype)是否在左侧对象的原型链上。
也就是说instanceof的判断规则是:
instanceof会检测整个原型链,会一直沿着A的__proto__的路线搜索,同时沿着B的原型的路线搜索,直到能找到相同的引用,即同一个对象,则返回true 。 如果发现端点尚未重合,则返回 false。
根据上面的规则,我们来看看为什么代码“f1 instanceof Object”为真?
根据上图,很容易看出f1–>proto–>proto和Object–>prototype指向同一个对象。
可以说,千里之外的相遇,就是一场缘分。
如果你了解原型链的话,instanceof也很容易理解!
3.Object.prototype.toString.call
这种方法比上面两种不太流行javascript 判断 类型,但它确定的类型更直观,不像instanceof,它返回一个布尔值。 我们来看看实际使用情况
console.log(Object.prototype.toString.call("hhh"));//[object String]
console.log(Object.prototype.toString.call(12));//[object Number]
console.log(Object.prototype.toString.call(true));//[object Boolean]
console.log(Object.prototype.toString.call(undefined));//[object Undefined]
console.log(Object.prototype.toString.call(null));//[object Null]
console.log(Object.prototype.toString.call({name: "hhh"}));//[object Object]
console.log(Object.prototype.toString.call(function(){}));//[object Function]
console.log(Object.prototype.toString.call([]));//[object Array]
console.log(Object.prototype.toString.call(new Date));//[object Date]
该判断方法中,返回值为【对象变量类型】
是不是非常好用?
但很多人只知道如何使用,却不了解其原理。
首先你要知道Object原型上有一个toString方法,它的作用就是返回对象的具体类型。
调用可以改变当前的this点,从Object变成括号里的对象,相当于把狸猫换成了王子,借用了Object原型的方法来判断类型。
如果你自己做不到,你就得请别人帮你。 这不就是团队合作吗?
老人
以上是js中判断变量类型的三种常见方式。 欢迎大家参考学习,希望大家能够指出我的错误,共同进步。