[JavaScript知识库] js中判断数据类型的几种方法

开发: C++知识库 Java知识库 JavaScript Python PHP知识库人工智能区块链大数据移动开发嵌入式开发工具数据结构与算法开发测试游戏开发网络协议系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑笔记本显卡显示器固态硬盘硬盘耳机手机 iphone vivo oppo 小米华为单反装机图拉丁

-> JavaScript知识库 -> js中判断数据类型的几种方法 -> 正文阅读

[JavaScript知识库]js中判断数据类型的几种方法

例子

var a = 123
var b = 'apple'
var c = true
var d = null
var e = undefined
var f = [1, 2, 3]
var g = { name: 'lisi', age: 21 }
var h = function () {
    return 1 + 2
}
var i = /test/
var j = new Date()
var k = new Set([1, 2, 3, 4])
var l = new Map([
    ['name', '张三'],
    ['title', 'Author']
])
function Animal() {

}

1、typeof

console.log(typeof a);//number-----number
console.log(typeof b);//string-----string
console.log(typeof c);//boolean-----boolean
console.log(typeof d);//null-----object 
console.log(typeof e);//undefined-----undefined
console.log(typeof f);//Array-----object
console.log(typeof g);//Object-----object
console.log(typeof h);//function-----function
console.log(typeof i);//regexp-----object
console.log(typeof j);//date-----object
//typeof返回的类型都是字符串的形式
console.log(typeof (typeof a));//string

2、instanceof

console.log(f instanceof Array);//true
console.log(f instanceof Object);//true
console.log(f instanceof Animal);//false
console.log(h instanceof Function);//true

3、根据对象的constructor判断

console.log(f.constructor === Array);//true
console.log(g.constructor === Object);//true
console.log(h.constructor === Function);//true

4、Object.prototype.toString.call()

console.log(Object.prototype.toString.call(a) === '[object Number]');//true
console.log(Object.prototype.toString.call(b) === '[object String]');//true
console.log(Object.prototype.toString.call(c) === '[object Boolean]');//true
console.log(Object.prototype.toString.call(d) === '[object Null]');//true
console.log(Object.prototype.toString.call(e) === '[object Undefined]');//true
console.log(Object.prototype.toString.call(f) === '[object Array]');//true
console.log(Object.prototype.toString.call(g) === '[object Object]');//true
console.log(Object.prototype.toString.call(h) === '[object Function]');//true
console.log(Object.prototype.toString.call(j) === '[object Date]');//true

5、万能jQuery.type()方法

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
</head>
<body>
</body>
<script>
    var a = 123
    var b = 'apple'
    var c = true
    var d = null
    var e = undefined
    var f = [1, 2, 3]
    var g = { name: 'lisi', age: 21 }
    var h = function () {
        return 1 + 2
    }
    var i = /test/
    var j = new Date()
    var k = new Set([1, 2, 3, 4])
    var l = new Map([
        ['name', '张三'],
        ['title', 'Author']
    ])
    function Animal() {}
    console.log(jQuery.type(a));
    console.log(jQuery.type(b));
    console.log(jQuery.type(c));
    console.log(jQuery.type(d));
    console.log(jQuery.type(e));
    console.log(jQuery.type(f));
    console.log(jQuery.type(g));
    console.log(jQuery.type(h));
    console.log($.type(i));
    console.log($.type(j));
    console.log(jQuery.type(k));
    console.log(jQuery.type(l));
// 04-jquery类型的判断.html:33 number
// 04-jquery类型的判断.html:34 string
// 04-jquery类型的判断.html:35 boolean
// 04-jquery类型的判断.html:36 null
// 04-jquery类型的判断.html:37 undefined
// 04-jquery类型的判断.html:38 array
// 04-jquery类型的判断.html:39 object
// 04-jquery类型的判断.html:40 function
// 04-jquery类型的判断.html:41 regexp
// 04-jquery类型的判断.html:42 date
// 04-jquery类型的判断.html:43 object
// 04-jquery类型的判断.html:44 object
</script>
</html>