본문 바로가기

자바스크립트

(4)
TypeScript 4.5의 변경 사항 요약 지난주, TypreScript 4.5가 출시되었습니다. 아래의 글에서는 TypeScript 4.5에 추가된 기능이나 변경사항들을 요약하여 소개합니다. 이 요약사항의 원본 글은 Announcing TypeScript 4.5 입니다. Awaited 유형을 통한 Promise 개선 Promise들을 재귀적으로 언래핑하여 'Promise' 와 같은 타입을 'number'로 바꿔주는 Awaited가 추가 됩니다. 이번 업데이트를 통해 Promise.all과 같은 함수를 사용할 때, 타입이 잘못 추론되는 오류를 해결 할 수 있습니다. 개인적으로 이번 업데이트 중 가장 크게 느껴질 업데이트라 생각합니다. 추가적이 기능들은 깃허브 PR을 참조하세요. 사용하지 않는 import 제거를 끄는 플래그 추가 eval을 사용하..
[리팩토링] 코드 숨기기, 가독성 좋은 코드 짜기 변수 추출(Extract Variable) 어떤 코드가 조금 보기 복잡해 졌다고 가정했을 때, 먼저 시도 해볼만한 것은 코드를 쪼개 변수로 나누는 것이다. 예를 들어 아래와 같이 부모와 자식의 값을 더하는 함수가 있다고 가정한다. 읽기 매우 난해할 것이다. 물론 함수명을 잘 지어도 좋지만, 여기서는 논외로 둔다. 각 값들을 변수로 쪼개면 아래와 같은 코드가 된다. 조금 더 알아보기 쉬운 코드가 됐다. 긴 코드들이 있었지만, 이 함수에서의 핵심 로직은 부모 값과 자식 값을 더한다는 것을 알 수 있게 됐다. 코드의 추상화 제멋대로 붙인말이지만, 뭔가 좀 있어보이게 말하자면, '코드의 추상화'라고도 할 수 있을 것 같다. 실제 데이터의 흐름은 app.store.data.parent.value + app.sto..
4/19 - 데코레이터 데코레이터 쓰고싶다데코레이터를 사용하면 가독성이 매우 좋아진다. 로직들이 흩어져있지 않고, 한곳에 모여져 있을 수 있기 때문이다. 그러나 최근 많은 자바스크립트 라이브러리에서 데코레이터를 권장하지 않고 있다. mobx 역시 6.0에서 데코레이터 문법을 사용하지 않는 것을 권장한다. 가장 큰 이유는 현재 사용되고 있는 데코레이터 문법이, 표준 문법이 아니기 때문이다. 아직 데코레이터는 표준화 절차를 밟고 있고, stage 2에 위치한다. 현재 데코레이터는 Babel을 통해 지원되고 있다. 게다가 표준안이, 지금 Babel를 통해 사용하고 문법과 달라질 것으로 보이기 때문에, 사용하는 것이 조금 꺼려진다. 얼른 표준안이 마련되서 데코레이터를 안심하고 쓸 수 있었으면 좋겠다. 퇴근길 사진
forEach를 사용하면 안되는 경우 forEach를 다른 함수로 바꾸기 Level 1 위 와 같은 코드에서는 아래와 같이 forEach 대신 filter를 사용하는 것이 더 좋다. 이외에도 생각보다 forEach 대신 다른 함수를 써야하는 경우가 더 많다. 각 경우는 MDN에서 소개하는 각 함수의 정의를 생각하면 결정하기 편리하다. forEach 메서드는 주어진 함수를 배열 요소 각각에 대해 실행합니다. forEach는 "실행" 하는 의미를 갖고 있기 때문에, 실행하는 경우(로그, API 호출 등)에 적합하다. filter 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환합니다. filter는 "테스트" 하는 의미를 갖고 있기 때문에, 특정 조건에 해당하는 요소를 뽑아내는 경우(a>N 등 if문)에 적합하다. ..