基于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 相关文章推荐
JavaScript代码实现禁止右键、禁选择、禁粘贴、禁shift、禁ctrl、禁alt
Nov 17 Javascript
跟我学习javascript创建对象(类)的8种方法
Nov 20 Javascript
JavaScript基础知识点归纳(推荐)
Jul 09 Javascript
js无提示关闭浏览器窗口的两种方法分析
Nov 06 Javascript
微信小程序 swiper组件轮播图详解及实例
Nov 16 Javascript
JS实现的图片预览插件与用法示例【不上传图片】
Nov 25 Javascript
深入理解Promise.all
Aug 08 Javascript
基于JavaScript实现一个简单的Vue
Sep 26 Javascript
js实现移动端轮播图
Dec 21 Javascript
详解Vue项目中实现锚点定位
Apr 24 Javascript
如何对react hooks进行单元测试的方法
Aug 14 Javascript
Vue.extend 登录注册模态框的实现
Dec 29 Vue.js
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
图象函数中的中文显示
2006/10/09 PHP
发布一个用PHP fsockopen写的HTTP下载的类
2007/02/22 PHP
用PHP实现的随机广告显示代码
2007/06/14 PHP
PHP使用SWOOLE扩展实现定时同步 MySQL 数据
2017/04/09 PHP
PHP下载大文件失败并限制下载速度的实例代码
2019/05/10 PHP
彪哥1.1(智能表格)提供下载
2006/09/07 Javascript
Jquery replace 字符替换实现代码
2010/12/02 Javascript
你可能不知道的JavaScript的new Function()方法
2014/04/17 Javascript
JavaScript实现强制重定向至HTTPS页面
2015/06/10 Javascript
JavaScript通过代码调用Flash显示的方法
2016/02/02 Javascript
JavaScript 通过Ajax 动态加载CheckBox复选框
2017/08/31 Javascript
微信小程序实现列表下拉刷新上拉加载
2020/07/29 Javascript
vue 组件高级用法实例详解
2018/04/11 Javascript
使用 vue-i18n 切换中英文效果
2018/05/23 Javascript
vue新vue-cli3环境配置和模拟json数据的实例
2018/09/19 Javascript
jQuery 同时获取多个标签的指定内容并储存为数组
2018/11/20 jQuery
layui 选择列表,打勾,点击确定返回数据的例子
2019/09/02 Javascript
20多个小事例带你重温ES10新特性(小结)
2019/09/29 Javascript
详解python3实现的web端json通信协议
2016/12/29 Python
python 读取文本文件的行数据,文件.splitlines()的方法
2018/07/12 Python
Python实现动态给类和对象添加属性和方法操作示例
2020/02/29 Python
Python-jenkins模块之folder相关操作介绍
2020/05/12 Python
PyTorch在Windows环境搭建的方法步骤
2020/05/12 Python
Python参数传递实现过程及原理详解
2020/05/14 Python
英国最大的手表网站:The Watch Hut
2017/03/31 全球购物
漫威玩具服装及周边商品官方购物网站:Marvel Shop
2019/05/11 全球购物
利达恒信公司.NET笔试题面试题
2016/03/05 面试题
残疾人创业典型事迹
2014/02/01 职场文书
大学生个人自荐信
2014/02/24 职场文书
诚信考试标语
2014/06/24 职场文书
市委常委班子党的群众路线教育实践活动整改措施
2014/10/02 职场文书
2015年导购员工作总结
2015/04/25 职场文书
参加招聘会后的感想
2015/08/10 职场文书
小学三年级语文教学反思
2016/03/03 职场文书
pytorch 如何使用amp进行混合精度训练
2021/05/24 Python
SpringBoot集成Redis,并自定义对象序列化操作
2021/06/22 Java/Android