3 Ways to Detect an Array in JavaScript

栏目: IT技术 · 发布时间: 4年前

内容简介:Checking whether a value is an array in JavaScript is necessary when a variable is expected to be an array, but it could be a plain object or even a primitive.In this post, you’ll find 3 good ways to detect an array instance in JavaScript.If you don’t have

Checking whether a value is an array in JavaScript is necessary when a variable is expected to be an array, but it could be a plain object or even a primitive.

In this post, you’ll find 3 good ways to detect an array instance in JavaScript.

1. Array.isArray(value)

If you don’t have time to read the entire post, here’s a good way to detect an array in JavaScript: just use Array.isArray(value) utility function.

But if you want to know more, let’s continue.

Here are a few examples of using Array.isArray() :

const array = [1, 2, 3];
const object = { message: 'Hello!' };
const string = 'Hello!';
const empty = null;

Array.isArray(array);  // => trueArray.isArray(object); // => false
Array.isArray(string); // => false
Array.isArray(empty);  // => false

Array.isArray() has a good browser support . It’s the recommended way to check for an array in JavaScript.

Array.isArray(value) utility function returns true if value is an array.

2. value instanceof Array

An array is an object. And like any object in JavaScript, the array instance has a constructor function — Array .

Array invoked as a constructor (prefixed with new keyword) creates array instances:

const array = new Array(1, 2, 3);

array; // => [1, 2, 3]

Moreover, the array instance exposes its constructor using a property .constructor :

const array = [1, 2, 3];

array.constructor === Array; // => true

What is the operator that verifies whether a function is the constructor of an instance? instanceof !

Now emerges the next way to detect an array: value instance Array evaluates to true if value is an array.

Let’s see a few examples:

const array = [1, 2, 3];
const object = { message: 'Hello!' };
const string = 'Hello!';
const empty = null;

array  instanceof Array; // => trueobject instanceof Array; // => false
string instanceof Array; // => false
empty  instanceof Array; // => false

Resuming:

value instanceof Array expressions evaluates to true if value is an array.

Note: value instanceof Array evaluates to false when value is an array created in a different iframe than the Array constructor function. If you’re not writing cross-frames JavaScript, use this approach without worries.

3. ({}).toString.call(value)

toString() method of a plain JavaScript object returns '[object <type>]' , where <type> is the object type it was called upon. Take a look at the specification which indicates how exactly Object.prototype.toString() works.

In the simplest case, when toString() method is invoked directly on a plain object, it returns '[object Object]' :

({}).toString(); // => '[object Object]'

However, you can use anindirect call of toString() on different types of values, and the method returns the corresponding string representation of the type:

const array = [1, 2, 3];
const object = { message: 'Hello' };
const string = 'Hello!';
const empty = null;

({}).toString.call(array);   // => '[object Array]'({}).toString.call(object);  // => '[object Object]'
({}).toString.call(string);  // => '[object String]'
({}).toString.call(empty);   // => '[object Null]'

Now you can spot the idea: ({}).toString.call(value) equals to '[object Array]' if value is an array.

const array = [1, 2, 3];

({}).toString.call(array) === '[object Array]'; // => true

In conclusion:

({}).toString.call(value) === '[object Array]' expression evaluates to true if value is an array.

4. Summary

To detect an array my recommendation is to use Array.isArray(value) . The function returns a boolean whether value is an array. Simple as is.

Another approach is value instanceof Array expression that evaluates to true if value is an array. This approach uses the idea that Array function is the constructor of the arrays.

Finally, not the most aesthetic approach is to use the expression ({}).toString.call(value) === '[object Array]' that is true if value is an array.

Object.prototype.toString() returns the type representation of the object it was invoked upon, and the type representation of arrays is '[object Array]' .

What is your favorite way to detect arrays in JavaScript?


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

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

淘宝十年产品事

淘宝十年产品事

苏杰 / 电子工业出版社 / 2013-10-15 / 55.00

产品经理发展到一定阶段,再要成长,光靠学习一些知识、技能已经不够,必须通过经典案例来学习,而本书,就提供了小到页面细节、大到平台架构的丰富案例。电商从业者,无法无视“淘宝”这个标杆的存在,本书可帮助大家做出更好的选择。愿意思考的人们,也可以从“淘宝”这个产品,或者说社会 现象、经济现象里,找到每天都能体会到的那些变化的原因,从而想得更明白,活得更通透。 本书细数淘宝成立十年来经历的重大变化,......一起来看看 《淘宝十年产品事》 这本书的介绍吧!

图片转BASE64编码
图片转BASE64编码

在线图片转Base64编码工具

Markdown 在线编辑器
Markdown 在线编辑器

Markdown 在线编辑器

UNIX 时间戳转换
UNIX 时间戳转换

UNIX 时间戳转换