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 相关文章推荐
用htc组件制作windows选项卡
Jan 13 Javascript
浅析Js中的单引号与双引号问题
Nov 06 Javascript
JavaScript时间转换处理函数
Apr 14 Javascript
jQuery实现仿百度帖吧头部固定导航效果
Aug 07 Javascript
JavaScript基础重点(必看)
Jul 09 Javascript
JS实现数组简单去重及数组根据对象中的元素去重操作示例
Jan 05 Javascript
JavaScript创建对象的常用方式总结
Aug 10 Javascript
记一次vue-webpack项目优化实践详解
Feb 17 Javascript
JavaScript的级联函数用法简单示例【链式调用】
Mar 26 Javascript
Vue2.0使用嵌套路由实现页面内容切换/公用一级菜单控制页面内容切换(推荐)
May 08 Javascript
ES6模板字符串和标签模板的应用实例分析
Jun 25 Javascript
React + Threejs + Swiper 实现全景图效果的完整代码
Jun 28 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
ThinkPHP CURD方法之table方法详解
2014/06/18 PHP
php mb_substr()函数截取中文字符串应用示例
2014/07/29 PHP
MacOS 安装 PHP的图片裁剪扩展Tclip
2015/03/25 PHP
PHP简单处理表单输入的特殊字符的方法
2016/02/03 PHP
Yii2验证器(Validator)用法分析
2016/07/23 PHP
PHP编程获取音频文件时长的方法【基于getid3类】
2017/04/20 PHP
解决php扩展安装不生效问题
2019/10/25 PHP
javascript中[]和{}对象使用介绍
2013/03/20 Javascript
jQuery实现table隔行换色和鼠标经过变色的两种方法
2014/06/15 Javascript
JQUERY简单按钮轮换选中效果实现方法
2015/05/07 Javascript
javascript实现列表滚动的方法
2015/07/30 Javascript
简单实现jquery焦点图
2016/12/12 Javascript
js实现文字向上轮播功能
2017/01/13 Javascript
react native与webview通信的示例代码
2017/09/25 Javascript
Nodejs模块载入运行原理
2018/02/23 NodeJs
浅析前端路由简介以及vue-router实现原理
2018/06/01 Javascript
vue自定义tap指令及tap事件的实现
2018/09/18 Javascript
swiper.js插件实现pc端文本上下滑动功能示例
2018/12/03 Javascript
详解微信小程序之scroll-view的flex布局问题
2019/01/16 Javascript
微信小程序缓存过期时间的使用详情
2019/05/12 Javascript
详解Vue项目引入CreateJS的方法(亲测可用)
2019/05/30 Javascript
JS阻止事件冒泡的方法详解
2019/08/26 Javascript
[01:04:08]完美世界DOTA2联赛PWL S3 INK ICE vs GXR 第一场 12.16
2020/12/18 DOTA
Python使用xlrd读取Excel格式文件的方法
2015/03/10 Python
Python列出一个文件夹及其子目录的所有文件
2016/06/30 Python
用python的requests第三方模块抓取王者荣耀所有英雄的皮肤实例
2017/12/14 Python
python3实现网页版raspberry pi(树莓派)小车控制
2020/02/12 Python
python爬取youtube视频的示例代码
2021/03/03 Python
中科前程Java笔试题
2016/11/20 面试题
《二泉映月》教学反思
2014/04/15 职场文书
2014年教师批评与自我批评思想汇报
2014/09/20 职场文书
2014年保管员工作总结
2014/11/18 职场文书
外贸采购员岗位职责
2015/04/03 职场文书
如何判断pytorch是否支持GPU加速
2021/06/01 Python
MySQL如何使用使用Xtrabackup进行备份和恢复
2021/06/21 MySQL
SpringBoot整合JWT的入门指南
2021/06/29 Java/Android