# Array

A variable can only save one data. When a series of data needs to be saved, an array is needed:

array   Is a container that can store a set or a series of related data.

Why use arrays?
Solve the problem of storage and use of a large amount of relevant data.

## Create an array and assign values

### Create array

Instantiate constructor

```var arr = new Array();
```

Implicit creation (internal call to new Array())

```var arr = [];
```

### Array assignment

Create an array and assign values

```var arr = new Array("a","b","c");   // ['a','b','c']

var arr = ["a","b","c"];
```

Assignment after array creation
The array stores ordered data, so it can be assigned according to the serial number of the data location, which is called subscript
Syntax:

```Array name[subscript]
```

Example

```var arr = [];
arr="a";
arr="b";
arr="c";
// The above operation is equivalent to var arr = ["a","b","c"];
```

Assignment characteristics

• The subscript of the array is from   0   Start the calculation. arr is the first value of the arr array
• Array can store data of any data type. An array can contain object elements, functions and arrays

### Accessing data through array subscripts

• Access data: directly obtain the value of the corresponding position of the array through the subscript
• Modify data: directly assign the data to the corresponding position of the corresponding array
```// Access the first value of the arr array
var one = arr;
// Modify the first value of arr number to 'x';
arr = "x"
```

### Length of array

The length of the array is the number of data stored in the array. There is a length attribute on the array to access the length of the array

```var arr = [1,2,3,4,5];
arr.length   // 5
```

Index of the last data in the array:   length-1
Access the last element of the array: arr[length-1]

### Traversal of array

Get in turn by loop   0 to length-1   To traverse the array and access all array data

for loop traversal

```var arr=[1,2,3];
for(var i=0;i<arr.length;i++){
console.log(arr[i]);
}

// console output
> 1
> 2
> 3
```

for...in loop

```var arr = [1,2,3];
for(var i in arr){
// i is the array subscript
// arr[i] is array data
}
```

But it's best not to use the for in loop to traverse the array. It's used to traverse the object. If you add a method to the array prototype, it will also traverse it

[ES6]for...of loop

The for...of loop can use arrays, Set and Map structures, some array like objects (such as arguments object, DOM NodeList object), and strings.

```let arr = [3, 5, 7];
arr.foo = 'hello';

for (let i in arr) {
// The i value is the key name
console.log(i); // "0", "1", "2", "foo"
}

for (let i of arr) {
// The i value is a key value and returns only properties with a numeric index
console.log(i);   //  "3", "5", "7"
}
```

## Two dimensional array

Every child element in an array is an array

```var arr = [[1,2,3],[4,5],]
```

Traversing a two-dimensional array

```for(var i =0; i<arr.length;i++){
for(var j =0; j<arr.length;j++){
console.log(arr[i][j])
}
}
```

## Array extension

### [ES6] deconstruction assignment of array

Extracting values from an array and assigning values to variables is called array deconstruction assignment.

```var [one, two, three] = [1,2,3];
console.log(one); // 1
console.log(two); // 2
console.log(three); // 3
```

To prevent an object with a value of undefined from being taken out of the array, you can also set the default value for this object.

```var a, b;
[a=5, b=7] = ;
console.log(a); // 1
console.log(b); // 7
```

Purpose 1: do not use the third variable to exchange the values of two variables.

```var a = 1, b = 3;

[a, b] = [b, a];
console.log(a); // 3
console.log(b); // 1
```

Purpose 2: function parameters receive array parameters
When a function argument is an array, the argument data can be parsed by deconstruction

```function f([x, y]) {
// x:1    y:2
return x + y;
}
```

Purpose 3: parse an array returned from a function
When the return value of a function is an array, deconstruction makes it more convenient to process when the return value is an array

```function f() {
return [1, 2];
}
var a, b;
[a, b] = f();
console.log(a); // 1
console.log(b); // 2
```

### [ES6] extended operator

The spread operator is three points. It's like a function rest   The inverse operation of parameters converts an array into a comma separated sequence of parameters.

```console.log(...[1, 2, 3])        // 1 2 3
console.log(1, ...[2, 3, 4], 5)  // 1 2 3 4 5
```

purpose

1. Function call parameter passing

```// The array parameter items is converted into numbers to push
function push(array, ...items) {
array.push(...items);
}

// Add the data in the array
return x + y;
}
let numbers = [4, 38];

// Find the most important value of the array
Math.max(...[numbers])    // 38
Math.min(...[numbers])    // 4
```

2. Array copy

```const a1 = [1, 2];
// Writing method I
const a2 = [...a1];
// Writing method 2
const [...a2] = a1;
```

3. Array merging

```let arr1 = [1,2,3], arr2 = [4,5,6];
let newarr = [...arr1, ...arr2]
```

However, this method is a shallow copy, which should be paid attention to when using.

Posted on Mon, 22 Nov 2021 08:31:15 -0500 by Seaholme