200917_TIL

oh_ji_0·2020년 9월 17일
2

TIL

목록 보기
36/61

Today I Leanred

  • nQueens 문제 정리
  • 얕은 복사, 깊은 복사 & 크롬 콘솔로그
  • HA 문제 정리

@@ 이틀동안 nQueens 문제를 정리하고 어제 IM 코스 첫번째 HA까지 보느라 정신없이 보내고, 오늘 솔로데이를 맞아서 내가 많이 헤맸던 nQueens 문제를 다시 정리해보았다.
이틀동안 할애를 했는데도 나는 nQueens 문제를 통과하지 못했는데, 스프린트 리뷰시간에 알고리즘 문제 풀이에 대한 접근 방법, 훈련 방법 등을 재정리할 수 있어서 좋았다.

당일 저녁까지 풀어도 못풀었던, nQueens 문제는 오늘 솔로데이를 가지면서 비로소 풀 수 있었다. 내 문제는 분기 처리와 재귀함수, 탈출 코드 짜는 것들을 생각하는 것까지는 좋았는데 재귀가 탈출 코드를 만나서 타고타고 나오면서 해당 값을 return 하는 방식에서의 문제였다.

실행 컨텍스트가 n개 쌓인 상태에서, 컨텍스트가 종료되면 그 해당 리턴값을 받아오고 다시 리턴하고, 하는 연쇄 과정에서 사고가 꼬여버린 것이다.

오늘도 역시나 너무 헷갈려서 엔지니어분의 조언대로 실행 컨텍스트를 주석으로 하나하나 체크하면서 연결한 결과 코드를 구현할 수 있었다. (물론 실행시간이 너무 긴게 문제지만...)

@@또한 오늘 nQueens를 풀면서 이해가 안가는 부분이 있었는데 이차원 배열을 변수에 담아 콘솔로 찍을 때, 해당 단계에서 값이 아닌 코드가 다 돌고 난 뒤의 결과 값이 찍히는 문제였다.

class Board {
    constructor(){
        this.storage = [[0,0,0,0],[0,0,0,0],[0,0,0,0],[0,0,0,0]]
    }
}

let board = new Board();

Board.prototype.changeValue = function(row,col){
    this.storage[row][col] = 1;
}
board.changeValue(1,2);
console.log(board.storage);
board.changeValue(2,3);
console.log(board.storage);
board.changeValue(0,3);
console.log(board.storage);

해당 코드를 찍으면 단계별로 적용된 값이 나와야 된다고 생각했는데, 아래와 같이 마지막 메서드까지 실행되고 난 뒤에 값이 찍혔다.

호이스팅? 이차원 배열의 개념? 무엇이 문제일까 구글링을 해도 답을 찾지 못했는데, 헬프데스크에 들어가 검색해보니 이전 기수 분이 올린 질문이 있었다.
해당 글에 대한 답변은 요약하면 크롬 콘솔창은 코드를 모두 실행한 뒤, 그 주소값을 찾아서 반환하기 때문이라는 답이었는데, 이를 피하려면 Deep copy를 이용해야 한다는 답변이 있었다.

생각하지 못했던 이슈라서 얼른 vscode 디버깅으로 다시 찍어보았다

그랬더니 위와 같이 단계별 값이 제대로 찍혔다 😱😱

그래서 정리하는 김에 Deep copy 하는 법에 대해서 더 알아봤다.

  • Deep copy
    • 얕은 복사는 같은 주소를 바라본다. 그렇기 때문에 한 곳의 데이터값이 변화가 있을 경우. 나머지 한쪽도 그 영향을 받게 된다(같은 주소를 바라보고 있으므로)
    • 깊은 복사는 사본을 나눠서 복사하는 방법니다. 사본으로 저장하기 때문에 이전 원본 값에 영향을 주지 않는다.
  • 배열의 깊은 복사
    Array.prototype.slice()
  • 객체의 깊은 복사
    • lodash 와 같은 라이브러리 이용
    • JSON.parse, JSON.stringify 이용 복사
      • 다만 get, set 함수는 물론, 프로퍼티에 함수를 저장할 경우 이를 복사해오지 못한다 ( function 을 undefined 처리해버린다. 성능적으로 좋지않다.)
const original = { 
  a : {b : 2},
  b : function(){ console.log('b')}
};

copy = JSON.parse(JSON.stringify(original));
console.log(copy); //{a: {b: 2}}
  • Spread syntax, Object.assign은 Deep copy가 되지 않는다. (얕은복사)
profile
기본에 충실하고 싶습니다. #Front-end-developer

0개의 댓글