利用JS判断元素是否为数组的方法示例


Posted in Javascript onJanuary 08, 2021

此处提供可供验证的数据类型

let a = [1,2,3,4,5,6];
 let b = [
 {name: '张飞', type: 'tank'},
 {name: '关羽', type: 'soldier'},
 {name: '刘备', type: 'shooter'},
 ];
 let c = 123;
 let d = 'www';
 let e = {name: '安琪拉', type: 'mage'};

1.通过Array.isArray()

Array.isArray()能判断一个元素是否为数组,如果是就返回true,否则就返回false

console.log(Array.isArray(a)); // true
 console.log(Array.isArray(b)); // true
 console.log(Array.isArray(c)); // false
 console.log(Array.isArray(d)); // false
 console.log(Array.isArray(e)); // false

2.通过instanceof判断

instanceof运算符用于检测某个实例是否属于某个对象原型链中

console.log(a instanceof Array); // true
 console.log(b instanceof Array); // true
 console.log(c instanceof Array); // false
 console.log(d instanceof Array); // false
 console.log(e instanceof Array); // false

还可以用于判断对象

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

判断是否为数组就是检测Arrray.prototype属性是否存在于变量数组(a,b)的原型链上,显然a,b为数组,拥有Arrray.prototype属性,所以为true

3.通过对象构造函数的constructor判断

Obiect的每个实例都有构造函数constructor,保存着创建每个对象的函数

利用JS判断元素是否为数组的方法示例

console.log(a.constructor === Array); // true
console.log(b.constructor === Array); // true

以下包含判断其它的数据类型验证

console.log(c.constructor === Number); // true
console.log(d.constructor === String); // true
console.log(e.constructor === Object); // true

4.通过Object.prototype.toString.call()判断

通过原型链查找调用

console.log(Object.prototype.toString.call(a) === '[object Array]'); // true
console.log(Object.prototype.toString.call(b) === '[object Array]'); // true

以下包含判断其它的数据类型验证

console.log(Object.prototype.toString.call(c) === '[object Number]'); // true
console.log(Object.prototype.toString.call(d) === '[object String]'); // true
console.log(Object.prototype.toString.call(e) === '[object Object]'); // true

5.通过对象原型链上的isPrototypeOf()判断

Array.prototype属性为Array的构造函数原型,里面包含有一个方法 isPrototypeOf() 用于测试一个对象是否存在于;另一个对象的原型链上。

console.log(Array.prototype.isPrototypeOf(a)); // true
 console.log(Array.prototype.isPrototypeOf(b)); // true
 console.log(Array.prototype.isPrototypeOf(c)); // false
 console.log(Array.prototype.isPrototypeOf(d)); // false
 console.log(Array.prototype.isPrototypeOf(e)); // false

总结

到此这篇关于利用JS判断元素是否为数组的文章就介绍到这了,更多相关JS判断元素为数组内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
javascript CSS画图之基础篇
Jul 29 Javascript
Javascript 赋值机制详解
Nov 23 Javascript
jQuery中andSelf()方法用法实例
Jan 08 Javascript
JavaScript 学习笔记之基础中的基础
Jan 13 Javascript
JS处理json日期格式化问题
Oct 01 Javascript
基于JavaScript实现移除(删除)数组中指定元素
Jan 04 Javascript
javascript设置和获取cookie的方法实例详解
Jan 05 Javascript
JavaScript+html5 canvas实现图片破碎重组动画特效
Feb 22 Javascript
Vue2.0如何发布项目实战
Jul 27 Javascript
express框架下使用session的方法
Jul 31 Javascript
微信小程序获取当前位置和城市名
Nov 13 Javascript
Vue状态模式实现窗口停靠功能(灵动、自由, 管理后台Admin界面)
Mar 06 Javascript
JS实现页面侧边栏效果探究
Jan 08 #Javascript
antdesign-vue结合sortablejs实现两个table相互拖拽排序功能
Jan 08 #Vue.js
vue-quill-editor插入图片路径太长问题解决方法
Jan 08 #Vue.js
详解Typescript里的This的使用方法
Jan 08 #Javascript
Node.js 中如何收集和解析命令行参数
Jan 08 #Javascript
vue编写简单的购物车功能
Jan 08 #Vue.js
three.js中多线程的使用及性能测试详解
Jan 07 #Javascript
You might like
PHP 5昨天隆重推出--PHP 5/Zend Engine 2.0新特性
2006/10/09 PHP
为查询结果建立向后/向前按钮
2006/10/09 PHP
php实现json编码的方法
2015/07/30 PHP
php实现smarty模板无限极分类的方法
2015/12/07 PHP
WordPress导航菜单的滚动和淡入淡出效果的实现要点
2015/12/14 PHP
如何使用Javascript正则表达式来格式化XML内容
2013/07/04 Javascript
扩展JS Date对象时间格式化功能的小例子
2013/12/02 Javascript
js图片模糊切换显示特效的方法
2015/02/17 Javascript
解决同一页面中两个iframe互相调用jquery,js函数的方法
2016/12/12 Javascript
JS实现焦点图轮播效果的方法详解
2016/12/19 Javascript
jQuery 实现双击编辑表格功能
2017/06/19 jQuery
浅谈vue的iview列表table render函数设置DOM属性值的方法
2017/09/30 Javascript
详解vue中axios请求的封装
2019/04/08 Javascript
JS常用正则表达式超全集(密码强度校验,金额校验,IE版本,IPv4,IPv6校验)
2020/02/03 Javascript
vue-cli设置css不生效的解决方法
2020/02/07 Javascript
[01:09:19]DOTA2-DPC中国联赛 正赛 VG vs Aster BO3 第二场 2月28日
2021/03/11 DOTA
Python天气预报采集器实现代码(网页爬虫)
2012/10/07 Python
Python文件与文件夹常见基本操作总结
2016/09/19 Python
Python selenium实现微博自动登录的示例代码
2018/05/16 Python
对python抓取需要登录网站数据的方法详解
2018/05/21 Python
对numpy中的transpose和swapaxes函数详解
2018/08/02 Python
Python完成哈夫曼树编码过程及原理详解
2019/07/29 Python
Python限制内存和CPU使用量的方法(Unix系统适用)
2020/08/04 Python
Pytho爬虫中Requests设置请求头Headers的方法
2020/09/22 Python
CSS3自定义滚动条样式 ::webkit-scrollbar的示例代码详解
2020/06/01 HTML / CSS
基于HTML5 Canvas:字符串,路径,背景,图片的详解
2013/05/09 HTML / CSS
美国市场上最实惠的送餐服务:Dinnerly
2018/03/18 全球购物
美国珠宝精品店:Opulent Jewelers
2019/08/20 全球购物
最新结婚典礼主持词
2014/03/14 职场文书
施工员岗位职责
2014/03/16 职场文书
大学校务公开实施方案
2014/03/31 职场文书
十佳护士先进事迹
2014/05/08 职场文书
员工手册编写范本
2015/05/14 职场文书
2016年党员干部公开承诺书
2016/03/24 职场文书
mysql 带多个条件的查询方式
2021/06/05 MySQL
Vue Element-ui表单校验规则实现
2021/07/09 Vue.js