利用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 相关文章推荐
一些易混淆且不常用的属性,希望有用
Jan 29 Javascript
更快的异步执行(setTimeout多浏览器)
Aug 12 Javascript
node.js中的http.response.removeHeader方法使用说明
Dec 14 Javascript
jQuery找出网页上最高元素的方法
Mar 20 Javascript
AngularJS 基础ng-class-even指令用法
Aug 01 Javascript
bootstrap模态框实现拖拽效果
Dec 14 Javascript
Bootstrap与Angularjs的模态框实例代码
Aug 03 Javascript
微信小程序定位当前城市的方法
Jul 19 Javascript
webpack4 + react 搭建多页面应用示例
Aug 03 Javascript
Vue formData实现图片上传
Aug 20 Javascript
layer弹出层显示在top顶层的方法
Sep 11 Javascript
Vue 解决在element中使用$notify在提示信息中换行问题
Nov 11 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
smarty实例教程
2006/11/19 PHP
php中防止恶意刷新页面的代码小结
2012/10/31 PHP
PHP的Socket网络编程入门指引
2015/08/11 PHP
laravel框架语言包拓展实现方法分析
2019/11/22 PHP
JavaScript创建命名空间(namespace)的最简实现
2007/12/11 Javascript
jQuery+css实现图片滚动效果(附源码)
2013/03/18 Javascript
javascript获取checkbox复选框获取选中的选项
2014/08/12 Javascript
js实现可折叠展开的手风琴菜单效果
2015/09/07 Javascript
JS实现CheckBox复选框全选、不选或全不选功能
2020/07/28 Javascript
JavaScript添加随滚动条滚动窗体的方法
2016/02/23 Javascript
Bootstrap布局组件教程之Bootstrap下拉菜单
2016/06/12 Javascript
jquery日历插件e-calendar升级版
2016/11/10 Javascript
Node.js的Koa实现JWT用户认证方法
2018/05/05 Javascript
详解webpack import()动态加载模块踩坑
2018/07/17 Javascript
JS实现十分钟倒计时代码实例
2018/10/18 Javascript
vue-router重定向和路由别名的使用讲解
2019/01/19 Javascript
[55:35]DOTA2-DPC中国联赛 正赛 CDEC vs Dragon BO3 第二场 1月22日
2021/03/11 DOTA
小结Python用fork来创建子进程注意事项
2014/07/03 Python
初步讲解Python中的元组概念
2015/05/21 Python
浅谈django三种缓存模式的使用及注意点
2018/09/30 Python
Django MEDIA的配置及用法详解
2019/07/25 Python
Python实现朴素贝叶斯的学习与分类过程解析
2019/08/24 Python
python等差数列求和公式前 100 项的和实例
2020/02/25 Python
中外合拍动画首获奥斯卡提名,“上海出品”《飞奔去月球》能否拿下最终大奖?
2021/03/16 国漫
关于HTML5你必须知道的28个新特性,新技巧以及新技术
2012/05/28 HTML / CSS
海信商城:海信电视、科龙空调、容声冰箱官方专卖
2017/02/07 全球购物
SneakerStudio英国:最佳运动鞋商店
2019/05/22 全球购物
盛大二次面试题
2016/11/18 面试题
秘书岗位职责
2013/11/18 职场文书
《他得的红圈圈最多》教学反思
2014/04/24 职场文书
班训口号大全
2014/06/18 职场文书
大学学生个人总结
2015/02/15 职场文书
学习型家庭事迹材料(2016精选版)
2016/02/29 职场文书
pytorch 一行代码查看网络参数总量的实现
2021/05/12 Python
ConstraintValidator类如何实现自定义注解校验前端传参
2021/06/18 Java/Android
GO中sync包自由控制并发示例详解
2022/08/05 Golang