基于javascript中的typeof和类型判断(详解)


Posted in Javascript onOctober 27, 2017

typeof

ECMAScript 有 5 种原始类型(primitive type),即 Undefined、Null、Boolean、Number 和 String。我们都知道可以使用typeof运算符求得一个变量的类型,但是对引用类型变量却只会返回object,也就是说typeof只能正确识别基本类型值变量。

var a = "abc";
console.log(typeof a); // "string"
var b = 123;
console.log(typeof b); // "number"
var c = true;
console.log(typeof c); // "boolean"
var d = null;
console.log(typeof d); // "object"
var f = undefined;
console.log(typeof f); // "undefined"
var g;
console.log(typeof g); // "undefined"

console.log(typeof x); // "undefined"

您也许会问,为什么 typeof 运算符对于 null 值会返回 "object"。这实际上是 JavaScript 最初实现中的一个错误,然后被 ECMAScript 沿用了。现在,null 被认为是对象的占位符,从而解释了这一矛盾,但从技术上来说,它仍然是原始值。

最后一个比较奇怪,typeof一个不存在的变量x居然返回了"object"而不是"undefined"。

我们在来如下代码:

var a = function() { };
console.log(typeof a); // "function"
var b = [1,2,3]; 
console.log(typeof b); // "object"
var c = { };
console.log(typeof c); // "object"

对于数组和对象都返回"object",因此我们日常开发中一个常见需求就是如何判断变量是数组还是对象。

类型判断

类型判断,一般就是判断是否是数组,是否是空对象。这是针对这个需求,我日常用过或见过的判断方法

判断是否是数组

有数组:var a = [1,2,3,4,5];

方法一:

toString.call(a); // "[object Array]"方法二:

a instanceof Array; //true方法三:

a.constructor == Array; //true 第一种方法比较通用,也就是Object.prototype.toString.call(a)的简写。

instanceof和constructor判断的变量,必须在当前页面声明的,比如,一个页面(父页面)有一个框架,框架中引用了一个页面(子页面),在子页面中声明了一个a,并将其赋值给父页面的一个变量,这时判断该变量,Array == object.constructor会返回false;

var a = [1,2,3,4,5];
console.log(toString.call(a)); // "[object Array]"      
console.log(a instanceof Array); //true
console.log(a.constructor == Array); //true

判断是否是空对象

有变量:var obj = {};

方法一:

JSON.stringify(obj); // "{}"通过转换成JSON对象来判断是否是空大括号

方法二:

if(obj.id){ //如果属性id存在....}这个方法比较土,大多数人都能想到,前提是得知道对象中有某个属性。

方法三:

function isEmptyObject(e) { 
var t; for (t in e) return !1; return !0 } //trueisEmptyObject(obj);
//falseisEmptyObject({ "a":1, "b":2});

这个方法是jQuery的isEmptyObject()方法的实现方式。

以上这篇基于javascript中的typeof和类型判断(详解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery 源码分析笔记(7) Queue
Jun 19 Javascript
jQuery右键菜单contextMenu使用实例
Sep 28 Javascript
JS声明变量背后的编译原理剖析
Dec 28 Javascript
jquery Mobile入门—外部链接切换示例代码
Jan 08 Javascript
对JavaScript中this指针的新理解分享
Jan 31 Javascript
jQuery实现获取table表格第一列值的方法
Mar 01 Javascript
仿Angular Bootstrap TimePicker创建分钟数-秒数的输入控件
Jul 01 Javascript
bootstrap suggest搜索建议插件使用详解
Mar 25 Javascript
用node-webkit把web应用打包成桌面应用(windows环境)
Feb 01 Javascript
AjaxUpLoad.js实现文件上传
Mar 05 Javascript
VUE实现自身整体组件销毁的示例代码
Jan 13 Javascript
详解JavaScript中的this指向问题
Feb 05 Javascript
webpack配置之后端渲染详解
Oct 26 #Javascript
jquery使用iscorll实现上拉、下拉加载刷新
Oct 26 #jQuery
AngularJs用户登录问题处理(交互及验证、阻止FQ处理)
Oct 26 #Javascript
node文字生成图片的示例代码
Oct 26 #Javascript
vue-cli中打包图片路径错误的解决方法
Oct 26 #Javascript
javascript+html5+css3自定义弹出窗口效果
Oct 26 #Javascript
Vue 兄弟组件通信的方法(不使用Vuex)
Oct 26 #Javascript
You might like
解析thinkphp中的导入文件标签
2013/06/20 PHP
php跨站攻击实例分析
2014/10/28 PHP
PHP串行化与反串行化实例分析
2016/12/27 PHP
PHP切割汉字的常用方法实例总结
2019/04/27 PHP
JavaScript的面向对象(二)
2006/11/09 Javascript
HTML-CSS群中单选引发的“事件”
2007/03/05 Javascript
仅Firefox中链接A无法实现模拟点击以触发其默认行为
2011/07/31 Javascript
JavaScript建立一个语法高亮输入框实现思路
2013/02/26 Javascript
js实现两个值相加alert出来精确到指定位
2013/09/25 Javascript
document节点对象的获取方式示例介绍
2013/12/24 Javascript
浅谈document.write()输出样式
2015/05/07 Javascript
jquery实现仿JqueryUi可拖动的DIV实例
2015/07/31 Javascript
基于js实现投票的实例代码
2015/08/04 Javascript
Bootstrap所支持的表单控件实例详解
2016/05/16 Javascript
微信小程序 地图map实例详解
2017/06/07 Javascript
基于scrapy实现的简单蜘蛛采集程序
2015/04/17 Python
python数组过滤实现方法
2015/07/27 Python
Python编程中对super函数的正确理解和用法解析
2016/07/02 Python
Python基于回溯法子集树模板解决选排问题示例
2017/09/07 Python
详解python while 函数及while和for的区别
2018/09/07 Python
tensorflow 获取所有variable或tensor的name示例
2020/01/04 Python
详解python中的闭包
2020/09/07 Python
深入理解Python变量的数据类型和存储
2021/02/01 Python
css3过渡_动力节点Java学院整理
2017/07/11 HTML / CSS
html5使用canvas压缩图片的示例代码
2018/09/11 HTML / CSS
会计毕业生自我鉴定
2013/11/04 职场文书
酒店led欢迎词
2014/01/09 职场文书
工厂采购员岗位职责
2014/04/08 职场文书
高中语文课后反思
2014/04/27 职场文书
计算机专业自荐信
2014/05/24 职场文书
招标授权委托书样本
2014/09/23 职场文书
教师群众路线心得体会
2014/11/04 职场文书
校园运动会广播稿
2015/08/19 职场文书
SQL模糊查询报:ORA-00909:参数个数无效问题的解决
2021/06/21 Oracle
聊聊redis-dump工具安装问题
2022/01/18 Redis
什么是Python装饰器?如何定义和使用?
2022/04/11 Python