JavaScript simulates array merging concat

  • 2021-01-25 06:54:41
  • OfStack

Definitions and Usage

The concat() method is used to concatenate two or more arrays.

This method does not change the existing array, but only returns one copy of the joined array.

grammar


arrayObject.concat(arrayX,arrayX,......,arrayX)

参数 描述
arrayX 必需。该参数可以是具体的值,也可以是数组对象。可以是任意多个。
The return value

Returns a new array. This array is generated by adding all arrayX parameters to arrayObject. If the argument to perform the concat() operation is an array, then the elements in the array are added, not the array
.

We have two of these arrays


var arr1 = [1,2,3];
var arr2 = [4,5,6];

Task: To merge into this, please provide at least two ideas.


var arr1 = [1,2,3,4,5,6];

Idea 1: We can add the values in the second array to the end of the first array.

1: How to add contents to an array? [] || push || shift

2: How to add a value to the last index of an array? push | | [array length].

3: How to add contents to array 1 one by one? for

4: How many cycles of for? As many times as you want to add, which is the length of arr2

5: What to add? arr[?] arr[?]

Code implementation:


var arr1 = [1,2,3];
var arr2 = [4,5,6];
for(var i=0;i<arr2.length;i++){
arr1.push(arr2[i]);
}
console.log(arr1); //[1, 2, 3, 4, 5, 6]

The problem is that the concat method provided by native js does not modify the contents of the original array (arr1). Instead, it returns a new array.

If we want to return a value, we can define a function, and then define a variable to accept the value we added, but we will have a problem, that is, the contents of push cannot be added to arr1, otherwise we will still modify the contents of the original array. So I think 1 to make a copy of the original array, but also have a question, is the object is a reference type, in simple terms although we can make a copy of an array of 1 to 1 a variable, but if I use push or [] in the form of a change in values, or add, so our original array will be modified (if you don't know what is a reference type, you can visit my blog page 1 or 2 pages) this is not the result of what we want, but we must be 1 copy arr1. What is your solution at this point?

Solve the array reference problem:


for(var i=0;i<arr1.length;i++){
arr3[i] = arr1[i];
}

ES64en3 is an array that contains the values of array 1, one by one. ES65en3 looks like this


console.log(arr3) //[1, 2, 3]

Task: Add all values of arr2 to this new array arr3. The method is the same as the first step. If you forgot it, look back.

Code implementation:


var arr1 = [1,2,3];
var arr2 = [4,5,6];
var arr3 = [];
for(var i=0;i<arr1.length;i++){
arr3[i] = arr1[i];
}
for(var i=0;i<arr2.length;i++){
arr3.push(arr2[i]);
}
console.log(arr3);

Problem: This already merges arrays, but I have to rewrite one copy each time I merge, which is too much trouble, so we have to find a way to encapsulate it as a function that we can call the next time we want to use it.


var arr1 = [1,2,3];
var arr2 = [4,5,6,7];
function Concat(arr1,arr2){
var arr3 = [];
for(var i=0;i<arr1.length;i++){
arr3[i] = arr1[i];
}
for(var i=0;i<arr2.length;i++){
arr3.push(arr2[i]);
}
return arr3;
}
console.log(Concat(arr1,arr2));

Idea 2:

Convert both arr1 and arr2 to a string, then add the two strings together to get a combination, and then convert the string to an array.

Code implementation:


var arr1 = [1,2,3];
var arr2 = [4,5,6,7,8,9];
var arr3 = (arr1.join(",")+","+arr2.join(",")).split(",");

There's a little bit of a problem. The values in this array are strings.

["1", "2", "3", "4", "5", "6", "7", "8", "9"]

Solution: iterate through the array and convert each one into a number.


var arr1 = [1,2,3];
var arr2 = [4,5,6,7,8,9];
var arr3 = (arr1.join(",")+","+arr2.join(",")).split(",");
for(var i=0;i<arr3.length;i++){
arr3[i] = +arr3[i];
}
console.log(arr3);

Extracurricular Extension: Inheritance Edition


var arr1 = [1,2,3];
var arr2 = [4,5,6];
0

The above is this site to introduce JavaScript analog array merge concat related knowledge, I hope to help you!


Related articles: