javascript判断一个变量是数组还是对象


Posted in Javascript onApril 10, 2019

javascript中如何准确判断一个变量是什么,面试中这是考一个人基本功扎不扎实必定会问的一个问题。如果你还不是很清楚,相信这篇文章会对你有所帮助。

一,判断方法

1.typeof

我们能够使用typeof判断变量的身份,判断字符串得到string,数字和NaN得到number,函数会得到function等,但是判断数组,对象和null时都会得到object,详细请看js数据类型,这就是typeof的局限性,并不能准确的判断该变量的"真实身份"。那如何判断一个变量是数组还是对象?

 2.instanceof

使用instanceof可以用来判断一个变量是数组还是对象,原理如下:
数组也是对象的一种,使用instanceof都会返回true

var arr = new Array();

var arr = ['aa','bb','cc'];

var obj = { a: 'aa', b: 'bb', c: 'cc' };

console.log(arr instanceof Array); //true

console.log(arr instanceof Object); //true

console.log(obj instanceof Array); //false

console.log(obj instanceof Object); //true

instanceof是如何判断的:

instanceof 运算符用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性,意思就是该变量通过原型链上能否找到构造函数的prototype 属性,还不清楚原型链的请看原型链,所以就能明白为什么instanceof判断一个变量可以分清楚它到底是数组还是对象:

Array.prototype === arr.__proto__
Object.prototype === arr.__proto__.__proto__
因为arr的原型链上存在Array.prototype和Object.prototype
只有Array类型的变量才会满足arr instanceof Array和arr instanceof Object都返回true,
也只有Object类型变量才满足obj instanceof Array返回false,obj instanceof Object返回true        

3.constructor

var arr = ['aa','bb','cc'];
var obj = {
'a': 'aa',
'b': 'bb',
'c': 'cc'
};
console.log(arr.constructor === Array); //true
console.log(arr.constructor === Object); //false
console.log(obj.constructor === Object); //true

4.Object.prototype.toString.call()

Object.prototype.toString.call()方法可以精准判断变量类型,它返回[object constructorName]的字符串格式,这里的constructorName就是call参数的函数名

var a = NaN;
var b= '222';
var c = null;
var d = false;
var e = undefined;
var f = Symbol(); 
var arr = ['aa','bb','cc'];
var obj = { 'a': 'aa', 'b': 'bb', 'c': 'cc' }; 
var res = Object.prototype.toString.call(arr);
console.log(res); 
//[object Array] var res2 = Object.prototype.toString.call(obj); console.log(res2); //[object Object] var res3 = Object.prototype.toString.call(a); console.log(res3); //[object Number] var res4 = Object.prototype.toString.call(b); console.log(res4); //[object String] var res4 = Object.prototype.toString.call(c); console.log(res4); //[object Null] var res5 = Object.prototype.toString.call(d); console.log(res5); //[object Boolean] var res6 = Object.prototype.toString.call(e); console.log(res6); //[object Undefined] var res7 = Object.prototype.toString.call(f); console.log(res7); //[object Symbol]// JavaScript Document

二,总结

判断简单数据类型可以用typeof,判断数组,对象使用instanceof,constructor和 Object.prototype.toString.call(),最好使用Object.prototype.toString.call(),更加精准

以上所述是小编给大家介绍的javascript判断一个变量是数组还是对象详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
测试JavaScript字符串处理性能的代码
Dec 07 Javascript
ASP.NET jQuery 实例12 通过使用jQuery validation插件简单实现用户注册页面验证功能
Feb 03 Javascript
javascript相等运算符与等同运算符详细介绍
Nov 09 Javascript
JavaScript—window对象使用示例
Dec 09 Javascript
JS实现两个大数(整数)相乘
Apr 28 Javascript
完美兼容各大浏览器的jQuery插件实现图片切换特效
Dec 12 Javascript
TypeScript 学习笔记之基本类型
Jun 19 Javascript
JavaScript实现给按钮加上双重动作的方法
Aug 14 Javascript
JavaScript Promise 用法
Jun 14 Javascript
微信小程序 template模板详解及实例
Feb 21 Javascript
微信小程序之自定义组件的实现代码(附源码)
Aug 02 Javascript
JavaScript对象的特性与实践应用深入详解
Dec 30 Javascript
Angular CLI 使用教程指南参考小结
Apr 10 #Javascript
基于vue开发微信小程序mpvue-docs跳转页面功能
Apr 10 #Javascript
element-ui多文件上传的实现示例
Apr 10 #Javascript
基于mpvue搭建微信小程序项目框架的教程详解
Apr 10 #Javascript
Webpack4+Babel7+ES6兼容IE8的实现
Apr 10 #Javascript
微信小程序第三方框架对比 之 wepy / mpvue / taro
Apr 10 #Javascript
用node撸一个监测复联4开售短信提醒的实现代码
Apr 10 #Javascript
You might like
从零开始 教你如何搭建Discuz!4.1论坛
2006/07/07 PHP
mysql,mysqli,PDO的各自不同介绍
2012/09/19 PHP
PHP iconv()函数字符编码转换的问题讲解
2019/03/22 PHP
javascript操作文本框readOnly
2007/05/15 Javascript
jquery 循环显示div的示例代码
2013/10/18 Javascript
javascript实现简单的进度条
2015/07/02 Javascript
jQuery+Ajax+PHP+Mysql实现分页显示数据实例讲解
2015/09/27 Javascript
详解JavaScript中this关键字的用法
2016/05/26 Javascript
Highcharts 多个Y轴动态刷新数据的实现代码
2016/05/28 Javascript
JS表单验证方法实例小结【电话、身份证号、Email、中文、特殊字符、身份证号等】
2017/02/14 Javascript
bootstrap响应式工具使用详解
2017/11/29 Javascript
nodejs爬虫初试superagent和cheerio
2018/03/05 NodeJs
使用nvm和nrm优化node.js工作流的方法
2019/01/17 Javascript
构建Vue大型应用的10个最佳实践(小结)
2019/11/07 Javascript
urllib2自定义opener详解
2014/02/07 Python
Python中使用select模块实现非阻塞的IO
2015/02/03 Python
使用Python脚本将Bing的每日图片作为桌面的教程
2015/05/04 Python
python fabric使用笔记
2015/05/09 Python
使用Python保存网页上的图片或者保存页面为截图
2016/03/05 Python
Python短信轰炸的代码
2020/03/25 Python
Python实现快速大文件比较代码解析
2020/09/04 Python
基于tensorflow __init__、build 和call的使用小结
2021/02/26 Python
捷克时尚网上商店:OTTO
2018/03/15 全球购物
美国在线咖啡、茶和餐厅供应商:LollicupStore
2018/05/04 全球购物
英国时尚高尔夫服装购物网站:Trendy Golf
2020/01/10 全球购物
高中生自我鉴定范文
2013/10/30 职场文书
《满井游记》教学反思
2014/02/26 职场文书
简洁的英文求职信范文
2014/05/03 职场文书
三严三实对照检查材料
2014/09/22 职场文书
大学生党性分析材料
2014/12/19 职场文书
2015年推普周活动方案
2015/05/06 职场文书
寻找成龙观后感
2015/06/12 职场文书
2019年图书室自查报告范本
2019/10/12 职场文书
深入理解redis中multi与pipeline
2021/06/02 Redis
详解MongoDB的条件查询和排序
2021/06/23 MongoDB
浅谈css清除浮动(clearfix和clear)的用法
2023/05/21 HTML / CSS