详解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 相关文章推荐
脚本吧 - 幻宇工作室用到js,超强推荐expand.js
Dec 23 Javascript
jQuery中jqGrid分页实现代码
Nov 04 Javascript
jquery xMarquee实现文字水平无缝滚动效果
Apr 29 Javascript
jquery使用each方法遍历json格式数据实例
May 18 Javascript
JavaScript类继承及实例化的方法
Jul 25 Javascript
JS实现灵巧的下拉导航效果代码
Aug 25 Javascript
JQuery导航菜单选择特效
Apr 11 Javascript
JavaScript算法系列之快速排序(Quicksort)算法实例详解
Sep 04 Javascript
将json转换成struts参数的方法
Nov 08 Javascript
javascript基本数据类型及类型检测常用方法小结
Dec 14 Javascript
用户管理的设计_jquery的ajax实现二级联动效果
Jul 13 jQuery
解决vue cli4升级sass-loader(v8)后报错问题
Jul 30 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
「OVERLORD」动画重要删减!雅儿贝德的背叛?至尊猎杀队结成
2020/04/09 日漫
两种设置php载入页面时编码的方法
2014/07/29 PHP
PHP session 会话处理函数
2016/06/06 PHP
php使用parse_str实现查询字符串解析到变量中的方法
2017/02/17 PHP
一个简单的js鼠标划过切换效果
2010/06/30 Javascript
关于this和self的使用说明
2010/08/01 Javascript
JavaScript判断一个URL链接是否有效的实现方法
2011/10/08 Javascript
使用javascript做的一个随机点名程序
2014/02/13 Javascript
javascript实现限制上传文件大小
2015/02/06 Javascript
Bootstrap每天必学之表格
2015/11/23 Javascript
浅析jquery数组删除指定元素的方法:grep()
2016/05/19 Javascript
JavaScript手机振动API
2016/06/11 Javascript
Vue中的v-cloak使用解读
2017/03/27 Javascript
Grunt针对静态文件的压缩,版本控制打包的实例讲解
2017/09/29 Javascript
详解React native fetch遇到的坑
2018/08/30 Javascript
js module大战
2019/04/19 Javascript
vue中的面包屑导航组件实例代码
2019/07/01 Javascript
Python中Django框架下的staticfiles使用简介
2015/05/30 Python
Python学习小技巧之列表项的推导式与过滤操作
2017/05/20 Python
Python原始字符串与Unicode字符串操作符用法实例分析
2017/07/22 Python
在dataframe两列日期相减并且得到具体的月数实例
2018/07/03 Python
在python 不同时区之间的差值与转换方法
2019/01/14 Python
Python实现去除列表中重复元素的方法总结【7种方法】
2019/02/16 Python
Python常见数字运算操作实例小结
2019/03/22 Python
numpy中的ndarray方法和属性详解
2019/05/27 Python
Python用Try语句捕获异常的实例方法
2019/06/26 Python
Python 装饰器@,对函数进行功能扩展操作示例【开闭原则】
2019/10/17 Python
Django重设Admin密码过程解析
2020/02/10 Python
Python调用shell cmd方法代码示例解析
2020/06/18 Python
MANGO官方网站:西班牙芒果服装品牌
2017/01/15 全球购物
机关财务管理制度
2014/01/17 职场文书
婚纱店策划方案
2014/05/22 职场文书
2016年暑假学生家长评语
2015/12/01 职场文书
党员反四风学习心得体会
2016/01/22 职场文书
Python GUI编程之tkinter 关于 ttkbootstrap 的使用详解
2022/03/03 Python
JavaScript中10个Reduce常用场景技巧
2022/06/21 Javascript