Javascript array Array basic introduction

  • 2021-01-25 07:09:07
  • OfStack

ES1en, an amazing language, has arrays that are equally unique. We need to discard the dross, take the essence, and summarize the commonly used best practices. If there is any error, please point it out.

An javascript array is an object of type 1 array and has the properties of an object. Arrays should be used when attribute names are small, contiguous integers; otherwise, objects should be used.

The array source

All arrays are constructed by Array. Let's test the constructor property under 1.


var arr = [];
arr.constructor === Array; // true
arr.constructor === Array.prototype.constructor; // true

Create an array


// Array literals 
var arr1 = [1, 2, 3]; // [1,2,3]

// Constructor mode 
var arr2 = new Array();    // []  An empty array 
var arr3 = new Array('9');   // ["9"] 1 String elements 
var arr4 = new Array(9);    // []  The length of the array length for 9
var arr5 = new Array([9]);   // [[9]]  The equivalent of 2 Dimensional array 
var arr6 = new Array(1, 2, 3); // [1, 2, 3]
var arr7 = new Array(1, function f(){}, {o : 6}, null,undefined,true);
//  Arrays can store any mixed data type 

Because of the arr4 approach, when only one numeric argument is passed to the Array constructor, the constructor returns an empty array with the length property set. It is recommended to use array literals, which are short and concise.

Checks if the object is an array


var arr1 = [1, 2, 3];
typeof(arr1); // object

typeof is known to fail to detect types correctly.


arr1 instanceof Array; //true

The ES32en approach is not a problem in a web page, once nested other web pages, there are two global scopes, call each other detection will be a problem.


Array.isArray(arr1); // true

ES36en. ES37en () is a new method in ES38en 5 and has no defects. The problem with only 1 is that ie8 does not support it, and ie9 does not support it in strict mode.


Object.prototype.toString.apply(arr1).slice(8, -1); // Array

The last one is the best way to detect type.

The length of the array

The array's length is also a property of the array, and enlarging length will not cause an out-of-bounds error.
The length value is equal to the largest integer attribute name of the array plus 1.


var arr1 = [];
arr1[9] = 1; //  Length of 10 , contains only 1 An array of six elements 

Setting a small value will remove properties with property names greater than or equal to length.
If you set the length value to 0, you empty the array.


var arr2 = [1, 2, 3, 4, 5];
arr2.length = 3; // [1, 2, 3]
arr2.length = 0; // []

Array traversal

Do not use for and in to loop through arrays because for and in will iterate through all the properties on the prototype chain, but we don't need that many. The ES69en loop is recommended.


var arr1 = [1, 2, 3];
arr1.test = 9;

//for in  way 
for(var prop in arr1){
  cosole.log(prop, arr1[prop]);
}
//  The output is as follows 
// 0 1
// 1 2
// 2 3
// test 9

//for A circular manner 
for(var i = 0, len = arr1.length; i < len; i++){
  console.log(arr1[i]);
}
// The output is as follows 
// 1
// 2
// 3

We see that the for method has an extra test value, which can be excluded using the hasOwnProperty function, but it will be much slower than the for loop.
Caching the array length is a necessary step, and there is a performance overhead per access (the latest browsers are optimized for this).

summary

A brief introduction to Array related basic knowledge, here is also can have a more comprehensive understanding of Array. The next article describes the ES86en approach.

Although Javascript has a lot of difficult things to understand, with a long time of learning, I have come to love it (because there is no girls to love now).


Related articles: