typeScript (7) 썸네일형 리스트형 TypeScript 4.5의 변경 사항 요약 지난주, TypreScript 4.5가 출시되었습니다. 아래의 글에서는 TypeScript 4.5에 추가된 기능이나 변경사항들을 요약하여 소개합니다. 이 요약사항의 원본 글은 Announcing TypeScript 4.5 입니다. Awaited 유형을 통한 Promise 개선 Promise들을 재귀적으로 언래핑하여 'Promise' 와 같은 타입을 'number'로 바꿔주는 Awaited가 추가 됩니다. 이번 업데이트를 통해 Promise.all과 같은 함수를 사용할 때, 타입이 잘못 추론되는 오류를 해결 할 수 있습니다. 개인적으로 이번 업데이트 중 가장 크게 느껴질 업데이트라 생각합니다. 추가적이 기능들은 깃허브 PR을 참조하세요. 사용하지 않는 import 제거를 끄는 플래그 추가 eval을 사용하.. 6/16 - 재밌는 실수 오늘 재밌는 실수가 하나 있었는데, 테스트의 필요성을 느낀 실수 였다. 먼저, 기존 코드에서는 특정 시각이 오전인지 오후인지를 구하고 있었다. 오전 오후를 구별하는 로직은 자주쓰일 가능성이 높기 때문에 나는 이 로직을 별도로 빼냈다. 별다른 타입오류도 발생하지 않았기에 안심하고 커밋&푸시를 했다. 그리고 시간이 좀 지났을까 채팅방에는 사진이 하나 올라왔다. 내가 짠 코드였다. 오전인지를 구하는 함수인데, 시간이 12시간보다 큰지를 반환하고 있었던 것이다. 테스트 코드의 중요성이 느껴지는 순간이었다. 만약에 테스트코드가 있었다면 오전 9시가 오후로 반환되는걸 미리 캐치해서 테스트를 통과하지 못했을 것이다. 그럼 왜 테스트가 실패했는지 확인했을 것이다. 그리고 나는 푸시 전에 바로, 오류를 확인하고 수정할 .. 4/19 - 데코레이터 데코레이터 쓰고싶다데코레이터를 사용하면 가독성이 매우 좋아진다. 로직들이 흩어져있지 않고, 한곳에 모여져 있을 수 있기 때문이다. 그러나 최근 많은 자바스크립트 라이브러리에서 데코레이터를 권장하지 않고 있다. mobx 역시 6.0에서 데코레이터 문법을 사용하지 않는 것을 권장한다. 가장 큰 이유는 현재 사용되고 있는 데코레이터 문법이, 표준 문법이 아니기 때문이다. 아직 데코레이터는 표준화 절차를 밟고 있고, stage 2에 위치한다. 현재 데코레이터는 Babel을 통해 지원되고 있다. 게다가 표준안이, 지금 Babel를 통해 사용하고 문법과 달라질 것으로 보이기 때문에, 사용하는 것이 조금 꺼려진다. 얼른 표준안이 마련되서 데코레이터를 안심하고 쓸 수 있었으면 좋겠다. 퇴근길 사진 React에서 잘못된 랜더링 조건문을 작성하는 경우 React에서 인라인 조건문을 삼항식 대신에, && 연산자를 사용하여 표현하는 경우가 있다. 위의 코드에서 의도 했던 동작은, 리스트의 길이가 0보다 클 때 Count를 반환하고, 0이면 아무것도 반환하지 않는 것이다. 하지만 실제 실행결과는 리스트의 길이가 0인 경우에, '0' 자체가 랜더링되게 된다. 분명 React에서는 일반적으로 거짓으로 취급되는 몇몇 값들이 반환될 경우에는, 랜더링을 하지 않는다. 그러나 숫자 0은 예외적으로 그대로 랜더링하게 된다. 그렇기 때문에, 위와 같은 코드를 사용해서는 안된다. 위의 코드는 ' > 0 '을 추가하여 의도한 대로 코드가 동작될 수 있도록 하였다. 이처럼 &&연산자를 사용하여 인라인 랜더링 조건문을 작성할 때에는 앞의 조건식이 boolean을 반환하도록 하는.. [TypeScript] 옵셔널 체이닝(Optional Chaining) 타입스크립트 3.7이 릴리즈 되면서 새롭게 사용할 수 있게 된 문법 중에 하나가 바로 "옵셔널 체이닝(Optional Chaining)"이다. null이나 undefined인 값이 반환되면, 즉시 중단하고 undefined를 반환하는 문법이다. 코드가 즉시 중단 되는 것은 꽤 멋진 것이, 보통의 경우, null이나 undefined에 접근하여 함수를 실행시키는 경우에는 오류가 발생하지만, 이 경우에는 오류 없이 바로 undefined를 반환 한다는 것이다. const apple = garden?.tree.getApple(); 위 코드는 아래와 같다. const apple = (garden === nulll || garden === undefined).tree.getApple(); 위의 코드가 헐씬 간결한.. 주식 시세 라이브러리 krx-stock-api 공개 KRX(한국거래소)의 주식 시세 API를 사용하기 쉽게 라이브러리로 만들었습니다. ※ 라이브러리 사용에 따른 책임은 사용자 본인에게 있습니다. https://www.npmjs.com/package/krx-stock-api TSLint와 ESLint의 통합 https://medium.com/palantir/tslint-in-2019-1a144c2317a9? TSLint in 2019 Palantir is the creator and primary maintainer of TSLint, the standard linter for the TypeScript programming language. As the TypeScript… medium.com TSLint와 ESLint가 통합한다고 한다. TSLint팀은 TSLint 대신 ESLint에서의 TypeScript 지원 향상에 집중하기로 계획했다고 한다. in English The TSLint and the ESLint will be integrated. The TSLint team plan to focus o.. 이전 1 다음
