TIL

TIL
TIL

오늘 한 일

Javascript30 14차

  • JavaScript References VS Copying

원시 타입과 찹조타입의 복사에 관한 차이와 얕은복사, 깊은 복사에 대한 내용이었다.

다음은 배열을 복사하는 방법이다.(단, 얕은 복사)

1
2
3
4
5
6
const cats = ['Syami', 'Jojo', 'Loki', 'Kkonnim'];

const team1 = cats.slice();
const team2 = [].concat(cats);
const team3 = [...cats]
const team4 = Array.from(cats)

Array.from() 메서드는 배열의 형태를 갖거나 순회 가능한 객체로부터 얕게 복사한 Array 객체를 만듭니다.

다음은 객체를 복사하는 방법이다.(단, 얕은 복사)

1
2
3
4
5
6
const cat = {
  name: 'Syami',
  age: 10
}

const cat2 = Object.assign({}, cat, { kind: 'korean shot', age: 11})

이러한 복사는 1 레벨의 깊이만 복사가 가능하다. 배열 안 배열 혹은 객체 안 배열 등등의 중첩되어 여러 레벨의 깊이가 생긴 객체(혹은 배열)을 복사하는 방법은 깊은 복사라고 하며 강의에서는 그 방법 중 하나를 소개해 줬는데 다음과 같다.

1
2
3
4
5
6
7
8
9
const cat = {
  name: 'Syami',
  age: 10,
  family: {
    brother: ['Jojo', 'Loki'],
    sister: ['Kkonnim', 'Samsun']
  }
}
const cat2 = JSON.parse(JSON.stringify(cat))

그러나 이 방법은 성능상 매우 안 좋고, 직렬화 할 수 없는 속성들은(prototype이라든가) 날라가 버리기 때문에 좋은 방법은 아니라고 한다.

파이널 프로젝트 2차 준비

서버를 GraphQL로 하자는 얘기가 나와서 다음의 영상들을 보게 되었는데, 많이 도움이 되었다.

그런데 프로젝트에 기획했지만 아직 구현되지 못한 부족한 부분이 많고, 처음부터 Apollo client를 쓰려니 잘 이해되지 않는 부분이 많아서 먼저 리덕스로 변경하는 것부터 처리하는 게 좋을 것 같아 리덕스를 먼저 해보기로 했다.

Share Comments