js学习总结_基于数据类型检测的四种方式(必看)


Posted in Javascript onJuly 04, 2017

1、typeof 用来检测数据类型的运算符 

console.log(typeof 12)//Number

使用typeof检测数据类型,首先返回的都是字符串 ,其次字符串中包含了对应的数据类型

例如:"number"、"string"、"boolean"、"undefined"、"function"、"object"

console.log(typeof typeof function(){}) //string

局限性:

typeof null -> "object"

不能具体的细分是数组还是正则,还是对象中其他的值,因为使用typeof检测数据类型,对于对象数据类型中的值,最后返回的结果都是"object"

2、instanceof 检测某一个实例是否属于某个类

var obj = [12,23];
    console.log(obj instanceof Array);

局限性:

对于基本数据类型来说,字面量方式创建出来的结果和实例方式创建出来的结果是有一定的区别的。从严格意义上讲,只有实例创建出来的结果才是标准的对象数据类型值,也是标准的Number这个类的一个实例;对于字面量方式创建出来的结果是基本的数据类型值,不是严谨的实例,但是由于JS的松散特点,导致了可以使用Number.prototype上的方法

1)、不能用来检测和处理字面量方式创建出来的基本数据类型值

console.log(1 instanceof Number);//false
console.log(new Number(1) instanceof Number)//true

2)、instanceof的特性:只要在当前实例的原型链上,我们用其检测的结果都为true

var ary = [];
    console.log(ary instanceof Array);//true
    console.log(ary instanceof Object);//true

    function fn(){

    }
    console.log(fn instanceof Function);//true
    console.log(fn instanceof Object);//true

3、constructor 构造函数 作用和instanceof非常的相似  constructor可以处理基本数据类型的检测

constructor检测Object和instanceof不一样 一般情况下是检测不了的

var obj = [];
    console.log(obj.constructor === Array)//true

    var num = 1;
    console.log(num.constructor === Number)//true

局限性:我们可以把类的原型进行重写,在重写的过程中很有可能出现把之前的constructor给覆盖掉了,这样检测出来的结果就不准确了。

对于特殊的数据类型null和undefined,他们所属的类是Null和Undefined,但是浏览器把这两个类保护起来了,不允许我们在外面访问使用

4、Object.prototype.toString.call() 最准确最常用的方式 各种类型的都可以检测(基本和引用)

首先获取Object原型上的toString方法,让方法执行,并且改变方法中的this关键字的指向

toString的理解:

表面上看应该是转化成字符串,但是某些toString方法不仅仅是转换为字符串

对于Number、String、Boolean、Array、RegExp、Date、Function原型上的toString方法都是把当前的数据类型转化为字符串的类型(他们的作用仅仅是用来转换为字符串的)

Object.prototype.toString()并不是用来转化为字符串的,他的作用是返回当前方法执行主体(方法中的this)所属类的详细信息。

({name:"李四"}).toString() //[object object]
    Math.toString()//[object Math]
({name:"李四"}).toString() //[object object]
    Math.toString()//[object Math]

    var obj = {name:"张三"};
    console.log(obj.toString())//toString中的this是obj,返回的是obj所属的类的信息。[object Object] 第一个object代表当前实例是对象数据类型的(这个是固定的),第二个Object代表的是obj所属的类是Object

console.log((1).toString()) // "1" Number.prototype.toString转化为字符串

console.log((128).toString(2/8/10)) 把数字转化为2进制、8进制、10进制

所以上面的方法的检测如下 

var ary = [];
    console.log(Object.prototype.toString.call(ary))//[object Array]

以上这篇js学习总结_基于数据类型检测的四种方式(必看)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS input文本框禁用右键和复制粘贴功能的代码
Apr 15 Javascript
初学js 新节点的创建 删除 的步骤
Jul 04 Javascript
谈谈js中的prototype及prototype属性解释和常用方法
Nov 25 Javascript
JS代码随机生成姓名、手机号、身份证号、银行卡号
Apr 27 Javascript
Ionic如何创建APP项目
Jun 03 Javascript
详解AngularJS中ng-src指令的使用
Sep 07 Javascript
深入浅出webpack之externals的使用
Dec 04 Javascript
vue注册组件的几种方式总结
Mar 08 Javascript
iview Upload组件多个文件上传的示例代码
Sep 30 Javascript
js消除图片小游戏代码
Dec 11 Javascript
vue中js判断长时间不操作界面自动退出登录(推荐)
Jan 22 Javascript
在Vue 中实现循环渲染多个相同echarts图表
Jul 20 Javascript
DataTables添加额外的查询参数和删除columns等无用参数实例
Jul 04 #Javascript
javascript 初学教程及五子棋小程序的简单实现
Jul 04 #Javascript
基于Bootstrap分页的实例讲解(必看篇)
Jul 04 #Javascript
JS全角与半角转化实例(分享)
Jul 04 #Javascript
详解如何提高 webpack 构建 Vue 项目的速度
Jul 03 #Javascript
vue.js源代码core scedule.js学习笔记
Jul 03 #Javascript
lhgcalendar时间插件限制只能选择三个月的实现方法
Jul 03 #Javascript
You might like
php网页后退不再出现过期
2007/03/08 PHP
使用PHP curl模拟浏览器抓取网站信息
2013/10/28 PHP
去除php注释和去除空格函数分享
2014/03/13 PHP
PHP页面间传递值和保持值的方法
2016/08/24 PHP
解决Laravel 不能创建 migration 的问题
2019/10/09 PHP
laravel框架中表单请求类型和CSRF防护实例分析
2019/11/23 PHP
找到一点可怜的关于dojo资料,谢谢作者!
2006/12/06 Javascript
form表单中去掉默认的enter键提交并绑定js方法实现代码
2013/04/01 Javascript
js实现收缩菜单效果实例代码
2013/10/30 Javascript
ExtJs纵坐标值重复问题的解决方法
2014/02/27 Javascript
Linux下为Node.js程序配置MySQL或Oracle数据库的方法
2016/03/19 Javascript
JS实时弹出新消息提示框并有提示音响起的实现代码
2016/04/20 Javascript
requireJS使用指南
2016/04/27 Javascript
浅析Node.js实现HTTP文件下载
2016/08/05 Javascript
关于axios不能使用Vue.use()浅析
2018/01/12 Javascript
解决angularjs WdatePicker ng-model的问题
2018/09/13 Javascript
Bootstrap FileInput实现图片上传功能
2021/01/28 Javascript
[01:02:47]EG vs Secret 2019国际邀请赛淘汰赛 胜者组 BO3 第一场 8.21.mp4
2020/07/19 DOTA
python实现获取客户机上指定文件并传输到服务器的方法
2015/03/16 Python
python爬虫租房信息在地图上显示的方法
2019/05/13 Python
python中class的定义及使用教程
2019/09/18 Python
python中的socket实现ftp客户端和服务器收发文件及md5加密文件
2020/04/01 Python
Python如何获取文件指定行的内容
2020/05/27 Python
详解Pandas 处理缺失值指令大全
2020/07/30 Python
Python基于爬虫实现全网搜索并下载音乐
2021/02/14 Python
一款纯css3制作的2015年元旦雪人动画特效教程
2014/12/29 HTML / CSS
小加工厂管理制度
2014/01/21 职场文书
厨房领班竞聘演讲稿
2014/04/23 职场文书
环保标语口号
2014/06/13 职场文书
车辆工程专业求职信
2014/06/14 职场文书
商场租赁意向书
2014/07/30 职场文书
工会优秀工作者事迹
2014/08/17 职场文书
开展批评与自我批评发言稿
2014/10/16 职场文书
测量员岗位职责
2015/02/14 职场文书
我的长征观后感
2015/06/09 职场文书
Apache Hudi数据布局黑科技降低一半查询时间
2022/03/31 Servers