基于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 相关文章推荐
js常用代码段整理
Nov 30 Javascript
JS实现在页面随时自定义背景颜色的方法
Feb 27 Javascript
JavaScript获取按钮所在form表单id的方法
Apr 02 Javascript
AngularJS初始化静态模板详解
Jan 14 Javascript
学习JavaScript事件流和事件处理程序
Jan 25 Javascript
javascript断点调试心得分享
Apr 23 Javascript
jQuery动态添加可拖动元素完整实例(附demo源码下载)
Jun 21 Javascript
Vue.js如何优雅的进行form validation
Apr 07 Javascript
Angular实现模版驱动表单的自定义校验功能(密码确认为例)
May 17 Javascript
Node.js对MongoDB进行增删改查操作的实例代码
Apr 18 Javascript
vue.js的简单自动求和计算实例
Nov 08 Javascript
JS+HTML实现自定义上传图片按钮并显示图片功能的方法分析
Feb 12 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
40年前的这部特摄片恐龙特级克塞号80后的共同回忆
2020/03/08 日漫
PHP 将逗号、空格、回车分隔的字符串转换为数组的函数
2012/06/07 PHP
php计算数组相同值出现次数的代码(array_count_values)
2015/01/20 PHP
PHP框架性能测试报告
2016/05/08 PHP
php 文件下载 出现下载文件内容乱码损坏的解决方法(推荐)
2016/11/16 PHP
thinkphp利用模型通用数据编辑添加和删除的实例代码
2016/11/20 PHP
关于删除时的提示处理(确定删除吗)
2013/11/03 Javascript
深入理解JavaScript中的传值与传引用
2013/12/09 Javascript
js比较日期大小的方法
2015/05/12 Javascript
浅谈JavaScript 浏览器对象
2016/06/03 Javascript
简单的JS轮播图代码
2016/07/18 Javascript
ionic2自定义cordova插件开发以及使用(Android)
2017/06/19 Javascript
详解AngularJS ng-class样式切换
2017/06/27 Javascript
js 倒计时(高效率服务器时间同步)
2017/09/12 Javascript
vue.js使用代理和使用Nginx来解决跨域的问题
2018/02/03 Javascript
微信小程序实现联动选择器
2019/02/15 Javascript
JavaScript ES2019中的8个新特性详解
2019/02/20 Javascript
微信小程序防止多次点击跳转和防止表单组件输入内容多次验证功能(函数防抖)
2019/09/19 Javascript
[53:21]2014 DOTA2国际邀请赛中国区预选赛5.21 DT VS LGD-CDEC
2014/05/22 DOTA
微信 用脚本查看是否被微信好友删除
2016/10/28 Python
Windows环境下python环境安装使用图文教程
2018/03/13 Python
python实现数据写入excel表格
2018/03/25 Python
python web框架中实现原生分页
2019/09/08 Python
python之yield和Generator深入解析
2019/09/18 Python
弄懂这56个Python使用技巧(轻松掌握Python高效开发)
2019/09/18 Python
python自动下载图片的方法示例
2020/03/25 Python
CSS3中利用animation属性创建雪花飘落特效
2014/05/14 HTML / CSS
FILA斐乐中国官方商城:意大利运动品牌
2017/01/25 全球购物
美国领先的个性化礼品商城:Personalization Mall
2019/07/27 全球购物
中医专业职业生涯规划书范文
2014/01/04 职场文书
2015年小学数学教师个人工作总结
2015/05/25 职场文书
张丽莉观后感
2015/06/16 职场文书
保险公司岗前培训工作总结
2015/10/24 职场文书
《坐井观天》教学反思
2016/02/18 职场文书
分享15个Webpack实用的插件!!!
2021/03/31 Javascript
React更新渲染原理深入分析
2022/12/24 Javascript