一: typeof

typeof 是一种运算符,它的值有如下几种(number、boolean、string、undefined、null、function、object、symbol)

console.log(typeof 1);  // number
console.log(typeof 1.232); // number
console.log(typeof 111111111111111111111111111111); // number
console.log(typeof NaN); // number console.log(typeof true); // boolean
console.log(typeof false); // boolean console.log(typeof ''); // string
console.log(typeof 'a'); // string
console.log(typeof 'hello'); // string
console.log(typeof "world!"); // string
console.log(typeof String('你好')); // string console.log(typeof undefined); // undefined
console.log(typeof null); // object console.log(typeof {}); // object
console.log(typeof {name: 'Tom', age: 23}); // object console.log(typeof []); // object
console.log(typeof [1, 2, 3]); // object
console.log(typeof function say(){}); // function
console.log(typeof function Person(name, age) {
this.name = name;
this.age = age;
this.say = function () {
console.log('hello, my name is ' + this.name + ', and i am ' + this.age + ' years old.');
};
}); // function console.log(typeof Symbol); // function
console.log(typeof Symbol('name')); // symbol
console.log(typeof new Set()); // object
console.log(typeof new Map()); // object
console.log(typeof new WeakSet()); // object
console.log(typeof new WeakMap()); // object
function Person(name, age) {
this.name = name;
this.age = age;
} let p = new Person('Tom', 23);
console.log(typeof p); // object

从上面的结果可以看出,typeof 运算符只能判断基本类型number、boolean、string、undefined、symbol和函数类型function,其他的如null、数组、字面量对象、构造函数创建的对象都判断为object,无法判断出具体的类型。

二: instanceof 运算符

console.log(1 instanceof Number);  // false
console.log(1.232 instanceof Number); // false
console.log(111111111111111111111111111111 instanceof Number); // false
//console.log(NaN instanceof NaN); // TypeError: Right-hand side of 'instanceof' is not an object
console.log(NaN instanceof Number); // false
console.log('1================================='); console.log(true instanceof Boolean); // false
console.log(false instanceof Boolean); // false
console.log('2================================='); console.log('' instanceof String); // false
console.log('a' instanceof String); // false
console.log('hello' instanceof String); // false
console.log("world!" instanceof String); // false
console.log(String('你好') instanceof String); // false
console.log('3================================='); // console.log(undefined instanceof undefined); // TypeError: Right-hand side of 'instanceof' is not an object
console.log(undefined instanceof Number); // false
console.log(undefined instanceof Object); // false
// console.log(null instanceof null); // TypeError: Right-hand side of 'instanceof' is not an object
console.log(null instanceof Object); // false
console.log('4================================='); console.log({} instanceof Object); // true
console.log({name: 'Tom', age: 23} instanceof Object); // true
console.log('5================================='); console.log([] instanceof Array); // true
console.log([1, 2, 3] instanceof Array); // true
console.log(new Array(4) instanceof Array); // true
console.log('6================================='); console.log(function say(){} instanceof Function); // true
console.log(function Person(name, age) {
this.name = name;
this.age = age;
this.say = function () {
console.log('hello, my name is ' + this.name + ', and i am ' + this.age + ' years old.');
};
} instanceof Function); // true
console.log(Symbol instanceof Function); // true
console.log('7================================='); console.log(Symbol('name') instanceof Symbol); // false
console.log(new Set() instanceof Set); // true
console.log(new Map() instanceof Map); // true
console.log(new WeakSet() instanceof WeakSet); // true
console.log(new WeakMap() instanceof WeakMap); // true
console.log(new Date() instanceof Date); // true
console.log(new RegExp(/he/) instanceof RegExp); // true
function Person(name, age) {
this.name = name;
this.age = age;
} let p = new Person('Tom', 23);
console.log(p instanceof Person); // true

从测试结果可以得出,instanceof 运算符的右边必须为对象,而且 instanceof 运算符只能判断某个构造函数的原型对象是否存在于被检测对象的原型链上(即被检测对象是否是某个够早函数的实例)。

三: 使用 Object.prototype.toString.call(被检测值)

这个方法获取的是对象的 Class 属性值,返回值是固定格式的:[object Class属性]

function myTypeof(obj) {
let s = Object.prototype.toString.call(obj);
return s.match(/\[object\s(\w*)\]/)[1].toLowerCase();
}
console.log(myTypeof(1)); // number
console.log(myTypeof(1.232)); // number
console.log(myTypeof(111111111111111111111111111111)); // number
console.log(myTypeof(NaN)); // number console.log(myTypeof(true)); // boolean
console.log(myTypeof(false)); // boolean console.log(myTypeof('')); // string
console.log(myTypeof('a')); // string
console.log(myTypeof('hello')); // string
console.log(myTypeof("world!")); // string
console.log(myTypeof(String('你好'))); // string console.log(myTypeof(undefined)); // undefined
console.log(myTypeof(null)); // null console.log(myTypeof({})); // object
console.log(myTypeof({name: 'Tom', age: 23})); // object console.log(myTypeof([])); // array
console.log(myTypeof([1, 2, 3])); // array
console.log(myTypeof(new Array(4))); // array console.log(myTypeof(function say(){})); // function
console.log(myTypeof(function Person(name, age) {
this.name = name;
this.age = age;
this.say = function () {
console.log('hello, my name is ' + this.name + ', and i am ' + this.age + ' years old.');
};
})); // function
console.log(myTypeof(Symbol)); // function console.log(myTypeof(Symbol('name'))); // symbol
console.log(myTypeof(new Set())); // set
console.log(myTypeof(new Map())); // map
console.log(myTypeof(new WeakSet())); // weakset
console.log(myTypeof(new WeakMap())); // weakmap
console.log(myTypeof(new Date())); // date
console.log(myTypeof(new RegExp(/he/))); // regexp
function Person(name, age) {
this.name = name;
this.age = age;
} let p = new Person('Tom', 23);
console.log(myTypeof(p)); // object

从检测结果可以得知,次方法可以检测基本类型,函数,数组,js原生对象类型,但是无法检测自定义的对象类型。

四:使用 constructor 属性

constructor 属性返回创建该对象的构造函数的引用。利用此特性我们可以判断对象的类型,其中 null 和 undefined 由于没有构造函数,所以 null 和 undefined 需要特殊处理。

function myTypeof(obj) {
return obj === undefined ? 'undefined' :
(obj === null ? 'null' :
obj.constructor.toString().match(/function\s*([^(]*)/)[1].toLowerCase());
} console.log(myTypeof(1)); // number
console.log(myTypeof(1.232)); // number
console.log(myTypeof(111111111111111111111111111111)); // number
console.log(myTypeof(NaN)); // number console.log(myTypeof(true)); // boolean
console.log(myTypeof(false)); // boolean console.log(myTypeof('')); // string
console.log(myTypeof('a')); // string
console.log(myTypeof('hello')); // string
console.log(myTypeof("world!")); // string
console.log(myTypeof(String('你好'))); // string console.log(myTypeof(undefined)); // undefined
console.log(myTypeof(null)); // null console.log(myTypeof({})); // object
console.log(myTypeof({name: 'Tom', age: 23})); // object console.log(myTypeof([])); // array
console.log(myTypeof([1, 2, 3])); // array
console.log(myTypeof(new Array(4))); // array console.log(myTypeof(function say(){})); // function
console.log(myTypeof(function Person(name, age) {
this.name = name;
this.age = age;
this.say = function () {
console.log('hello, my name is ' + this.name + ', and i am ' + this.age + ' years old.');
};
})); // function
console.log(myTypeof(Symbol)); // function console.log(myTypeof(Symbol('name'))); // symbol
console.log(myTypeof(new Set())); // set
console.log(myTypeof(new Map())); // map
console.log(myTypeof(new WeakSet())); // weakset
console.log(myTypeof(new WeakMap())); // weakmap
console.log(myTypeof(new Date())); // date
console.log(myTypeof(new RegExp(/he/))); // regexp
function Person(name, age) {
this.name = name;
this.age = age;
} let p = new Person('Tom', 23);
console.log(myTypeof(p)); // person

从检测结果得出,利用 constructor 属性能判断出除 null 和 undefined 之外的所有类型。

JavaScript判断数据类型的4中方法的更多相关文章

  1. javascript 判断数据类型的几种方法

    javascript 判断数据类型的几种方法一.typeof 直接返回数据类型字段,但是无法判断数组.null.对象 typeof 1 "number" typeof NaN &q ...

  2. js中判断数据类型的4中方法

    注意: js中数据类型有7种(number, boolean, string, null, undefined, object, Symbol(es6新增)) 原始数据类型: number, stri ...

  3. js中判断数据类型的四种方法总结

    js中判断数据类型的四种方法 前言 在js中,我们经常需要判断数据的类型,那么哪些方法可以用来判断数据的类型呢?哪种方法判断数据类型最准确呢? 我们来一个个分析: 1.typeof typeof是一个 ...

  4. JavaScript判断数据类型总结

    最近做项目中遇到了一些关于javascript数据类型的判断处理,上网找了一下资料,并且亲自验证了各种数据类型的判断网页特效,在此做一个总结吧! 一.JS中的数据类型  1.数值型(Number):包 ...

  5. Javascript判断数据类型的五种方式及其特殊性

    Javascript判断数据类型的五种方式及区别 @ 目录 typeof instanceof Object.prototype.toString isArray iisNaN ----------- ...

  6. javascript判断数据类型的各种方法

    一.Object.prototype.toString方法(摘自http://javascript.ruanyifeng.com/stdlib/object.html#toc3) //不同数据类型的O ...

  7. JavaScript判断数据类型

    JavaScript中判断数据类型的方式有三种: 1.typeof typeof 1;   //"number" typeof "abc";  //" ...

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

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

  9. [转]js判断数据类型的四种方法

    原文地址:https://www.cnblogs.com/crackedlove/p/10331317.html 1.typeof typeof是一个操作符,其右侧跟一个一元表达式,并返回这个表达式的 ...

随机推荐

  1. VBA学习资料分享-3

    VBA创建/发送OUTLOOK邮件时怎么加上默认签名呢?用过OUTLOOK写邮件的人都知道,如果你设置了默认签名,那么在创建空白邮件的时候就会自动加上你设置的签名.根据这一特性,我们可以在用VBA创建 ...

  2. 9. Java分支语句之if...else

    if...else条件语句 一个if语句包含一个布尔表达式和一条或者多条语句. 语法运用有三种 //第一种 if(布尔表达式){ //如果布尔表达式为true将执行的语句 } //第二种 if(布尔表 ...

  3. LeetCode 腾讯精选50题--子集

    根据题意,找到几何中的所有子集,说实话子集是没有什么头绪的,因为如果采用遍历的方法,稍有遗漏不说,代码的嵌套循环层数随着数组大小的增加而增加,想了很久没有头绪后就去看了看评论,然后就被点破了解题的关键 ...

  4. SpringBoot--多环境部署配置文件

    在resources 下创建 application-{profile}.properties 的配置文件,其中profile是任意名字: test:测试环境 prod:线上环境 pre-prod:预 ...

  5. oracle查看表空间及大小

    --1.查看表空间的名称及大小 SELECT t.tablespace_name, round(SUM(bytes / (1024 * 1024)), 0) ts_size FROM dba_tabl ...

  6. S5PV210 点亮Led

    GPC1CON, R/W, Address = 0xE020_0080 GPC1DAT, R/W, Address = 0xE020_0084 举例 #define GPC1CON *((volati ...

  7. java 日期。时间

    友情链接: https://www.cnblogs.com/wanson/articles/10818955.html

  8. CentOS下安装好python和opencv,却import cv2失败

    在安装好CentOS和OpenCV后,在终端输入python,在输入import cv2.却报错:ImportError:Mo module named cv2.浏览Python下文件夹发现cv2.s ...

  9. bat 获取当前文件夹的文件名

    bat 获取当前文件夹的文件名 @echo off pushd %1 & for %%i in (.) do set curr=%%~ni echo %curr% pause

  10. 表单重置时 <input type=“hidden”> 隐藏域不可被重置

    可封装全局样式 .hide{ display:none; } 用 <input type="text" class="hide"/> 替代