详解js类型判断


Posted in Javascript onMay 22, 2018

js类型转换中typeof会将null也识别为object, 而且返回的类型比少,我们用Object.prototype.toString来实现

第一版

function isArray(value){
  return Object.prototype.toString.call(value) === "[object Array]";
}

function isFunction(value){
  return Object.prototype.toString.call(value) === "[object Function]";
}

但是这样写,一个个去判断数组,函数,对象的话很麻烦,比较过程化

第二版

我们想用type(obj)的方式返回对应的类型字符串,因为typeof是小写,所以我们也返回小写的标准

function type(obj){
  // -1 代表截止到倒数一位
  return Object.prototype.toString.call(obj).slice(8,-1).toLowerCase()
}

type([]) // "array"

但是这样每次都需要对判断的类型进行slice和toLowerCase也是比较耗性能的, 而且判断类型只有几种,所以我们可以用对象提前将可能的结果缓存起来

第三版

//将types放外面 而不是放在type函数里面, 利用闭包,优化性能,不用每次判断都声明一次typess
var types = {
  '[object Function]': 'function',
  '[object Number]': 'number',
  ...
}

function type(obj) {
  var str = Object.prototype.toString.call(obj)
  return types[str]
}

当然上面的types我们还可以这样优化

// 参考自jquery源码
var types = {}
当然也可以直接用数组存储
"Boolean Number String Function Array Date RegExp Object Error".split(" ").forEach(function(e,i){
  types [ "[object " + e + "]" ] = e.toLowerCase();
}) ;

判断window对象

利用window对象的window属性等于自身

function isWindow( obj ) {
  // obj !== undefined 是为了防止没传参数的时候后面报错
  // Uncaught TypeError: Cannot read property 'window' of undefined的错误
  
  return obj !== undefined && obj === obj.window;
}

判断是不是dom元素

isElement = function(obj) {
  return !!(obj && obj.nodeType === 1);
}
Javascript 相关文章推荐
javascript生成随机大小写字母的方法
Feb 20 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)
Nov 16 Javascript
使用JavaScript为Kindeditor自定义按钮增加Audio标签
Mar 18 Javascript
深入理解JS中的Function.prototype.bind()方法
Oct 11 Javascript
javascript实现鼠标点击页面 移动DIV
Dec 02 Javascript
bootstrap table单元格新增行并编辑
May 19 Javascript
node.js express中app.param的用法详解
Jul 16 Javascript
在 Node.js 中使用 async 函数的方法
Nov 17 Javascript
JavaScript实现小球沿正弦曲线运动
Sep 07 Javascript
使用vue实现多规格选择实例(SKU)
Aug 23 Javascript
JS插入排序简单理解与实现方法分析
Nov 25 Javascript
vue深度监听(监听对象和数组的改变)与立即执行监听实例
Sep 04 Javascript
vue.js过滤器+ajax实现事件监听及后台php数据交互实例
May 22 #Javascript
swiper 自动图片无限轮播实现代码
May 21 #Javascript
JS动态插入脚本和插入引用外部链接脚本的方法
May 21 #Javascript
通过jquery toggleClass()属性制作文章段落更改背景颜色
May 21 #jQuery
基于Vue的延迟加载插件vue-view-lazy
May 21 #Javascript
jQuery获取随机颜色的实例代码
May 21 #jQuery
JS实现常见的查找、排序、去重算法示例
May 21 #Javascript
You might like
php实现保存submit内容之后禁止刷新
2014/03/19 PHP
PHP实现的数独求解问题示例
2017/04/18 PHP
用javascript将数据库中的TEXT类型数据动态赋值到TEXTAREA中
2007/04/20 Javascript
Flash+XML滚动新闻代码 无图片 附源码下载
2007/11/22 Javascript
IE innerHTML,outerHTML所引起的问题
2009/06/04 Javascript
COM中获取JavaScript数组大小的代码
2009/11/22 Javascript
js onclick事件传参讲解
2013/11/06 Javascript
解释&&和||在javascript中的另类用法
2014/07/28 Javascript
使用jQuery判断Div是否在可视区域的方法 判断div是否可见
2016/02/17 Javascript
利用Jquery实现几款漂亮实用的时间轴(附示例代码)
2017/02/15 Javascript
vue init失败简单解决方法(终极版)
2017/12/22 Javascript
Node.js 使用AngularJS的方法示例
2018/05/11 Javascript
vue实现手机端省市区区域选择
2019/09/27 Javascript
Node.js开发之套接字(socket)编程入门示例
2019/11/05 Javascript
解决Vue 给mapState中定义的属性赋值报错的问题
2020/06/22 Javascript
[16:56]教你分分钟做大人:司夜刺客
2014/10/30 DOTA
9种python web 程序的部署方式小结
2014/06/30 Python
Win7上搭建Cocos2d-x 3.1.1开发环境
2014/07/03 Python
Python搭建HTTP服务器和FTP服务器
2017/03/09 Python
python中yaml配置文件模块的使用详解
2018/04/27 Python
python进阶之多线程对同一个全局变量的处理方法
2018/11/09 Python
pygame游戏之旅 添加键盘按键的方法
2018/11/20 Python
解决python中用matplotlib画多幅图时出现图形部分重叠的问题
2019/07/07 Python
Python实现图片添加文字
2019/11/26 Python
Django 自定义404 500等错误页面的实现
2020/03/08 Python
pycharm第三方库安装失败的问题及解决经验分享
2020/05/09 Python
Python requests接口测试实现代码
2020/09/08 Python
英国领先的NHS批准的在线药店:Pharmacy2U
2017/01/06 全球购物
新加坡最受追捧的体验平台:Hapz
2018/01/01 全球购物
Python里面如何拷贝一个对象
2014/02/17 面试题
医药代表个人求职信范本
2013/12/19 职场文书
慈善募捐倡议书
2015/04/27 职场文书
2016年第32个教师节致辞
2015/11/26 职场文书
Java内存模型之happens-before概念详解
2021/06/13 Java/Android
Win11如何启用启动修复 ? Win11执行启动修复的三种方法
2022/04/08 数码科技
解决vue自定义组件@click点击失效问题
2022/04/30 Vue.js