Js arrays. ▍Strengths of the every() method. Array object methods

Arrays

An array is an ordered collection of values. The values in an array are called elements, and each element is characterized by a numeric position in the array, called an index. Arrays in JavaScript are untyped: elements of an array can be of any type, and different elements of the same array can have different types. Array elements can even be objects or other arrays, allowing you to create complex data structures such as arrays of objects and arrays of arrays.

JavaScript array indexes start at zero and use 32-bit integers - the first element of the array has index 0. JavaScript arrays are dynamic: they can grow and shrink in size as needed; there is no need to declare fixed array sizes when creating them, or to re-allocate memory when their sizes change.

Arrays in JavaScript are a specialized form of objects, and array indices mean little more than just property names, which coincidentally are integers.

Creating Arrays

The easiest way to create an array is to use a literal, which is a simple comma-separated list of array elements surrounded by square brackets. The values in an array literal do not have to be constants - they can be any expressions, including object literals:

Var empty = ; // Empty array var numbers = ; // Array with five numeric elements var misc = [ 1.1, true, "a", ]; // 3 elements different types+ trailing comma var base = 1024; var table = ; // Array with variables var arrObj = [, ]; // 2 arrays inside containing objects

Array literal syntax allows you to insert an optional trailing comma, i.e. the literal [,] matches an array with two elements, not three.

Another way to create an array is to call the Array() constructor. You can call the constructor in three different ways:

Call the constructor without arguments:

Var arr = new Array();

In this case, an empty array will be created, equivalent to the literal.

Call the constructor with a single numeric argument specifying the length of the array:

Var arr = new Array(10);

In this case, an empty array of the specified length will be created. This form of calling the Array() constructor can be used to pre-allocate memory for an array if the number of its elements is known in advance. Note that this does not store any values in the array.

Explicitly specify the values of the first two or more array elements or one non-numeric element in the constructor call:

Var arr = new Array(5, 4, 3, 2, 1, "test");

In this case, the arguments to the constructor become the values of the elements of the new array. Using array literals is almost always easier than using the Array() constructor.

Reading and Writing Array Elements

Array elements are accessed using the operator. To the left of the brackets there must be an array reference. Inside the parentheses there must be an arbitrary expression that returns a non-negative integer value. This syntax is useful for both reading and writing the value of an array element. Therefore, all of the following JavaScript instructions are valid:

// Create an array with one element var arr = ["world"]; // Read element 0 var value = arr; // Write the value to element 1 arr = 3.14; // Write the value to element 2 i = 2; arr[i] = 3; // Write the value to element 3 arr = "hello"; // Read elements 0 and 2, write the value to element 3 arr] = arr;

Let me remind you that arrays are a specialized type of object. Square brackets used to access array elements act exactly the same as square brackets used to access object properties. The JavaScript interpreter converts the numeric indexes in parentheses into strings—index 1 becomes the string "1"—and then uses the strings as property names.

There's nothing special about converting numeric indexes to strings: you can do the same with regular objects:

Var obj = (); // Create a simple object obj = "one"; // Index it with integers

The thing about arrays is that when you use property names that are non-negative integers, arrays automatically determine the value of the length property. For example, above we created an array arr with a single element. It then assigned values to its elements at indexes 1, 2, and 3. As a result of these operations, the value of the array's length property changed to 4.

You should clearly distinguish indexes in an array from object property names. All indices are property names, but only properties with names represented by integers are indices. All arrays are objects, and you can add properties to them with any names. However, if you touch properties that are array indices, arrays respond by updating the value of the length property as necessary.

Please note that negative and non-integer numbers can be used as array indices. In this case, numbers are converted to strings, which are used as property names.

Adding and Removing Array Elements

We've already seen that the easiest way to add elements to an array is to assign values to new indices. You can also use the push() method to add one or more elements to the end of an array:

Var arr = ; // Create an empty array arr.push("zero"); // Add a value to the end arr.push("one",2); // Add two more values

You can also add an element to the end of the array by assigning a value to the arr element. The unshift() method can be used to insert an element at the beginning of an array, which shifts existing elements in the array to higher index positions.

You can delete array elements using the delete operator, just like regular object properties:

Var arr = ; delete arr; 2 in arr; // false, index 2 in the array is not defined arr.length; // 3: the delete operator does not change the length property of the array

Removing an element is similar (but slightly different) to assigning the value undefined to that element. Note that applying the delete operator to an array element does not change the value of the length property or shift down elements with higher indexes to fill the void left by deleting the element.

It is also possible to remove elements at the end of an array by simply assigning a new value to the length property. Arrays have a pop() method (the opposite of push()), which reduces the length of the array by 1 and returns the value of the removed element. There is also a shift() method (the opposite of unshift()), which removes the element at the beginning of the array. Unlike the delete operator, the shift() method shifts all elements down to a position below their current index.

Finally, there is a multi-purpose splice() method that allows you to insert, remove, and replace elements of arrays. It changes the value of the length property and shifts array elements to lower or higher indexes as needed. We will look at all these methods a little later.

Multidimensional arrays

JavaScript doesn't support "real" multidimensional arrays, but allows you to simulate them well using arrays of arrays. To access a data element in an array of arrays, simply use the operator twice.

For example, suppose the variable matrix is an array of arrays of numbers. Each element of matrix[x] is an array of numbers. To access a specific number in an array, you can use the expression matrix[x][y]. Below is specific example, Where two-dimensional array used as a multiplication table:

// Create a multidimensional array var table = new Array(10); // There are 10 rows in the table for(var i = 0; i

Methods of the Array class

The ECMAScript 3 standard defines Array.prototype as a set convenient functions for working with arrays, which are available as methods of any array. These methods will be presented in the following subsections.

join() method

The Array.join() method converts all array elements into strings, joins them, and returns the resulting string. As an optional argument, you can pass a string to the method that will be used to separate the elements in the result string. If a delimiter string is not specified, a comma is used. For example, the following fragment results in the string "1,2,3":

Var arr = ; arr.join(); // "1,2,3" arr.join("-"); // "1-2-3"

reverse() method

The Array.reverse() method reverses the order of elements in an array and returns a reordered array. The permutation is performed directly in the original array, i.e. This method does not create a new array with the reordered elements, but rather reorders them in an already existing array. For example, the following snippet, using the reverse() and join() methods, results in the string "3,2,1":

Var arr = ; arr.reverse().join(); // "3,2,1"

sort() method

The Array.sort() method sorts the elements in the source array and returns the sorted array. If the sort() method is called without arguments, the sorting is done in alphabetical order (elements are temporarily converted to strings for comparison if necessary). Undefined elements are moved to the end of the array.

To sort in order other than alphabetical, you can pass a comparison function as an argument to the sort() method. This function sets which of its two arguments should come first in the sorted list. If the first argument must come before the second, the comparison function must return a negative number. If the first argument is to follow the second in a sorted array, then the function must return a number greater than zero. And if two values are equivalent (that is, their order is not important), the comparison function should return 0:

Var arr = ; arr.sort(); // alphabet order: 1111, 222, 33, 4 arr.sort(function(a,b) ( // Numerical order: 4, 33, 222, 1111 return a-b; // Returns the value 0 // depending on the sort order of a and b )); // Sort by reverse direction, from largest to smallest arr.sort(function(a,b) (return b-a));

Notice how convenient it is to use an unnamed function in this snippet. The comparison function is only used here, so there is no need to give it a name.

concat() method

The Array.concat() method creates and returns a new array containing the elements of the original array on which concat() was called and the values of any arguments passed to concat(). If any of these arguments is itself an array, its elements are added to the returned array. It should be noted, however, that recursively turning an array of arrays into one-dimensional array not happening. The concat() method does not change the original array. Below are some examples:

Var arr = ; arr.concat(4, 5); // Return arr.concat(); // Return arr.concat(,) // Return arr.concat(4, ]) // Return ]

slice() method

The Array.slice() method returns a slice, or subarray, of the specified array. The two method arguments specify the beginning and end of the returned fragment. The returned array contains the element whose number is specified in the first argument, plus all subsequent elements, up to (but not including) the element whose number is specified in the second argument.

If only one argument is given, the returned array contains all elements from the starting position to the end of the array. If any of the arguments is negative, it determines the element number relative to the end of the array. So, argument -1 corresponds to the last element of the array, and argument -3 corresponds to the third element of the array from the end. Here are some examples:

Var arr = ; arr.slice(0,3); // Return arr.slice(3); // Return arr.slice(1,-1); // Return arr.slice(-3,-2); // Return

splice() method

The Array.splice() method is universal method, which inserts or removes elements from an array. Unlike the slice() and concat() methods, the splice() method modifies the original array on which it was called. Note that the splice() and slice() methods have very similar names, but perform completely different operations.

The splice() method can remove elements from an array, insert new elements, or do both at the same time. Array elements are shifted as necessary to create a continuous sequence after insertion or deletion.

The first argument of the splice() method specifies the position in the array from which insertion and/or deletion will be performed. The second argument specifies the number of elements that should be removed (cut) from the array. If the second argument is omitted, all array elements from the specified to the end of the array are removed. The splice() method returns an array of the removed elements or (if no elements were removed) an empty array.

The first two arguments to the splice() method specify the array elements to be removed. These arguments can be followed by any number of additional arguments specifying the elements to be inserted into the array, starting at the position specified in the first argument.

Var arr = ; arr.splice(4); // Return , arr = arr.splice(1,2); // Return , arr = arr.splice(1,1); // Return ; arr = arr = ; arr.splice(2,0,"a","b"); // Return ; arr =

push() and pop() methods

The push() and pop() methods allow you to work with arrays as if they were stacks. The push() method adds one or more new elements to the end of the array and returns its new length. pop method() executes reverse operation- removes the last element of the array, reduces the length of the array and returns the value it removed. Note that both of these methods modify the original array rather than creating a modified copy of it.

unshift() and shift() methods

The unshift() and shift() methods behave almost the same as push() and pop(), except that they insert and remove elements at the beginning of the array rather than at the end. The unshift() method shifts existing elements to larger indices to free up space, adds the element or elements to the beginning of the array, and returns the new length of the array. The shift() method removes and returns the first element of the array, shifting all subsequent elements down one position to take up the space vacated at the beginning of the array.

In this lesson we will get acquainted with arrays, learn how to create them, perform operations on their elements, and also look at the basic methods and properties available when working with them.

Array concept

An array is an ordered collection of data that has a name and is an instance of an Array object. It consists of elements that are accessed using their index number. The numbering of elements in an array does not start from 1, but from 0.

The following figure shows a numeric array consisting of 7 elements. The elements of this array contain the following data: 1st element (0 index) - number 123, 2nd element (1st index) - number 214, 3rd element (2nd index) - number 315, etc.

//element into which we will output the array //creating a numeric array var numberArray = new Array(123,214,315,312,124,206,218); //output the array to the element having id="myP" document.getElementById("myP").innerHTML = "1 Array element: " + numberArray + "
" + "2 Array element: " + numberArray + "
" + "3 Array element: " + numberArray + "
" + "4 Array element: " + numberArray + "
" + "5 Array element: " + numberArray + "
" + "6 Array element: " + numberArray + "
" + "7 Array element: " + numberArray;

Creating (declaring) an array

Creating an array in JavaScript is done using the new operator and the Array constructor function. IN parentheses The Array constructor function can be specified with one of the following values:

Number. In this case this function will create an array consisting of the specified number of elements. All of these elements will have the value undefined .
Multiple values separated by commas. IN in this case The Array constructor function will create an array consisting of the specified number of elements and assign them the appropriate values.
Nothing. In this case, this function will create an empty array.

Unlike many other programming languages, arrays in JavaScript automatically change their size, i.e. they are inherently dynamic. Such arrays do not need to be given any dimensions. One more distinctive feature JavaScript arrays is that different elements of the same array can contain Various types data.

Working with Array Elements

In order to contact specific element array, you must specify the name of this array and its index in square brackets. This operation also called an indexing operation.

For example, let's create an empty array and add 4 text elements to it:

//creating an empty array smartphoneColors var smartphoneColors = new Array(); //assign 1 element of the array (index 0) the value "Black" smartphoneColors = "Black"; //assign the 2nd array element (index 1) to the value "White" smartphoneColors = "White"; //assign the 3rd array element (index 2) to the value "Grey" smartphoneColors = "Grey"; //assign the 4th element of the array (index 3) to the value "Blue" smartphoneColors = "Blue";

For example, let’s display the values of 2 and 4 elements of the smartphoneColors array in the browser console (F12):

Console.log("2 element = " + smartphoneColors); console.log("4 element = " + smartphoneColors);

Array length (number of elements in the array)

Determining the number of elements in an array is done using the length property.

//create an array by listing the values of the elements in the Array function var volumeHDDs = new Array("500Gb","1Tb","2Tb"); //assign the lengthArray variable to the length of the volumeHDDs array var lengthArray = volumeHDDs.length;

How to get the first element of an array

The value of the first element of an array is obtained by specifying the number 0 in square brackets of this array:

//creating an array consisting of 3 elements var volumeHDDs = new Array("500Gb","1Tb","2Tb"); //getting the value of the first element of the array var firstValue = volumeHDDs;

How to get the last element of an array

The value of the last element of an array is obtained by specifying the expression array_name.length-1 in square brackets of this array:

//creating an array consisting of 3 elements var volumeHDDs = new Array("500Gb","1Tb","2Tb"); //getting the value of the last element of the array var lastValue = volumeHDDs;

Iterating over an array

Iterating through array elements is done using for loop.

For example, let's iterate through all the elements of the array and display their values in the browser console (F12):

//creating an array nameStudents, consisting of 4 elements var nameStudents = new Array("Petya","Vasya","Kolya","Maxim"); //iterate array elements from 0 to array length-1 for (var i=0; i