推断js中的类型:typeof / instanceof / constructor / prototype

推断js中的类型:typeof / instanceof / constructor / prototype

大家好,又见面了,我是全栈君,祝每个程序员都可以多学几门语言。

怎样推断js中的类型呢,先举几个样例:

var a = “jason”;

var b = 123;

var c = true;

var d = [1,2,3];

var e = new Date();

var f = function(){

    alert(‘jason’);

};

一、最常见的推断方法:typeof

    typeof是一个一元运算符,它返回的结果始终是一个字符串,对不同的操作数,它返回不同的结果,另外typeof能够推断function的类型;在推断除Object类型的对象时比較方便。

console.log(typeof a == “string”);        //true

console.log(typeof a == String);        //false

详细的规则例如以下:

  1) 对于数字类型的操作数而言, typeof 返回的值是 number。比方说:typeof 1,返回的值就是number。

    上面是举的常规数字,对于很规的数字类型而言,其结果返回的也是number。比方typeof NaN,NaN在JavaScript中代表的是特殊非数字值,尽管它本身是一个数字类型。

    在JavaScript中,特殊的数字类型还有几种:

Infinity                     //表示无穷大特殊值

NaN                         //特殊的非数字值

Number.MAX_VALUE             //可表示的最大数字

Number.MIN_VALUE             //可表示的最小数字(与零最接近)

Number.NaN                     //特殊的非数字值

Number.POSITIVE_INFINITY    //表示正无穷大的特殊值

Number.NEGATIVE_INFINITY    //表示负无穷大的特殊值

    以上特殊类型,在用typeof进行运算进,其结果都将是number。

  2) 对于字符串类型,typeof返回的值是string。比方typeof  “jason”返回的值是string。

  3) 对于布尔类型,typeof返回的值是boolean。比方typeof true返回的值是boolean。

  4) 对于对象、数组、null返回的值是object。比方typeof {},typeof [],typeof null返回的值都是object。

  5) 对于函数类型,返回的值是function。比方:typeof eval,typeof Date返回的值都是function。

  6) 假设运算数是未定义的(比方说不存在的变量、函数或者undefined),将返回undefined。比方:typeof jason、typeof undefined都返回undefined。

console.log(typeof a);                    //string

console.log(typeof b);                    //number

console.log(typeof c);                    //boolean

console.log(typeof d);                    //object

console.log(typeof e);                    //object

console.log(typeof f);                    //function

console.log(typeof 1);                    //number

console.log(typeof NaN);                //number

console.log(typeof Number.MIN_VALUE);    //number

console.log(typeof Infinity);            //number

console.log(typeof “123”);                //string

console.log(typeof true);                //boolean

console.log(typeof {});                    //object

console.log(typeof []);                    //object

console.log(typeof null);                //object

console.log(typeof eval);                //function

console.log(typeof Date);                //function

console.log(typeof sss);                //undefined

console.log(typeof undefined);            //undefined

二、推断一个对象是否为某一数据类型,或一个变量是否为一个对象的实例:instanceof

    注意:instanceof 后面一定要是对象类型,而且大写和小写不能错,该方法适合一些条件选择或分支。

console.log(d instanceof Array);        //true

console.log(e instanceof Date);            //true

console.log(f instanceof Function);        //true

三、依据对象的constructor推断:constructor

console.log(d.constructor === Array)    //true

console.log(e.constructor === Date)        //true

console.log(f.constructor === Function)    //true

注意constructor在类继承时会出错

比如:

    function A(){};

    function B(){};

    var aObj = new A();

    console.log(aObj.constructor === A);    //true;

    console.log(aObj.constructor === B);    //false;

    

    function C(){};

    function D(){};

    C.prototype = new D(); //C继承自D

    var cObj = new C();

    console.log(cObj.constructor === C);    //false;

    console.log(cObj.constructor === D);    //true;

    

而instanceof方法不会出现该问题,对象直接继承和间接继承的都会报true:

    console.log(cObj instanceof C);            //true

    console.log(cObj instanceof D);            //true

    

解决construtor的问题一般是让对象的constructor手动指向自己:

    cObj.constructor = C;                     //将自己的类赋值给对象的constructor属性

    console.log(cObj.constructor === C);    //true;

    console.log(cObj.constructor === D);    //false; 基类不会报true了;

    

    

四、通用但非常繁琐的方法:prototype    

    console.log(Object.prototype.toString.call(a) === ‘[object String]’);        //true

    console.log(Object.prototype.toString.call(b) === ‘[object Number]’);        //true

    console.log(Object.prototype.toString.call(c) === ‘[object Boolean]’);        //true

    console.log(Object.prototype.toString.call(d) === ‘[object Array]’);        //true

    console.log(Object.prototype.toString.call(e) === ‘[object Date]’);            //true

    console.log(Object.prototype.toString.call(f) === ‘[object Function]’);        //true

    注:大写和小写不能写错,比較麻烦,但胜在通用。

总结:

    通常情况下用typeof推断就能够了,遇到预知Object类型的情况能够选用instanceof或constructor方法,简单总结下,欢迎补充!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/118395.html原文链接:https://javaforall.net

(0)
上一篇 2021年12月6日 下午6:00
下一篇 2021年12月6日 下午7:00


相关推荐

  • endnote x9中文版安装教程(vivox9安装未知应用权限在哪)

    endnote x9中文版安装教程(vivox9安装未知应用权限在哪)一、下载在百度中搜索“Endnotex9”,点第一个链接进入下载页面。软件大小为108MB,下载的是一个压缩包,如下图所示,双击解压之后是右侧的图标,解压到文件夹,双击即可安装。二、安装直接安装即可,可以更换安装路径备注:安装成功后使用汉化版,可以将CHS文件夹里的[EndNote.exe]拷贝到EndNote的安装目录下。使用英文版,可以将ENG文件夹里的[EndNote.exe]拷贝到EndNote的安装目录下。不论用的是英文版还是中文版,替换之后即可使用…

    2022年4月18日
    197
  • 如何把WORD编号转为普通文本

    如何把WORD编号转为普通文本如何把 WORD 编号转为普通文本 1 调出 word 的 开发工具 选项 2 编写宏 3 使用宏记录一下 word 如何去掉自动编号格式但保留原编号内容的方法 1 调出 word 的 开发工具 选项打开文件 gt 选项 gt 自定义功能区 gt 选中开发工具 gt 确定 2 编写宏依次点击 开发工具 宏 在 宏名 框内输入宏名 如 NumToTxt 单击 创建 按钮 弹出 VisualBasic 编辑器窗口 窗口内自动出现以下内容把下面的这段代码复制下来 ActiveDocume Con

    2026年3月16日
    2
  • 免费的uml建模工具「建议收藏」

    Bullmind-uml建模工具,它是一个免费基于Web的绘图软件,支持UML,流程图,思维导图和许多其他图表类型,Bullmind-uml建模工具附带了一个功能强大且易于使用的图表编辑器,可以快速,顺畅地在线创建任何类型的图表。Bullmind-uml建模工具地址:https://www.bullmind.com/转载于:https://blog.51cto.com/14125675/2388…

    2022年4月12日
    47
  • 一些常见的C面试题

    一些常见的C面试题一些常见的 C 面试题 笔试题较少 1 简述 private protected public internal 修饰符的访问权限 private 私有成员 在类的内部才可以访问 protected 保护成员 该类内部和继承类中可以访问 public 公共成员 完全公开 没有访问限制 internal 当前程序集内可以访问 2 ADO NET 中的五个主要对象 a Connection 连接对象 b Command 命令对象 指示要执行的命令和存储过程 c Datareader

    2026年3月26日
    3
  • 怎样用Python识别条形码?

    怎样用Python识别条形码?最近一位热心的网友找到宋宋,想做一个条形码或者二维码的识别系统。现在,他在北京的某知名大型连锁超市,需要通过Python识别条形码,进行快速的商品库存录入。如果已经存在的则不进行录入。不知Python能否实现?所以趁此机会我们给大家介绍下OpenCV和pyzbar。废话不多说,进入正题……条码在生活中随处可见,其可分为三类:一维条码、二维条码、三维条码一维条码:我们平时习惯称为条形码。条形码是将宽度不等的多个黑条和空白,按照一定的编码规则排列,用以表达一组信息的图形标识…

    2025年8月4日
    7
  • Vue(9)购物车练习

    Vue(9)购物车练习购物车案例经过一系列的学习,我们这里来练习一个购物车的案例**需求:**使用vue写一个表单页面,页面上有购买的数量,点击按钮+或者-,可以增加或减少购物车的数量,数量最少不得少于0,点击移除按钮

    2022年7月30日
    11

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号