JavaScript判断数组类型的方法

前言

JavaScript中关于数组的判定问题,一直都是一个必须要掌握的点,那么,运用知识,如何判断一个类型是数组,就需要有对JavaScript使用有着深入的了解。

判断方法

一、Array.isArray

ES5新增的数组方法,Array.isArray应该是我们最先想到的判定方式,现在应用的也比较广泛。

const arr = [1,2,3,4]
Array.isArray(arr)  // true

如果是在支持ES5的浏览器中,用这样的方式自然没什么问题,但是如果是在IE9以下版本,这个方法并未受到支持,这时候我们就要用别的方式来判断数组。

二、instanceof

一般来说,instanceof关键字,是用来判断某个元素是否某对象构造函数实例。在数组判断上,instanceof关键字也可以进行数组的判定。

const arr = [1, 2, 3, 4]
arr instanceof Array  // true

instanceof支持的浏览器版本比较多,所以一般来说,用instanceof判断,会比Array.isArray判定的范围要广泛。

三、toString

对象的toString方式也可以判定数组类型,一般来说这种方式的判定是各大库的一种Array.isArray的代替实现。

例如,polyfill中,就是如此实现:

if (!Array.isArray) {
 Array.isArray = function(arg) {
  return Object.prototype.toString.call(arg) === '[object Array]';
 };
}

const arr = [1, 2, 3, 4]
Object.prototype.toString.call(arr) === '[Object Array]'  // true

四、constructor

除了以上的方式之外,我们还可以通过构造函数来判定:

const arr = [1, 2, 3, 4]
arr.constructor === Array // true
arr.__proto__.constructor === Array //true

弊端

instanceof和constructor的判定也存在一些弊端,他们判定的数组必须定义在同一个页面,否则将会判定为false。

如果在iframe中的数组判定,就会出错。

var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
xArray = window.frames[window.frames.length-1].Array;
var arr = new xArray(1,2,3); // [1,2,3]

// Correctly checking for Array
Array.isArray(arr); // true
// Considered harmful, because doesn't work through iframes
arr instanceof Array; // false
arr.constructor === Array; // false

总结

由上述几个方法判定,可以得出,其实polyfill的判定是最合理的,也最具有兼容性的一种判定。

利用toString判定,胜出。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

时间: 2019-10-22

JS实现判断数组是否包含某个元素示例

本文实例讲述了JS实现判断数组是否包含某个元素.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <script> Array.prototype.S = String.fromC

JavaScript判断数组重复内容的两种方法(推荐)

前言 一般,我们可能会给数组去重,这个操作并不复杂,执行一个循环就是了.现在,我要做的是,判断数组中是否有重复的内容,如果有,返回 true 否则,返回 false. 思路 把数组变成字符串 循环原数组,拿每一个字段和这个字符串进行比对,看是否有重复 如何拿A字符串和B字符串进行对比,并且要求判断出B字符串中包含过个A字符串呢? 方法一 indexOf() 和 lastIndexOf() 对比法. 首先,我们构建代码: var arr = ["aa","bb",&q

JS判断数组里是否有重复元素的方法小结

本文实例讲述了JS判断数组里是否有重复元素的方法.分享给大家供大家参考,具体如下: 第一种方法:但是下面的这种方法数字字符串类似相同,返回的还是真,有点不靠谱,如果是其它的字符是可以的 var ary11 = new Array("1", "ff", "11", "aa", "2222"); // 验证重复元素,有重复返回true:否则返回false function mm(a) { return /(\x

JS判断元素是否在数组内的实现代码

一.JQuery 如果是用JQuery的话,可以用inArray()函数: jquery inarray()函数详解 jquery.inarray(value,array) 确定第一个参数在数组中的位置(如果没有找到则返回 -1 ). determine the index of the first parameter in the array (-1 if not found). 返回值 jquery 参数 value (any) : 用于在数组中查找是否存在 array (array) :

angularjs数组判断是否含有某个元素的实例

也就是in_array函数,判断数组中是否含有某个元素. Array.prototype.in_array = function(e) { for(i=0;i<this.length;i++) { if(this[i] == e) return true; } return false; } 使用方法: tmp.in_array(id) 以上这篇angularjs数组判断是否含有某个元素的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们. 您可能感兴趣的文章: A

js判断数组是否包含某个字符串变量的实例

最近碰到一个这样的现象,后台返回的数据中,数组里面有一些有变量值,有一些没有变量值. 举个例子,比如后台返回的例子是这样的: var arr=[ { "status":"success", "activerUserData": [ {"activeUser":"张珊","activeUserMobile":"15542175311","countNum&qu

JS 判断某变量是否为某数组中的一个值的3种方法(总结)

1.正则表达式 js 中判断某个元素是否存在于某个 js 数组中,相当于 PHP 语言中的 in_array 函数. Array.prototype.in_array=function(e){ var r=new RegExp(','+e+','); return (r.test(','+this.join(this.S)+','));}; 用法如下: var arr=new Array(['b',2,'a',4]); arr.in_array('b');//判断'b'字符是否存在于 arr 数

判断数组是否包含某个元素的js函数实现方法

判断数组是否包含某个元素的js函数实现方法 Array.prototype.contains = function(obj) { var i = this.length; while (i--) { if (this[i] === obj) { return true; } } return false; } 或 Array.prototype.contains = function(element) { for (var i = 0; i < this.length; i++) { if (t

JS判断两个数组或对象是否相同的方法示例

本文实例讲述了JS判断两个数组或对象是否相同的方法.分享给大家供大家参考,具体如下: JS 判断两个数组是否相同 要判断2个数组是否相同,首先要把数组进行排序,然后转换成字符串进行比较. JSON.stringify([1,2,3].sort()) === JSON.stringify([3,2,1].sort()); //true 或者 [1,2,3].sort().toString() === [3,2,1].sort().toString(); //true 经验证,上述方法对复杂数组结构

js判断两个数组相等的5种方法实例

目录 前言 一. toString() 二.join() 三. JSON.stringify() 四.sort() 五.filter() 总结 前言 在 js 中是不能直接用 == 或者 === 来比较两个数组是否相等,那就需要对数组的值进行比较. 下面各种方法,要根据具体情况来使用. 一. toString() 当两个数组元素类型相同,顺序相同时,直接判断是否相等,结果不相等:转化为字符串后,结果相等 [1,2,3].toString() === [1, 2, 3].toString(); /

js取两个数组的交集|差集|并集|补集|去重示例代码

复制代码 代码如下: /** * each是一个集合迭代函数,它接受一个函数作为参数和一组可选的参数 * 这个迭代函数依次将集合的每一个元素和可选参数用函数进行计算,并将计算得的结果集返回 {%example <script> var a = [1,2,3,4].each(function(x){return x > 2 ? x : null}); var b = [1,2,3,4].each(function(x){return x < 0 ? x : null}); alert

JS判断两个对象内容是否相等的方法示例

本文实例讲述了JS判断两个对象内容是否相等的方法.分享给大家供大家参考,具体如下: 我们知道,如果两个对象即使内容,JavaScript也会判断它们不相等.但是有时候,我们仅仅需要判断两个对象的内容是否相等.那么我们应该如何做到且考虑周全呢?比如说0和-0,null和undefined,是不相等的,NaN和NaN默认是不相等的.我写了一个isEqual方法,考虑到了诸多方面,代码如下: <!DOCTYPE html> <html> <head> <meta cha

es6 js 匹配两个数组对象的方法

判断两个数组用的value是否相等 this.list = [ { user_type: 0, user_id: 1003, department_id: 1, department_name: "公司xx", mobile: "", realname: "廖xx", com_name: "任公司", label: "廖建平", value: 1003 }, { user_type: 0, user_id:

JS合并两个数组的3种方法详解

这篇文章主要介绍了JS合并两个数组的3种方法详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 需要将两个数组合并成为一个的情况.比如: var a = [1,2,3]; var b = [4,5,6]; 有两个数组a.b,需求是将两个数组合并成一个.方法如下: 1.concat js的Array对象提供了一个叫concat()方法,连接两个或更多的数组,并返回结果. var c = a.concat(b); //c=[1,2,3,4,5,6]

IOS开发之判断两个数组中数据是否相同实例详解

IOS开发之判断两个数组中数据是否相同实例详解 前言: 工作中遇到的问题,这里记录下,也许能帮助到大家 实例代码: NSArray *array1 = [NSArray arrayWithObjects:@"a", @"b", @"c", nil nil]; NSArray *array2 = [NSArray arrayWithObjects:@"b", @"a", @"c", nil

JS计算两个数组的交集、差集、并集、补集(多种实现方式)

方法一:最普遍的做法 使用 ES5 语法来实现虽然会麻烦些,但兼容性最好,不用考虑浏览器 JavaScript 版本.也不用引入其他第三方库. 1,直接使用 filter.concat 来计算 var a = [1,2,3,4,5] var b = [2,4,6,8,10] //交集 var c = a.filter(function(v){ return b.indexOf(v) > -1 }) //差集 var d = a.filter(function(v){ return b.index

详解JS取出两个数组中的不同或相同元素

1.取出两个数组的不同元素 var arr1 = [0,1,2,3,4,5]; var arr2 = [0,4,6,1,3,9]; function getArrDifference(arr1, arr2) { return arr1.concat(arr2).filter(function(v, i, arr) { return arr.indexOf(v) === arr.lastIndexOf(v); }); } console.log(getArrDifference(arr1,arr2

js基础之DOM中document对象的常用属性方法详解

-----引入 每个载入浏览器的 HTML 文档都会成为 Document 对象. Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问. 属性 1  document.anchors  返回对文档中所有 Anchor 对象的引用.还有document.links/document.forms/document.images等 2  document.URL       返回当前文档的url 3  document.title       返回当前文档的标题 4  do