判断一个变量是数组还是对象
我们都知道数组也是属于对象,因此用一般的typeof 无法达到预期效果:
例如:
var a = [1, 2, 3];
console.log(typeof a);//object,
此时需要其他方法才能判断:
1.instanceof运算符
instanceof运算符用于通过查找原型链来检测某个变量是否为某个类型数据的实例,使用instanceof运算符可以判断一个变量是数组还是对象。
var a = [1, 2, 3];
console.log(a instanceof Array); // true
console.log(a instanceof Object); // true
var b = {name: 'kingx'};
console.log(b instanceof Array); // false
console.log(b instanceof Object); // true
通过上面代码可以发现,数组不仅是Array类型的实例,也是Object类型的实例。因此我们在判断一个变量是数组还是对象时,应该先判断数组类型,然后再去判断对象类型。如果先判断对象,那么数组值也会被判断为对象类型,这无法满足要求。
我们可以得到以下的封装函数。
// 判断变量是数组还是对象 function getDataType(o) { if (o instanceof Array) { return 'Array' } else if (o instanceof Object) { return 'Object'; } else { return 'param is not object type'; } }
2.判断构造函数
判断一个变量是否是数组或者对象,从另一个层面讲,就是判断变量的构造函数是Array类型还是Object类型。因为一个对象的实例都是通过构造函数生成的,所以,我们可以直接判断一个变量的constructor属性。
var a = [1, 2, 3];
console.log(a.constructor === Array); // true
console.log(a.constructor === Object); // false
var b = {name: 'kingx'};
console.log(b.constructor === Array); // false
console.log(b.constructor === Object); // true
那么一个变量为什么会有constructor属性呢?这就要涉及原型链的知识了。
每个变量都会有一个__proto__属性,表示的是隐式原型。一个对象的隐式原型指向的是构造该对象的构造函数的原型,这里用数组来举例,代码如下所示。
[]._ _proto_ _ === [].constructor.prototype; // true
[]._ _proto_ _ === Array.prototype; // true
我们可以将上面代码进行封装,得到一个判断变量是数组还是对象的通用函数。
function getDataType(o) { // 获取构造函数 var constructor = o._ _proto_ _.constructor || o.constructor; if (constructor === Array) { return 'Array'; } else if (constructor === Object) { return 'Object'; } else { return 'param is not object type'; } }
3. toString()函数
每种引用数据类型都会直接或间接继承自Object类型,因此它们都包含toString()函数。不同数据类型的toString()函数返回值也不一样,所以通过toString()函数就可以判断一个变量是数组还是对象。
这里我们会借助call()函数,直接调用Object原型上的toString()函数,把主体设置为需要传入的变量,然后通过返回值进行判断。
var a = [1, 2, 3];
var b = {name: 'kingx'};
console.log(Object.prototype.toString.call(a)); // [object Array]
console.log(Object.prototype.toString.call(b)); // [object Object]
其实任何类型的变量在调用toString()函数时,都会返回不同的结果。
Object.prototype.toString.call(1); // [object Number]
Object.prototype.toString.call('kingx'); // [object String]
var c;
Object.prototype.toString.call(c); // [object Undefined]
通过返回的结果字符串来判断,即可解决这个问题。我们将代码进行如下封装。
// 判断变量是数组还是对象 function getDataType(o) { var result = Object.prototype.toString.call(o); if (result === '[object Array]') { return 'Array'; } else if (result === '[object Object]') { return 'Object'; } else { return 'param is no object type'; } }
4.Array.isArray()函数
在JavaScript 1.8.5版本中,数组增加了一个isArray()静态函数,用于判断变量是否为数组。传入需要判断的变量,即可确定该变量是否为数组,使用起来很简单。
// 下面的函数调用都返回“true”
Array.isArray([]);
Array.isArray([1]);
Array.isArray(new Array());
// 鲜为人知的事实:其实 Array.prototype 也是一个数组。
Array.isArray(Array.prototype);
// 下面的函数调用都返回“false”
Array.isArray();
Array.isArray({});
Array.isArray(null);
Array.isArray(undefined);
Array.isArray(17);
Array.isArray('Array');
Array.isArray(true);
使用Array.isArray()函数只能判断出变量是否为数组,并不能确定是否为对象。
原文地址:https://www.cnblogs.com/aoshilin/p/15008296.html
- PhalGo-初识PhalGO
- 【学术】如何在神经网络中选择正确的激活函数
- PhalGo-Echo路由
- PhalGo-介绍
- 数据库分库分表中间件 Sharding-JDBC 源码分析 —— 分布式主键
- [喵咪Golang(2)]安装和Helloworld
- LSTM的简单介绍,附情感分析应用
- 使用实体嵌入的结构化数据进行深度学习
- Otter-入门篇3(Node搭建)
- PhalGo-Respones
- 数据库分库分表中间件 Sharding-JDBC 源码分析 —— SQL 改写
- Otter-入门篇2(Manager安装配置)
- Java的字符串常量相关的一个问题
- [喵咪Liunx(3)]端口转发工具rinetd
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Java——代码块(普通块、构造块、静态块)
- JavaWeb——JQuery之五种选择器的应用及实践案例总结(基本选择器、层级选择器、属性选择器、过滤选择器、表单过滤选择器)
- Java——引用传递实例分析(进阶分析、对象比较、类与类的关联实现)
- JavaWeb——JQuery之基本概述与快速入门实践总结(JQuery各版本区别、JQuery对象和JS对象的区别与转换)
- Java——动态代理设计模型概述(实现步骤、增强方式)与代理商采购电脑模拟程序实战
- Java——this关键字(调用本类属性、调用本类方法、表示当前对象)
- 5分钟玩转Lighthouse|零基础也能拥有WordPress个人博客
- Java——String类常用方法总结,看这一篇就够啦(比较、查找、截取、替换、拆分、其他)
- Java——深入分析类与对象(封装性、构造方法与匿名对象、简单Java类开发原则)
- Java——类与对象(基本概念、定义、内存分析、引用传递)
- Java——Stream数据流
- JavaWeb——MyBatis框架之连接池原理、MyBatis事务提交设置、动态SQL语法总结
- 8种ETL算法归纳总结,看完这些你就全明白了
- JavaWeb——Maven基础之详细总结,从零开始搭建Maven工程,包含一些常见的坑org.eclipse.jdt.internal.compiler.classfmt.ClassFormatEx
- JavaWeb——Redis数据库之Jedis操作5种类型数据的使用总结与前端Ajax获取Redis缓存数据的案例实战(结合了MySQL数据库)