Array in the JavaScript This is [] or class Array

Programming, development, testing

→

JavaScript - programming language for HTML

→

Array in the JavaScript This is [] or class Array | standard ES5

Looked at 6229 times

Array in the JavaScript | standard ES5

last updated: 1 Augusta 2020

To work with an array in the JavaScript Used [] or class Array

Create an empty array

Method 1

var Name = [];

Method 2

var Name = Array();

Method 3

var Name = new Array();

Html Example

<html>
<body>

<script>

// create an empty array
var arr = [];

</script>

</body>
</html>

Create a populated array

Html Example

<html>
<body>

<script>
     // array
     var arr = ["Hello", "World"];

     // Values
     // arr[0] = "Hello";
     // arr[1] = "World";
</script>

</body>
</html>

Array length

Property length is the length of the array (number of elements).

Html Example

<html>
<body>

<script>
     // array
     var arr = ["Hello", "World"];

     // find out the length of the array
     var len = arr.length;
     // len = 2
</script>

</body>
</html>

Set value by index

arr[zero index number] = meaning;

If we set the value in the array by index, and the indexes are not all populated, then this means that the array is not fully populated (in another way we can say that there are holes in the array)

Html Example

<html>
<body>

<script>
     // empty array
     var arr = [];

     // let's add elements
     arr[5] = "Hello";
     arr[8] = "World";

     // find out the length of the array
     var len = arr.length;
     // len = 9

     // Values
     // arr[0] = undefined; hole in the array
     // arr[1] = undefined; hole in the array
     // arr[3] = undefined; hole in the array
     // arr[4] = undefined; hole in the array
     // arr[5] = "Hello";
     // arr[6] = undefined; hole in the array
     // arr[7] = undefined; hole in the array
     // arr[8] = "World";
</script>

</body>
</html>

Add a new element to the end of an array

Add a new item to the end (so that there are no holes)

Method 1

arr[arr.length] = value;

Method 2

arr.push(value);

Html Example 1

<html>
<body>

<script>
     // array
     var arr = [];

     // let's add elements
     arr[arr.length] = "Hello";
     arr[arr.length] = "World";

     // find out the length of the array
     var len = arr.length;
     // len = 2

     // Values
     // arr[0] = "Hello";
     // arr[1] = "World";
</script>

</body>
</html>

Html Example 2

<html>
<body>

<script>
     // array
     var arr = [];

     // let's add elements
     arr.push("Hello");
     arr.push("World");

     // find out the length of the array
     var len = arr.length;
     // len = 2

     // Values
     // arr[0] = "Hello";
     // arr[1] = "World";
</script>

</body>
</html>

Select (enumerate) the existing elements in the array. Skip the empty elements.

Html Example

<html>
<body>

<script>
     // array
     var arr = [];

     // let's add elements
     arr[5] = "Hello";
     arr[8] = "World";

     // find out the length of the array
     var len = arr.length;
     // len = 9

     // Select (enumerate) only existing elements
     for (var index in arr)
     {
          // get the value by index
          value = arr[index];
     }

     // cycle of 2 iterations (passages):

     // iteration 1
     // index = 5
     // value = "Hello"

     // iteration 2
     // index = 8
     // value = "World"
</script>

</body>
</html>

Select (enumerate) all the elements in the array. Select (enumerate) and empty elements.

Html Example

<html>
<body>

<script>
     // array
     var arr = [];

     // let's add elements
     arr.push("Hello");
     arr.push("World");

     // find out the length of the array
     var len = arr.length;
     // len = 2

     // Select (enumerate) the elements of the array
     for (var i=0; i<arr.length; i++)
     {
          // get the value by index
          value = arr[i];
     }

     // cycle of 2 iterations (passages):

     // iteration 1
     // index = 0
     // value = "Hello"

     // iteration 2
     // index = 1
     // value = "World"
</script>

</body>
</html>

Function pop (take the value from the end of the array and delete)

Html Example

<html>
<body>

<script>
     // array
     var arr = [];

     // let's add elements
     arr.push("Hello");
     arr.push("World");
     arr.push("House");
     arr.push("Computer");
     arr.push("Book");

     // Values
     // arr[0] = "Hello";
     // arr[1] = "World";
     // arr[2] = "House";
     // arr[3] = "Computer";
     // arr[4] = "Book";

     // find out the length of the array
     var len = arr.length;
     // len = 5

     // take the value from the end of the array and delete
     var value = arr.pop();

     // find out the length of the array
     var len = arr.length;
     // len = 4

     // Values
     // arr[0] = "Hello";
     // arr[1] = "World";
     // arr[2] = "House";
     // arr[3] = "Computer";
</script>

</body>
</html>

Function shift (take the value from the beginning of the array and delete)

Html Example

<html>
<body>

<script>
     // array
     var arr = [];

     // let's add elements
     arr.push("Hello");
     arr.push("World");
     arr.push("House");
     arr.push("Computer");
     arr.push("Book");

     // Values
     // arr[0] = "Hello";
     // arr[1] = "World";
     // arr[2] = "House";
     // arr[3] = "Computer";
     // arr[4] = "Book";

     // find out the length of the array
     var len = arr.length;
     // len = 5

     // take the value from the beginning of the array and delete
     var value = arr.shift();

     // find out the length of the array
     var len = arr.length;
     // len = 4

     // Values
     // arr[0] = "World";
     // arr[1] = "House";
     // arr[2] = "Computer";
     // arr[3] = "Book";
</script>

</body>
</html>

Function slice(index1, index2) (returns a sub-array from the index index1 before index2)

Html Example

<html>
<body>

<script>
     // array
     var arr = [];

     // let's add elements
     arr.push("Hello");
     arr.push("World");
     arr.push("House");
     arr.push("Computer");
     arr.push("Book");

     // Values
     // arr[0] = "Hello";
     // arr[1] = "World";
     // arr[2] = "House";
     // arr[3] = "Computer";
     // arr[4] = "Book";

     // take the value from the end of the array and delete
     var arr1 = arr.slice(1,3); // take indices 1 and 2. Index 3 will not be taken

     // Values arr
     // arr[0] = "Hello";
     // arr[1] = "World";
     // arr[2] = "House";
     // arr[3] = "Computer";
     // arr[4] = "Book";

     // Values
     // arr1[0] = "World";
     // arr1[1] = "House";
</script>

</body>
</html>

Function splice(index, count, addValue1, addValue2, ...)

Function splice(index, count, addValue1, addValue2, ...)
removes items from the index index number of items to delete count
adds new elements addValue1, addValue2 ... starting with the index index

Html Example

<html>
<body>

<script>
     // array
     var arr = [];

     // let's add elements
     arr.push("Hello");
     arr.push("World");
     arr.push("House");
     arr.push("Computer");
     arr.push("Book");

     // Values arr
     // arr[0] = "Hello";
     // arr[1] = "World";
     // arr[2] = "House";
     // arr[3] = "Computer";
     // arr[4] = "Book";

     // take the value and add the values to the array
     var arr1 = arr.splice(2, 1, "Good", "Morning", "Day");
     // remove 1 item from index 2 and add "Good", "Morning", "Day"

     // Values arr
     // arr[0] = "Hello"
     // arr[1] = "World"
     // arr[2] = "Good"
     // arr[3] = "Morning"
     // arr[4] = "Day"
     // arr[5] = "Computer"
     // arr[6] = "Book"

     // Values arr1
     // arr1[0] = "House";
</script>

</body>
</html>

All Features Array

msdn.microsoft.com

← Previous topic
Date & Time (year, month, date, hours, minutes, seconds) in the JavaScript. Class Date | standard ES5

Next topic →
Что значит 3 точки ...items | Пример 1: Math.max(...prices) | Пример 2: books.push(...items) | JavaScript, стандарт ES5