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之锁定表格栏位
Jun 29 Javascript
jQuery 常见学习网站与参考书
Nov 09 Javascript
JavaScript高级程序设计(第3版)学习笔记10 再访js对象
Oct 11 Javascript
使用闭包对setTimeout进行简单封装避免出错
Jul 10 Javascript
javascript针对不确定函数的执行方法
Dec 16 Javascript
jQuery中判断对象是否存在的方法汇总
Feb 24 Javascript
html5+javascript实现简单上传的注意细节
Apr 18 Javascript
Vue.js实战之利用vue-router实现跳转页面
Apr 01 Javascript
使用vue和datatables进行表格的服务器端分页实例代码
Jun 07 Javascript
基于jQuery对象和DOM对象和字符串之间的转化实例
Aug 08 jQuery
JQuery使用属性addClass、removeClass和toggleClass实现增加和删除类操作示例
Nov 18 jQuery
vue实现分页的三种效果
Jun 23 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
第二节 对象模型 [2]
2006/10/09 PHP
PHP缓存技术的多种方法小结
2012/08/14 PHP
解析thinkphp基本配置 convention.php
2013/06/18 PHP
php格式输出文件var_export函数实例
2014/11/15 PHP
ThinkPHP连接数据库的方式汇总
2014/12/05 PHP
Javascript 学习书 推荐
2009/06/13 Javascript
优化javascript的执行效率一些方法总结
2013/12/25 Javascript
使用javascript做的一个随机点名程序
2014/02/13 Javascript
jQuery中:selected选择器用法实例
2015/01/04 Javascript
谈谈javascript中使用连等赋值操作带来的问题
2015/11/26 Javascript
动态加载js文件简单示例
2016/04/21 Javascript
vue2.0开发实践总结之入门篇
2016/12/06 Javascript
js 文字超出长度用省略号代替,鼠标悬停并以悬浮框显示实例
2016/12/06 Javascript
AngularJS 文件上传控件 ng-file-upload详解
2017/01/13 Javascript
jQuery实现用户输入自动完成功能
2017/02/13 Javascript
vue实现压缩图片预览并上传功能(promise封装)
2019/01/10 Javascript
M2实现Nodejs项目自动部署的方法步骤
2019/05/05 NodeJs
原理深度解析Vue的响应式更新比React快
2020/04/04 Javascript
在vue中使用cookie记住用户上次选择的实例(本次例子中为下拉框)
2020/09/11 Javascript
如何实现小程序与小程序之间的跳转
2020/11/04 Javascript
[01:25:38]DOTA2-DPC中国联赛 正赛 VG vs LBZS BO3 第一场 1月19日
2021/03/11 DOTA
Python标准库之循环器(itertools)介绍
2014/11/25 Python
python3.5 email实现发送邮件功能
2018/05/22 Python
python制作抖音代码舞
2019/04/07 Python
Python线程条件变量Condition原理解析
2020/01/20 Python
django有哪些好处和优点
2020/09/01 Python
7 For All Mankind官网:美国加州洛杉矶的高级牛仔服装品牌
2018/12/20 全球购物
企业演讲稿范文
2013/12/28 职场文书
致长跑运动员广播稿
2014/01/31 职场文书
法制演讲稿
2014/09/10 职场文书
银行柜员与客户起冲突检讨书
2014/09/27 职场文书
学生检讨书如何写
2014/10/30 职场文书
预备党员半年考察意见
2015/06/01 职场文书
公司趣味运动会开幕词
2016/03/04 职场文书
MySQL创建索引需要了解的
2021/04/08 MySQL
MySQL子查询中order by不生效问题的解决方法
2021/08/02 MySQL