Home > Web Front-end > Front-end Q&A > What does Javascript array mean?

What does Javascript array mean?

青灯夜游
Release: 2023-01-07 11:44:50
Original
2573 people have browsed it

In Javascript, an array refers to a collection of ordered data. Each member of the array is called an element, and the name (key) of each element is called the array subscript (Index); the The length is flexible and readable and writable.

What does Javascript array mean?

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

JavaScript Array (Array) is a collection of ordered data. Each member in the array is called an element (Element), and the name (key) of each element is called the array subscript (Index). The length of the array is flexible and readable and writable.

Array Array object is a built-in object of JS. It can use a variable to store a series of values ​​of the same or different types. Each value stored in it is called an array element.

Creation of JS array

An Array object must be created before using the Array object to store data. There are many ways to create Array objects, two common ways are listed below.

  • Method 1: var array object name = [element 1, element 2,..., element n];

  • Method 2: var array Object name = new Array(element 1, element 2,..., element n);

Method one is a simpler array creation method, while method two is a simpler Formal array creation method. Both creation methods return newly created and initialized array objects. They both initialize the array with the value specified by the parameter. The number of elements (also called the array length) is the number of parameters. The effects of these two methods are generally the same, but because method one is more concise, it is the most commonly used in practical applications.

Array creation example:

var hobbies1 = ["旅游","运动","音乐"];
var hobbies2 = new Array("旅游","运动","音乐");
Copy after login

The above example code creates two array objects containing 3 elements. They are completely equivalent, but the first line of code is more concise.

It should be noted that the above two methods of creating arrays are generally completely equivalent, except for the case where there is only one numeric type parameter. Because at this time, when using the first creation method, it means that an array containing only one element is created, and the value of the element is equal to the numeric parameter; when using the second creation method, it means that an array with a length equal to the numeric type parameter is created. Array, for example:

var arr = [3]; //创建了一个只有一个元素的数组,元素值为3
var arr = new Array(3);//创建了一个有3个元素的数组,3个元素值均为undefined
Copy after login

Reference of JS array element

Each element stored in the array has a position index (also called a subscript), and the array subscript It starts from 0 and ends at array length-1, that is, the subscript of the first element is 0, and the subscript of the last element is array length-1.

When referencing array elements, you can use the array name and subscript. The reference format is as follows:

数组名[元素下标]
Copy after login

For example: the 3 elements of an array named arr containing 3 elements can be used respectively. Referenced via: arr[0], arr[1] and arr[2].

JS array access

There are two ways to access the array:

  • One is to directly access the array name. At this time Will return all element values ​​stored in the array. For example, alert(hobbies1), after execution of this statement, all element values ​​stored in the hobbies1 array created above will be output in the warning dialog box: travel, sports, music;

  • The second is Use array plus subscript access, in which case the array element value corresponding to the array subscript will be returned. For example: alert(hobbies1[1]), after this statement is executed, "Motion" will be output in the warning dialog box.

JS traverses arrays (for in and forEach loops)

JS There are many ways to traverse arrays (loop arrays), you can use the traditional For loop, you can also use the upgraded version of for in loop, or you can use the forEach() method of the Array type; if you want to traverse the key names of the object, you can also use the keys() method.

1. Use for and for in to traverse arrays

Both for and for/in statements can iterate arrays. The for statement needs to be implemented with the length attribute and array subscript, and the execution efficiency is not as high as the for/in statement. Additionally, for/in statements skip empty elements.

For very long arrays, it is recommended to use for/in statements for iteration.

Example 1

The following example uses the for statement to iterate through the array and filter out all numeric elements.

var a = [1, 2, ,,,,,,true,,,,,,, "a",,,,,,,,,,,,,,,4,,,,,56,,,,,,"b"];  //定义数组
var b = [], num = 0;
for (var i = 0; i < a.length; i ++) {  //遍历数组
    if (typeof a[i] == "number")  //如果为数字,则返回该元素的值
        b.push(a[i]);
    num ++;  //计数器
}
console.log(num);  //返回42,说明循环了42次
console.log(b);  //返回[1,2,4,56]
Copy after login

Example 2

The following code uses a for/in statement to iterate over the array a in Example 1. In the for/in loop structure, the variable i represents the subscript of the array, and a[i] is the element value from which the specified subscript can be read.

var b = [], num = 0;
for (var i in a) {  //遍历数组
    if(typeof a[i] == "number")  //如果为数字,则返回该元素的值
        b.push(a[i]);
    num ++;  //计数器
}
console.log(num);   //返回7,说明循环了7次
console.log(b);  //返回[1,2,4,56]
Copy after login

As you can see from the timer, the for/in statement iterates the array and only loops 7 times, while the for statement loops 42 times.

2. Use forEach to traverse the array

The Array type defines the forEach() prototype method for each array, which can be used to perform iteration operations for the array. The specific description is as follows:

array.forEach(callbackfn[, thisArg]);
Copy after login

The parameter description is as follows:

  • array: an array object.

  • callbackfn: required parameter, a function that can receive up to three parameters. forEach will call the callbackfn function once for each element in the array.

  • thisArg: Optional parameter, the object that can be referenced by this in the callbackfn function. If thisArg is omitted, the value of this is undefined.

对于数组中出现的每个元素,forEach 方法都会调用 callbackfn 函数一次,采用升序索引顺序,但不会为数组中空元素调用回调函数。

除了数组对象之外,forEach 方法还可以用于有 length 属性且具有已按数字编制索引的属性名的任何对象,如关联数组对象、Arguments 等。

回调函数语法如下:

funtion callbackfn(value, index, array);
Copy after login

最多可以使用三个参数来声明回调函数。回调函数的参数说明如下。

  • value:数组元素的值。

  • index:数组元素的数字索引。

  • array:包含该元素的数组对象。

forEach 方法不直接修改原始数组,但回调函数可能会修改它。

示例

下面示例使用 forEach 迭代数组 a,然后把每个元素的值和下标索引输出显示,代码如下:

function f(value,index,array) {
    console.log("a[" + index + "] = " + value);
}
var a = [&#39;a&#39;, &#39;b&#39;, &#39;c&#39;];
a.forEach(f);
Copy after login

演示结果如下:

What does Javascript array mean?

【推荐学习:javascript高级教程

The above is the detailed content of What does Javascript array mean?. 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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template