[Javascript] - 배열(얕은복사, 깊은복사)

arr1 = [1, 2, 3]
arr2 = []

얕은 복사
arr1 = arr2

깊은 복사
1. arr2 = JSON.parse(JSON.stringify(arr1));
2. arr2 = Array.from(arr1)

얕은 복사

- 복사한 배열의 값이 변경 되면 원본의 배열도 같이 변경됌

// 얕은 복사

	console.log(state.showWord) // 1번
	state.randomWord = state.showWord // 얕은 복사
    
    for(var i=0; i<state.randomWord.length; i++){

      state.randomNumber = parseInt(Math.random()*10%2)
      if(state.randomNumber === 0) {
        state.randomWord[i][0] = ' '
      } else {
        state.randomWord[i][1] = ' '
      }
    }
    console.log(state.randomWord) // 2번
    console.log(state.showWord) // 3번

(1)원본 배열

(2)복사한 배열 값 변경

(3) 복사된 배열의 값이 바뀌자 원본 배열도 변함

 

깊은 복사

1) JSON.parse(JSON.stringify(배열))

- 복사한 배열의 값이 변경 되어도 원본의 배열은 변경되지 않음

 // 깊은 복사
 
	console.log(state.showWord) // 1번
    state.randomWord = JSON.parse(JSON.stringify(state.showWord)) // 깊은 복사
    for(var i=0; i<state.randomWord.length; i++){

      state.randomNumber = parseInt(Math.random()*10%2)
      if(state.randomNumber === 0) {
        state.randomWord[i][0] = ' '
      } else {
        state.randomWord[i][1] = ' '
      }
    }
    console.log(state.randomWord) // 2번
    console.log(state.showWord) // 3번

(1)원본 배열

(2)복사한 배열 값 변경

(3)복사된 배열의 값이 바껴도 원본 배열 유지 

2) Array.from(배열)

    var a = [12, 2, 34, 4] // 기존 배열
    var b = a // 얕은 복사
    var c = Array.from(a) // 깊은 복사
    
    a.reverse() // 기존 배열 변경
    c.push(123123) // 깊은 복사한 배열 변경
    
    console.log(a) // 기존 배열
    console.log(b) // 얕은 복사
    console.log(c) // 깊은 복사