directory

  • The concept of arrays
  • Create an array
  • Gets the elements of an array
  • Through the array
  • New element in array
  • An array of cases

First, the concept of arrays

Q: variable, can store only one value, want to store more values

A: You can use arrays. Arrays hold groups of related data together and provide easy access

Q: What is an array?

A: An array is a collection of data, each of which is called an element. An array can hold any type of element. Arrays are an elegant way to store a set of data under the name of a single variable.

// Ordinary variables can only store one value at a time
var num = 10;
// Arrays can store multiple values at once
var arr = [1.2.3.4.5];
Copy the code

Create an array

2.1 How to create an array

There are two ways to create arrays in JS:

  • Create an array using new
  • Create an array using an array literal

Create an array with new

varArray name =new Array(a);var arr = new Array(a);// Create a new empty array
Copy the code
  • Notice Array(), capital A

Create arrays using array literals

// 1. Create an empty array using array literals
varArray name = [];// 2. Use array literals to create arrays with initial values
varArray name = ['white', 'black'];Copy the code
  • Array literals are square brackets []
  • Declaring an array and assigning a value to it is called array initialization
  • This is the literal approach that we’re going to use the most in the future

2.4. The type of an array element

Arrays can hold any type of data, such as strings, numbers, booleans, etc.

var arrStus = [ 'white' ,12.true ]; 
Copy the code

2.5,

// 1. Arrays: An elegant way of storing a collection of data in a single variable
// 2. Create an array with new
var arr = new Array(a);// Create an empty array
// 3. Create an array with array literals []
var arr = [ ];   // Create an empty array
var arr = [1.2.'pink pigs'.true ];
// 4. The data in our array must be separated by commas
// 5. The data in the array such as 1,2 are called array elements
Copy the code

Get an array element

3.1 Index of array

Index (subscript) : The ordinal number used to access an array element (array subscripts start at 0).

var    arr    = ['white'.'black'.'little red'.'little blue']; Index number:0         1        2         3
Copy the code

An array can be accessed, set, or modified by an index. We can retrieve the elements of the array by the name of the index

// Define an array
var arrStus = [1.2.3];
// Get the second element in the array
alert(arrStus[1]);
Copy the code

Four, go through the number group

Q: How do we get each item out of the array?

A: You can retrieve items by array name [index number]

var arr = ['red'.'green'.'blue' ];
console.log( arr[ 0]);// red 
console.log( arr[ 1]);// green
console.log( arr[ 2]);// blue
Copy the code

Q: How do I get all the elements out of an array?

Rule:

And you can see from this code, as we pull each element out of the array, the code is repeating, except that the index is increasing and the answer is loop

// Iterate through an array: to access all the elements of an array once
var arr = ['red'.'green'.'blue' ];
for (var i = 0; i < 3; i++) {
          console.log(arr[ i ] );
}
Since our array index starts at 0, I must start at 0. I < 3
// 2. Arr [I] I counter is used as an index
Copy the code

4.1. Array length

The number of elements in the array (array length) can be accessed using the array name.length.

// Array length The array name. Length
var arr = [ 'guan yu'.'zhang fei'.'d'.'zhaoyun'.'huang'.'liu bei'.'feather' ];
for ( var i = 0 ; i < 7; i++) {
       console.log( arr[ i ]);
}
// The second method
console.log(arr.length);
for (var i = 0; i < arr.length; i++){
        console.log(arr[ i ]);
}
// 1. The length of the array is the number of elements
// 2. arr.length dynamically monitors the number of array elements
Copy the code

4.2, case

4.2.1. Case 1: Array summation and Average

Find the sum and average of all elements in the array [2, 6,1,7, 4]

// 1. Declare a sum variable sum
// 2. Iterate through the array and add each element to sum
// 3. Divide sum by the length of the array to get the average value of the array
//
var arr = [ 2 , 6 ,1 ,7.4 ];
var sum = 0;
var average = 0;
for (var i = 0; i <arr.length; i++) {
       sum = sum + arr [i];  // We add arr[I], not counter I
}
average = sum / arr.length;
console.log(sum, average);  // If you want to output multiple variables, separate them with commas
Copy the code
4.2.2. Case 2: Array Max

Find the maximum value in the array [2, 6, 1, 77, 52, 25, 7]

// Declare a variable Max that holds the largest element
// The default maximum value can be the first element in the array
// Walk through the array and compare each element to Max
If the array element is larger than Max, store the array element in Max, otherwise proceed to the next round of comparison
// Finally print this Max

var arr = [ 2.6.1.77.52.25.7 ];
var max = arr[ 0 ];
for ( var i = 0; i < arr.length; i++) {
       if( arr[ i ] > max ) { max = arr[ i ]; }}console.log('The maximum value in this array is :' + max);
Copy the code
4.2.3 Case 3: Array converted to delimited string

Requirements: array [‘ red ‘, ‘green’ and ‘blue’, ‘pink’] is converted to a string, and separated with a | or other symbol output: ‘red | green | blue tear | |’

// 1. A new variable is required to store the converted string STR
// 2. Iterate through the array, extract the data from it, and add it to the string
// 3. Add an extra delimiter

var arr = [ 'red'.'green'.'blue'.'pink'];var str = ' ';
var sep = '|';
for (var i = 0; i < arr.length; i++) {
      str += a[i] +sep;
}
console.log(str)
Copy the code

Add element to array

You can add array elements by changing the length length and index number

5.1. Add array elements by changing length

  • You can modify the length to expand the array
  • The length attribute is read-write
// 1. Add an array element to change the length
var arr = [ 'red'.'green'.'blue'.'pink'];console.log(arr.length);
arr.length = 5; // Change the length of our array to 5. There should be 5 elements in it
console.log(arr);
console.log(arr[3]); // undefined
console.log(arr[4]); // undefined

// 2. Add an array element modify the index number to append an array element
var arr1 = [ 'red'.'green'.'blue' ]；
arr1[3] = 'pink';
console.log(arr1);
arr1[0] = 'yellow'; // Replace the original array element
console.log(arr1);
arr1 = 'hello';
console.log(arr1); // Do not assign to the name of the array or there will be no elements in the array
Copy the code

5.2. Add an array element by modifying an array index

  • You can append array elements by changing the array index
  • You cannot assign to the name of the array directly, otherwise the previous data will be overwritten

5.3, case

5.3.1 Case: Array new element

Create an array containing 10 integers (1 to 10)

// Use a loop to append arrays
// 1, declare an empty array arr
// the loop counter I can be stored as an array element
// 3, since the index of the array starts at 0, it is more appropriate to start the counter at 0, and store the array element +1

var arr = [ ];
for (var i = 0; i < 10; i++) {
       // arr = i;
       arr[ i ] = i + 1;
}
console.log(arr);
Copy the code
5.3.2 Case: Filter array

Select elements greater than or equal to 10 from the array [2, 0, 6, 1, 77, 0, 52, 0, 25, 7] and place them in the new array

// declare a new array to store new data newArr
// 2, find the element greater than or equal to 10
// 3, append to the new array newArr

var arr = [ 2.0.6.1.77.0.52.0.25.7 ];
var newArr = [ ];
var j = 0;
for (var i = 0; i <arr.length; i++) {
      if (arr[ i ] >=10) {
         // The new array index should be incremented from 0newArr[ j ] = arr[ i ]; j++; }}console.log(newArr);

2 / / method
var arr = [ 2.0.6.1.77.0.52.0.25.7 ];
var newArr = [ ];
// Newarr. length is 0
for (var i = 0; i <arr.length; i++) {
      if (arr[ i ] >=10) {
         // The new array index should be incremented from 0newArr[ newArr.length ] = arr[ i ]; }}console.log(newArr);
Copy the code

6. Array cases

6.1. Case 1: Delete the specified array element

Requirement: Remove the 0 from array [2, 0, 6, 1, 77, 0, 52, 0, 25, 7] to form a new array that does not contain 0

// a new array is needed to store the filtered data
// select * from array where index = 0 and index = 0;
// 3, the number in the new array is incremented by length

var arr = [ 2.0.6.1.77.0.52.0.25.7 ];
var newArr = [ ];
for ( var i = 0; i < arr.length; i++) {
      if(arr[ i ] ! =0) { newArr[newArr.length] = arr[ i ]; }}console.log(newArr);
Copy the code

6.2. Case 2: Flipping an Array

[‘ red’, ‘green’, ‘blue’, ‘pink’,’ Purple ‘] = [‘purple’, ‘pink’,’blue’, ‘green’, ‘red’]

// declare a new array newArr
// select arr. Length - 1 from newarr.length where arr.
// 3. We take a descending approach

var arr =  [ 'red'.'green'.'blue'.'pink'.'purple' ];
var newArr = [ ];
for (var i = arr.length -1; i >= 0; i--);
       newArr[newArr.length] = arr[ i ]
}
console.log(newArr);
Copy the code

Case 3: Array sort (bubble sort)

Bubble sort: An algorithm that displays a series of data in a certain order (from smallest to largest or from largest to smallest)

Order the elements of array [5, 4, 3, 2, 1] in ascending order, output 1, 2, 3, 4, 5

var arr = [ 5.4.3.2.1 ];
for (var i = 0; i <= arr.length - 1; i++) { // The number of trips out of the loop
      for ( var j = 0; j <= arr.length - i - 1; j++) { // The number of times the inner loop tube is changed each time
            // Internally swap the values of two variables to compare the previous and the following array elements
            if(ARR [J] > ARR [J]1] ）{
                 var temp = arr[ j ];
                 arr[ j ] = arr[ j + 1];
                 arr[ j + 1] = temp; }}}console.log(arr);
Copy the code