What is a pseudo array in javascript

青灯夜游
Release: 2021-10-19 16:47:15
Original
2638 people have browsed it

In JavaScript, a pseudo-array, also known as an array-like object, is an array-like object that stores data according to an index and has a length attribute; because it is an object, the pseudo-array does not have the push of an array. (), forEach() and other methods.

What is a pseudo array in javascript

The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.

Definition and characteristics of pseudo array

Pseudo array (ArrayLike), also known as array-like. Is an array-like object that stores data according to index and has a length property.But it has the following characteristics.

  • Storing data by index

    0: xxx, 1: xxx, 2: xxx...

  • Has thelengthattribute

    But thelengthattribute is not dynamic and will not change as the members change

  • Methods such as push() and forEach() without arrays

    arrayLike.__proto__ === Object.prototype; //true arrayLike instanceof Object; //true arrayLike instanceof Array; //false
    Copy after login

Common typical pseudo-arrays, including the set of DOM elements obtained through $() in jQuery, functions The arguments object, and the String object.

Example:

var arrLike = { 0: 'a', 1: 'b', 2: 'c', length: 3, } arrLike[1]; //'a' arrLike.length; //3 arrLike.push('d'); //Uncaught TypeError: arrLike.push is not a function
Copy after login

How to convert a pseudo array into a real array

var arrLike = { 0: 'a', 1: 'b', 2: 'c', length: 3, };
Copy after login

1. Traverse and add an empty array

var arr = []; for(var i = 0; i < arrLike.length; i++){ arr.push(arrLike[i]); }
Copy after login

Relatively simple and easy to understand, but the steps are a bit cumbersome.

2. Use slice() method of array [Recommended]

;[].slice.call(arrLike);
Copy after login

or

Array.prototype.slice.apply(arrLike);
Copy after login

Use slice() to return a new array, use call() or apply() points its scope to a pseudo array.

Note that no additional attributes other than the index value will be retained in the returned array.

For example, the context attribute in the DOM pseudo array obtained by $() in jQuery will not be retained after being converted by this method.

Simulate the internal implementation of slice()

Array.prtotype.slice = function(start, end){ var result = new Array(); var start = start | 0; var end = end | this.length; for(var i = start; i < end; i++){ result.push(this[i]); } return result; }
Copy after login

3. Modify the prototype pointer

arrLike.__proto__ = Array.prototype;
Copy after login

In this way, arrLike inherits the method in Array.prototype , you can use push(), unshift() and other methods, and the length value will also change dynamically.

In addition, this method of directly modifying the prototype chain will also retain all attributes in the pseudo array, including attributes that are not index values.

4. The Array.from() method in ES2015

The Array.from() method creates a new array instance from an array-like or iterable object. .

var arr = Array.from(arrLike);
Copy after login

The result obtained is similar to the second method, only the attributes within the index value are retained.

[Recommended learning:javascript advanced tutorial]

The above is the detailed content of What is a pseudo array in javascript. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!