210102_TIL (복습, 트위틀러 리팩토링)

🍎 오늘 한 것

---

✔️ Coplit 다시풀기(변수~객체)
놓친 부분이 있나 싶어서 Lesson도 처음부터 다시 보며 복습했다. Coplit도 처음부터 다시 풀어보니 나중에 배운 내용을 적용해서 더 쉽게 접근할 수 있는 문제들이 있어서 여러가지 방법으로 개선해보기도 했다. 특히 일일이 조건문이나 반복문으로 해결해야하는 주의사항이 달린 문제를 풀면서 배열, 객체, 재귀를 쓰면 금방 끝날텐데..하는 생각도 들면서 어떤 면에서 효율적인지 느낄 수 있는 시간이었다.

✔️ 재귀 복습
재귀 문제는 여러번 다시 풀어도 바로 생각이 안나고, 역시 직관으로 안풀리는 문제여서 여러번 다시 풀어봤다.. 계속 다른 방식으로 풀어서 노션에 답들을 쭉 옮겨두고 비교해봤다. for문을 이용하는 방법과 이용하지 않는 방법 등 최대한 다양한 방법으로 시도해봤는데, 같은 문제를 반복해서 풀다보니까 슬슬 내가 문제를 외운건 아닌가 하는 생각이 들기도 해서 하노이의 탑 같은 좀더 응용된 문제들도 찾아보려고 한다.

✔️ twittler 리팩토링
댓글 삽입 부분에서 innerHTML을 썼었는데 (귀찮다고 미루고 있었던.. appendChild로 고치기를 드디어 했다. 구조가 복잡해서인지 코드가 급격히 길어졌지만 뿌듯하다. localStorage도 기존에 없을 경우에는 새로 생성하고, 이미 있는 경우는 그대로 유지하도록 조건문을 추가해줬다. 내 컴퓨터에는 처음에 만든 이후로 계속 있었어서 없을 경우를 생각 못하고 있었다 큰일날뻔..

✔️ 재귀함수 & 메모리의 관계
재귀함수를 쓰는 이유는 (1) 가독성을 높임 (2) 변수 사용을 줄여줌 크게 두가지이다. 재귀함수를 쓰지 않는 이유는 메모리를 많이 차지하고, 성능이 반복문에 비해 느리기때문이다. 함수를 호출하면 매개변수, 지역변수, 리턴값, 함수 종료 후의 위치가 스택 메모리에 저장된다. 그런데 재귀함수는 이런 함수를 계속 호출하기 때문에 스택 메모리가 커져 스택오버플로우가 발생할 가능성이 높다고 한다. '꼬리 재귀'를 통해 이런 문제점을 해결할 수 있다고해서 꼬리재귀에 대해서도 좀 더 알아보려 한다.

 

🍎 기억할 것

---

✔️ mutable, immutable 메서드
오랜만에 문자열, 배열 문제를 풀다보니 '배열로 반환(새로운 주소값 반환), 기존 배열 반환' 같은 말이 자주 나와서 mutable, immutable 메서드에 대해 다시 정리하고 기억해 둘 필요성을 느꼈다.

immutable : String.slice(), String.replace(), String.split(), Array.concat()
mutable : Array.splice(), Array.unshift(), Array.shift(), Array.push(), Array.pop()

✔️ Symbol
반복문에서 for ...of, for ...in에 대한 MDN문서를 보다가 Symbol이라는 데이터 타입에 대한 이야기가 있어서 알아보게 되었다. 여러번 읽어봤지만 한번에 다 이해하기에는 어려운 개념인 것 같다💧 우선 이해한 주요 특징 몇개만 정리해두었다.

1) Primitive Type (고유, 불변)
2) 비공개 멤버(private)에 대한 필요, 이름 충돌 없이 추가 프로퍼티를 만들고자 생겨남
3) for, for ...in 등의 열거 대상에서 제외됨 !!!
4) 형 변환 불가능

✔️ delete 연산자 사용 시 주의사항
1) delete연산자를 이용해 객체 일부를 삭제할 수 있지만, index나 length를 업데이트하지 않는다. 삭제된 자리에 undefined를 끼워넣기만 할 뿐이라고 생각하면 된다. 확실한 삭제(?)를 원한다면 splice를 쓰자!
2) delete 연산자는 객체 자체가 아닌 '참조'만 삭제한다. 참조가 삭제되어 참조할 방법이 사라진 객체를 garbage collector가 수거하기 때문에 객체가 사라지는 것이다.

 

🍎 더 공부할 것

---

✔️ 꼬리 재귀
✔️ 하노이의 탑 Javascript로 구현해보기