1.typeof:返回一个字符串,表示操作数的类型。

语法:

    typeof(变量)
//or
typeof 变量

示例:

    console.log(typeof 2)//number
    console.log(typeof true)//boolean
    console.log(typeof 'str')//string
    console.log(typeof function () {
    })//function
    console.log(typeof console.log);//function
    console.log(typeof {})//object
    console.log(typeof [])//object
    console.log(typeof (new Date()))//object
    console.log(typeof window)////object
    console.log(typeof undefined)//undefined
    console.log(typeof null)//object
    console.log(typeof Symbol());      //symbol(es6)
    console.log(typeof 23423n);        //bigint(谷歌67版本新提出)

总结:

  • typeof 的返回类型为字符串,值有:number、boolean、string、object、function、undefined、symbol、bigint
  • typeof 一般用来判断基本数据类型,除了判断null会输出"object",其它都是正确的
  • typeof 判断引用数据类型时,除了判断函数会输出"function",其它都是输出"object"

注意:这里涉及两个经常考的面试题!

  • null 的数据类型是object (null是一个空的引用对象,是一个占位符)
  • console.log 的数据类型是function
  • 对于引用数据类型的判断,使用typeof并不准确,所以可以使用instanceof来判断引用数据类型

2.instanceof:用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。可以正确判断对象的类型,其内部运行机制是判断在其原型链中能否找到该类型的原型。

语法:

obj1 instanceof obj2 //obj1 是否是 obj2的实例

示例:

    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

总结:

  • instanceof 只能正确判断引用数据类型,而不能判断基本数据类型。
  • instanceof 返回值为布尔值

注意:

  • instanceof只能用来判断两个对象是否属于实例关系, 而不能判断一个对象实例具体属于哪种类型

3.constructor:该属性本来是原型对象上的属性,指向构造函数。但是根据实例对象寻找属性的顺序,若实例对象上没有实例属性或方法时,就去原型链上寻找,因此,实例对象也是能使用constructor属性的。

示例:

    var num = 123;
console.log(num.__proto__)//Number {0, constructor: ƒ, toExponential: ƒ, toFixed: ƒ, toPrecision: ƒ, …}
console.log(num.constructor)// Number() { [native code] }
console.log(num.constructor == Number)//true

补充:

    function Person() {
} var Tom = new Person();
// undefined和null没有constructor属性,所以只有在确定待判断的值不是undefined和null才能使用
console.log(Tom.constructor == Person)//true
console.log((123).constructor == Number)//true
console.log('abcdef'.constructor == String)//true
console.log((true).constructor == Boolean)//true
console.log([1, 2, 3, 4].constructor == Array)//true
console.log(new Date().constructor == Date)//true
console.log(new Error().constructor == Error)//true
console.log(window.constructor == Window)//true

总结:

所有对象(使用 Object.create(null) 创建的对象除外)都将具有 constructor 属性。在没有显式使用构造函数的情况下,创建的对象(例如对象和数组文本)将具有 constructor 属性,这个属性指向该对象的基本对象构造函数类型。  

注意:

  • null和undefined是无效的对象,所以他们不会有constructor属性!
  • 函数的constructor是不稳定的,主要是因为开发者可以重写prototype,如果创建一个对象来改变它的原型,constructor 就不能用来判断数据类型了:
    function Fn() {
}
var f_test = new Fn()
console.log(f_test.constructor == Fn)//true
```
修改其prototype后
```
Fn.prototype = new Array()
var f_test = new Fn()
console.log(f_test.constructor == Fn)//false
console.log(f_test.constructor == Array)//true

4.Object.prototype.toString.call()

   官网解释:每个对象都有一个 toString() 方法,当该对象被表示为一个文本值时,或者一个对象以预期的字符串方式引用时自动调用。默认情况下,toString() 方法被每个 Object 对象继承。如果此方法在自定义对象中未被覆盖,toString() 返回 "[object type]",其中 type 是对象的类型。以下代码说明了这一点:

   var o=new Object()
console.log(o.toString())//[object Object]
对于 Object 对象,直接调用 toString()  就能返回 [object Object] 。而对于其他对象,则需要通过 call / apply 来调用才能返回正确的类型信息。

示例:

    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(new Function())); // [object Function]
console.log(Object.prototype.toString.call(new Date())); // [object Date]
console.log(Object.prototype.toString.call([])); // [object Array]
console.log(Object.prototype.toString.call(new RegExp())); // [object RegExp]
console.log(Object.prototype.toString.call(new Error())); // [object Error]
console.log(Object.prototype.toString.call(document)); // [object HTMLDocument]
console.log(Object.prototype.toString.call(window)); // [object global] window 是全局对象 global 的引用

参考:JS中检测数据类型的四种方法

js检测数据类型得四种方式的更多相关文章

  1. JS中检测数据类型的四种方式及每个方式的优缺点

    //1.typeof 用来检测数据类型的运算符 //->typeof value //->返回值首先是一个字符串,其次里面包含了对应的数据类型,例如:"number". ...

  2. js 复制文本的四种方式

    js 复制文本的四种方式 一.总结 一句话总结:js文本复制主流方法:document的execCommand方法 二.js 复制文本的四种方式 纯 转载复制,非原创 原地址:http://www.c ...

  3. js 实现复制功能的四种方式的优劣对比

    今日网上浏览别人项目,看到有人用了document.execCommand这个属性,于是想起之前我选用Clipboard.js 来实现.对于这种不常用的属性还是不太放心,于是随手查了下关于复制的资料, ...

  4. JS中检测数据类型的几种方式及优缺点【转】

    1.typeof 用来检测数据类型的运算符 typeof value 返回值首先是一个字符串,其次里面包含了对应的数据类型,例如:"number"."string&quo ...

  5. JS中检测数据类型的几种方式及优缺点

    1.typeof 用来检测数据类型的运算符 typeof value 返回值首先是一个字符串,其次里面包含了对应的数据类型,例如:"number"."string&quo ...

  6. JS中检测数据类型的四种方法

    1.typeof 用来检测数据类型的运算符->typeof value->返回值首先是一个字符串,其次里面包含了对应的数据类型,例如:"number"."st ...

  7. js中检测数据类型的几种方式

    1.typeof 一元运算符,用来检测数据类型.只可以检测number,string,boolean,object,function,undefined. 对于基本数据类型是没有问题的,但是遇到引用数 ...

  8. js动态引入的四种方式

    index.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http:// ...

  9. 在javaScript中检测数据类型的几种方式

    类型检测的方法 typeof instanceof Object.protype.toString constructor duck type:鸭子类型 typeof 返回一个字符串,适合函数对象和基 ...

  10. js判断数据类型的四种方法

    1.typeof typeof是一个操作符,其右侧跟一个一元表达式,并返回这个表达式的数据类型.返回的结果用该类型的字符串(全小写字母)形式表示,包括number,string,boolean,und ...

随机推荐

  1. CSSRelated

    CSS 几种常用的清除浮动方法 ️️️ 父级 div 定义伪类:after 和 zoom; /* 这个class名指的是需要清除浮动的父级 */ .clearfloat:after { display ...

  2. cesium加载gif图片(cesium篇.43)

    https://blog.csdn.net/QQ98281642/article/details/120214325

  3. 《UNIX 传奇:历史与回忆》读后感

    <UNIX 传奇:历史与回忆> 是 bwk(Brian W. Kernighan)2019 年的新作,回忆了 UNIX 在大半个世纪的风雨历程,是一本引人入胜的书籍.通过对 UNIX 操作 ...

  4. Redis的五大数据类型的数据结构

    概述   Redis底层有六种数据类型包括:简单动态字符串.双向链表.压缩列表.哈希表.跳表和整数数组.这六种数据结构五大数据类型关系如下: String:简单动态字符串 List:双向链表.压缩列表 ...

  5. pythonapi接口怎么对接?

    ​ Python API接口对接是使用Python语言开发应用程序时,与外部API接口进行交互的一种方式.API(应用程序接口)是一种定义了程序或系统如何与另一个程序或系统进行交互的协议.通过使用Py ...

  6. 淘宝详情api接口的应用

    淘宝详情API接口是一个基于HTTP协议的接口服务,可用于获取淘宝商品的具体信息.下面将介绍如何调用淘宝详情API接口获取淘宝商品数据的步骤. 1.注册账号并创建应用 首先,我们需要进行账号注册.实名 ...

  7. 教你2种方法,将iOS设备通过MQTT协议连接到华为云物联网平台

    本文分享自华为云社区<如何将iOS设备通过MQTT协议连接到华为云物联网平台: Flutter和Swift两种方法>,作者: 张俭 . 前言 当今时代,物联网技术正逐步改变我们的生活和工作 ...

  8. .NET 8 Release Candidate 1 (RC1)现已发布,包括许多针对ASP.NET Core的重要改进!

    这是我们计划在今年晚些时候发布的最终.NET 8版本之前的两个候选版本中的第一个.大部分计划中的功能和变更都包含在这个候选版本中,可以供您尝试使用.您可以在文档中找到完整的ASP.NET Core在. ...

  9. padans 常用的统计方法

    #coding=utf-8import pandas as pdimport numpy as npfile="./IMDB-Movie-Data.csv"data=pd.read ...

  10. Azure Data Factory(八)数据集验证之服务主体(Service Principal)

    一,引言 如下图所示,今天我们接着上一篇内容,继续讲解 Azure Data Factory 中的数据集连接服务的认证方式:Service Principal 关于 Service Principal ...