Home >Web Front-end >JS Tutorial >Introduction to js arrays

Introduction to js arrays

不言
不言Original
2018-07-20 15:49:301444browse

What is js array (ArrayLike)? The js class array has the length attribute, and other attributes (indexes) are non-negative integers (the index in the object will be treated as a string, here you can understand it as a non-negative integer string); it does not have the methods of the array .

Example:

//类数组示例
var a = {'1':'gg','2':'love','4':'meimei',length:5};
Array.prototype.join.call(a,'+');//'+gg+love++meimei'//非类数组示例
var c = {'1':2};   //没有length属性就不是类数组

Common class arrays in JavaScript include arguments objects and the return results of DOM methods.
For example document.getElementsByTagName().

1. Determine whether an object is an array class

function isArrayLike(o) {    
if (o &&                                // o is not null, undefined, etc.
        typeof o === 'object' &&            // o is an object
        isFinite(o.length) &&               // o.length is a finite number
        o.length >= 0 &&                    // o.length is non-negative
        o.length===Math.floor(o.length) &&  // o.length is an integer
        o.length < 4294967296)              // o.length < 2^32
        return true;                        // Then o is array-like
    else
        return false;                       // Otherwise it is not}

2. What are the advantages of operating after converting a js class array into an array

Because class arrays do not have the characteristics of arrays Methods for operating arrays. After converting a class array into an array, you can call powerful methods such as shift, unshift, splice, slice, concat, reverse, sort, etc., which is convenient and fast.

3. Convert js class array to array method

Array.prototype.slice.call(arrayLike)
//将arguments转化为数组后,截取第一个元素之后的所有元素
  var args = Array.prototype.slice.call(arguments,1);

First, the result of Array.prototype.slice.call(arrayLike) is to convert the arrayLike object into an Array object. Therefore, you can directly call the methods of the array afterwards, such as

Array.prototype.slice.call(arrayLike).forEach(function(element,index){  //可以随意操作每一个element了 })

(1) Array.prototype.slice represents the slice method in the prototype of the array. Note that this slice method returns an Array type object.

//slice的内部实现Array.prototype.slice = function(start,end){  
      var result = new Array();  
      start = start || 0;  
      end = end || this.length; //this指向调用的对象,当用了call后,能够改变this的指向,也就是指向传进来的对象,这是关键  
      for(var i = start; i < end; i++){  
           result.push(this[i]);  
      }  
      return result;  
 }

(2) Only methods can call call, so you cannot use [].call, you must use [].slice. The first parameter of call indicates that the environment in which slice is actually called becomes the arrayLike object. So it's like arrayLike also has array methods.

(3) Attached is the general function for converting js class array to array

var toArray = function(s){  
    try{  
        return Array.prototype.slice.call(s);  
    } catch(e){  
            var arr = [];  
            for(var i = 0,len = s.length; i < len; i++){  
                //arr.push(s[i]);  
                 arr[i] = s[i];     //据说这样比push快            }  
             return arr;  
    }

4. Convert the array into parameter list (class array)

Call apply When using the method, the first parameter is the object (this), and the second parameter is an array collection. Here is a clever use of apply, which can convert an array into a parameter list by default ([param1, param2, param3 ] into param1, param2, param3). If we use a program to convert each item of the array into a list of parameters, it may take a while. With the help of this feature of apply, there is The following highly efficient method is adopted.

Related recommendations:

Overview of js basic arrays Array length Array traversal

The above is the detailed content of Introduction to js arrays. For more information, please follow other related articles on the PHP Chinese website!

Statement:
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