Shulou(Shulou.com)06/02 Report--

This article introduces the knowledge of "what is deep copy and shallow copy in JavaScript array". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

Introduce the deep copy and shallow copy of the array, first of all, review the data types

Data type

1. Basic data type:: number string boolean null undefined

Storage mode: basic data types are stored in stack memory

Variables store values.

2. Reference data type: function array object (introduced in the second part)

Storage method: reference data types are stored in heap memory

The variable stores the address. [related recommendation: javascript Learning tutorial]

As for the storage mode, let's analyze and analyze:

First of all, I would like to introduce stack memory and heap memory for you to understand:

Stack memory: the memory space in which the engine works when the code is executed. In addition to the engine, it is also used to hold the address of the base value and the reference type value.

Heap memory: used to hold a set of unordered and unique reference type values, which can be obtained using the key name in the stack.

Let's take a look at this:

Var a = 2; var b = a; bachelorette console.log (a); / / 2

Analyze and analyze, assign the value of a to b, then change the value of b, the value of an is not affected. But if you refer to the data type, that's not the case. the value is assigned to the address.

Var arr = [1Jing 2Jue 3]; var arr2 = arr; arr2.push (4); console.log (arr); / / arr has changed

According to analysis, arr copies the address. What is the address can be compared to a room. Both arr and arr2 point to this room. If you change the structure of the room, both arr and arr2 will be affected. The figure below is as follows

After understanding the above, move on to the main points

Deep replication and shallow replication

Shallow copy of the array: only the address (shared address) is copied

Deep copying of arrays: copying valu

Traversal (save the values from the original array into a new array) var arr2 = []

Slice () intercepts all the values in the array and gets a new array. Is to open up a new space in heap memory.

Shallow copy of array:

Only the address (shared address) is copied

Var arr = [1Jing 2 Jing 3 Jing 4 Jing 5]; / / A shallow copy of the array-just copy the address var arr2 = arr; / / change one of the arrays, and both will change.

It is still very simple to understand shallow replication.

Deep copy of the array:

Copy the values in the array

1. Define a new empty array, iterate through the original array and assign values to the new array

Var arr = [1Jing 2, 3jue 4] var arr3 = []; arr.forEach (function (v) {arr3.push (v)}) console.log (arr3); arr3.push ('a'); console.log (arr, arr3); / / arr [1, 2, 3, 4, 5], arr3 [1, 2, 3, 4, 5, 5]

Change the value in the new array, the original array will not change

2. Slice () intercepts all the values in the array and gets a new array

Var arr3 = arr.slice (); console.log (arr3); arr3.push ('a'); console.log (arr3); / / [1meme 2, 3, 4, 4, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 4, 4, 5.

Change the value in the new array, the original array will not change

I would like to mention here:

The basic data type is passed as a value, and the reference data type passes the address (formal parameter and argument shared address).

The difficulties and difficulties, the deep replication of multi-dimensional arrays, the deep replication and shallow replication of one-dimensional arrays mentioned above

Two-dimensional array: a two-dimensional array is essentially an array with an array as its elements, that is, an "array of arrays", for example: arr= [[1mag2], [1d2], [1pd2]

Analyze the following code for the traversal of a two-dimensional array, and the variable iQuery j represents the first element in the I element (that is, the array) in the subscript.

Var arr = [[1,2,3], [4,5,6], [2,3,4]] for (var i in arr) {for (var j in arr [I]) {console.log (ARR [I] [j]);}}

Multidimensional arrays: arrays of three dimensions and above

Deep copy of multidimensional array

The deep copy of a multi-dimensional array is not as easy to judge as an one-dimensional array, because you can't tell whether the elements in the array are an array again. There is an array in the array, which is endless, , so you need to use the recursion mentioned above.

The method used: Array.isArray (arr [I]) determines the array and returns a Boolean value.

Idea: to determine whether the elements of a multi-dimensional array are an array, if so, continue to traverse the array, judging that, if not, you can use an one-dimensional array to achieve deep replication.

Var arr = [1,2,3,4, [5,6, [7,8]; var arr2 = arr.slice (); function deepArr (arr) {var newArr = []; for (var I = 0; I < arr.length) ) {/ / newArr.push (arr [I]) this arr [I] may still be an array if (Array.isArray (arr [I])) {/ / continue traversing the array, or get an array var list = deepArr (arr [I]) / / put the resulting array into newArr newArr.push (list)} else {newArr.push (arr [I]);}} return newArr} var res = deepArr (arr); res [4] .push ('a') Console.log (res); / / change console.log (arr); / / do not change the content of "what is deep copy and shallow copy in JavaScript array". Thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.