210103_TIL

 

🎄오늘 한 일

---

✔️ 1. 배열코플릿 (코드문제) 전부 다시 풀기

• 1) 다음주 HA시험을 앞두고 코플릿에 있는 모든 문제를 다시 풀고자 하였다.
  오늘은 배열에 있는 25문제를 다시 풀어보았는데, 배열이 그래도 가장 많이 사용하던 타입이여서 인지 굉장히 수월하게 풀어낼 수 있었다. 

✔️ 2. underbar.js Part2 페어코딩
    이번주 underbar 페어시간에 다 풀지 못했던 part2의 어려운 문제들을 페어분과 시간을 잡아 같이 풀어보았다.
    underbar.js 는 객체(배열)의 메소드들의 동작원리를 이해하며 실제로 구현해보는 것인데,
    ._zip 과 ._sortBy 함수 구현은 정말로 어려웠다.
    오랜시간 풀어내지 못하여 결국 reference 정답코드를 참고하여 해당 코드를 이해하는 방향으로 진행하였다.
    정답코드를 보면 한 줄 한 줄 이해가 되긴 하는데, 과연 내가 처음부터 풀라고 한다면 아직은 아득하다...
    익숙함, 연습이 부족하기 때문이므로 반복 숙달 훈련을 통해 익숙해져야겠다.

 

🎄기억할 것

---

✔️1. js 에서 typeof null , type of array 는 'object' 를 리턴한다.

• 따라서 null 의 경우 (input === null) , (Array.isArray(input)) 을 통해 해당 경우 예외처리를 해주었다.

✔️ 2.변수명과 조건식을 써줄 때, 의미적으로 더 명확한 코드를 쓰기

• 1) 빈배열을 표현할 때 arr[0] === undefined 보다는 arr.length === 0 이 더 알맞은 표현
• 2)  index가 배열의 길이보다 클 때를 표현할 때에는, index >= arr.length 보다는 index > arr.length -1 로
  표현하여 클 때를 명확히 하고, 배열의 가장 큰 index가 의미하는 바인 '배열의 총 길이 -1' 을 살려서 코드에 반영하여 준다. 

✔️3. for in 과 for of 의 사용

• 1) for in 은 객체에서 사용할 수 있으며, for of 의 경우 배열에서만 사용가능한 반복문의 표현이다.
  for <key> in <obj> , for <el> of <arr> 를 통해 각각 객체의 키와, 배열의 요소들에 접근할 수 있다.

✔️4. arr.concat( )

• 1) let arr3 = arr1.concat( arr2, ...args) 와 같이 사용하며 arr3는 arr1,arr2,args 들이 합쳐진 하나의 새로운 배열을 리턴한다.
• 2) arr.concat( ) 은 새로운 배열에 참조를 복사하여 넣기 때문에, 원배열을 수정하지 않는 immutable 속성을 가진다.
  
  

✔️5. arr.slice( ) , 얇은복사 vs 깊은 복사

• 1) arr.slice( 0 ) 일 경우 얇은복사를 하게 됨,
  2) arr.slice( startIndex, endIndex) 에서 startIndex 가 음수인 경우 뒤에서부터 index넘버 센다.
    만일 endIndex를 주어지지 않으면 배열 끝까지로 간주한다.
  
  
  • 먼저 단순복사란 할당연산자( = ) 을 통한 단순복사(참조)하는 것을 뜻하고, 객체의 주소값 자체를 복사하게 되므로 원배열의 값이 변하면 복사한 객체의 값도 변한다. 따라서 객체의 불변성을 깨트리고, 버그를 유발할 수 있기 때문에 사용이 지양된다. 이 때문에 얇은복사와 깊은 복사의 개념이 나오게 된다.
  • 얇은 복사 (shallow copy)
    • 얇은 복사 (shallow copy)는 원본객체의 각 속성과 값을 그대로 생성한 것
      여기서 복사하는 프로퍼티의 값이 객체 타입이라면, 해당 객체의 주소를 복사하게 된다.
      따라서 복사된 객체는 원본 객체와 동일한 프로퍼티와 값을 가지게 되지만, 객체로 된 값을 가지고 있는 경우에는 주소값을 가지게 된다.
      얇은 복사는 Object.assign( ) 을 통하여 실행할 수 있으며, 객체 요소까지도 불변성을 지키기 위해서 깊은 복사를 사용하게 된다.
      * 깊은 복사는 let copyObject = JSON.parse(JSON.stringify(mainObject)) 로 구현가능하다얇은복사

✔️6. arr.pop( ) , arr.slice(0, arr.length -1) 로 마지막 요소 제외한 배열 리턴하기

• • 1) arr.pop( ); return arr; 의 경우 mutable 하게 원본 배열 arr을 직접 변경하여 리턴하는 방법이다.
  • 2) arr.slice(0, arr.length -1 ) 은  원본 배열인 arr은 건드리지 않고, 자른 배열만을 새롭게 리턴한다. 

✔️7. arr.splice( )

• arr.splice( startIdx, deleteCount, insertEle )
• 리턴값은 delete된 요소가 담긴 배열 arr의 startIndex 부터 deleteCount 만큼 제거하고, 그 자리에 insertEle 를 넣는다. 리턴값은 지워진 요소들(arr) deleteCount 는 optional, 없다면 배열 끝까지로 간주
• splice( ) 는 원본 배열 arr를 변경한다. (mutable)

🎄더 공부할 것

✔️1. underbar js를 할 때 다층구조의 객체에 접근하는 것에 어려움을 느꼈다.
{ a: 1, b:2, c: { d: 4, e:5, f : { g:7 } }} 깊이는 3층이며 1층의 넓이는 3이라고 볼 수 있다.
깊이우선탐색, 넓이우선탐색 개념을 조금 더 공부해보고 싶다.

마무리 Think: 시험이 다가오면서 마음이 조급하지만, 천천히 꾸준히 복습하고 커리큘럼을 지켜가며 학습하고 싶다!