基于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 相关文章推荐
网页里控制图片大小的相关代码
Jun 13 Javascript
JQuery对checkbox操作 (循环获取)
May 20 Javascript
关闭时刷新父窗口两种方法
May 07 Javascript
Jquery跳到页面指定位置的方法
May 12 Javascript
jQuery中closest()函数用法实例
Jan 07 Javascript
jquery $.trim()去除字符串空格的实现方法【附图例】
Mar 30 Javascript
js canvas实现QQ拨打电话特效
May 10 Javascript
AngularJS中filter的使用实例详解
Aug 25 Javascript
详解在vue-cli中使用路由
Sep 25 Javascript
封装运动框架实战左右与上下滑动的焦点轮播图(实例)
Oct 17 Javascript
Angular4编程之表单响应功能示例
Dec 13 Javascript
微信小程序中转义字符的处理方法
Mar 28 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
探讨如何使用SimpleXML函数来加载和解析XML文档
2013/06/07 PHP
php中switch与ifelse的效率区别及适用情况分析
2015/02/12 PHP
PHP使用适合阅读的格式显示文件大小的方法
2015/03/05 PHP
PHP中preg_match正则匹配中的/u、/i、/s含义
2015/04/17 PHP
PHP网站建设的流程与步骤分享
2015/09/25 PHP
js 页面传参数时 参数值含特殊字符的问题
2009/12/13 Javascript
详细讲解JS节点知识
2010/01/31 Javascript
js null,undefined,字符串小结
2010/08/21 Javascript
jquery 查找select ,并触发事件的实现代码
2011/03/30 Javascript
使用javascipt---实现二分查找法
2013/04/10 Javascript
JS返回上一页实例代码通过图片和按钮分别实现
2013/08/16 Javascript
JQuery调用绑定click事件的3种写法
2015/03/28 Javascript
jQuery基于$.ajax设置移动端click超时处理方法
2016/05/14 Javascript
深入理解javascript中的 “this”
2017/01/17 Javascript
原生js实现旋转木马轮播图效果
2017/02/27 Javascript
Vue之Watcher源码解析(2)
2017/07/19 Javascript
简单的Vue SSR的示例代码
2018/01/12 Javascript
vue.js给动态绑定的radio列表做批量编辑的方法
2018/02/28 Javascript
Vue二次封装axios为插件使用详解
2018/05/21 Javascript
扫微信小程序码实现网站登陆实现解析
2019/08/20 Javascript
vue实现百度搜索功能
2020/12/28 Javascript
jquery 键盘事件 keypress() keydown() keyup()用法总结
2019/10/23 jQuery
Nodejs文件上传、监听上传进度的代码
2020/03/27 NodeJs
jquery+ajax实现异步上传文件显示进度条
2020/08/17 jQuery
Python函数嵌套实例
2014/09/23 Python
Django Admin实现上传图片校验功能
2016/03/06 Python
python中如何使用正则表达式的非贪婪模式示例
2017/10/09 Python
python队列queue模块详解
2018/04/27 Python
树莓派与PC端在局域网内运用python实现即时通讯
2019/06/22 Python
欧洲领先的火车票和大巴票预订平台:Trainline
2018/12/26 全球购物
有兼职工作经历的简历自我评价
2014/03/07 职场文书
旷课检讨书范文
2014/10/30 职场文书
企业财务经理岗位职责
2015/04/08 职场文书
一次项目中Thinkphp绕过禁用函数的实战记录
2021/11/17 PHP
python实现双链表
2022/05/25 Python
MySQL下载安装配置详细教程 附下载资源
2022/09/23 MySQL