본문 바로가기

TIL

(53)
This Week. 2.1 ~ 2.6 이번 주는 리팩터링만 읽은 거 같다. 알고리즘들을 조금씩 풀고 있기는 한데, 기본적인 문제들을 다시 보는 중이다. 오늘은 타입 스크립트 복습도 하고 리팩터링도 복습할 겸 리팩터링 예시 코드를 타입 스크립트로 바꿔봤다. 막상 개념적으로 알고 있던 것들 바꾸려니까 익숙하지가 않아서 힘들었다. 특히 객체들 타입 정하는 게 생각보다 깔끔하게 하기가 힘들다. 실제로 실무에서는 밑에 처럼 하면 안 될 텐데 어떤 식으로 타입들을 작성해야 깔끔한지 아직 잘 감이 안 온다. 다른 코드들 좀 많이 봐야겠다. 기존 코드는 https://kspsd.tistory.com/103 여기에 있다. import type {play,playValue} from "./plays.js" import type {performance ,inv..
Refactoring. 리팩터링이 필요한 경우 저번 장에서도 간단하게 언제 리팩터링이 필요한지 간단하게 정리했지만 3장에서는 필요한 경우를 좀 더 디테일하게 다룬다. 이 부분은 익숙해질 때까지 자주 와서 읽어야겠다. 시작해 보자 코드를 명료하게 표현하는 데 가장 중요한 요소 하나는 이름이다. 함수, 모듈, 변수, 클래스 등은 그 이름만 보고도 각각이 무슨 일을 하고 있는지 어떻게 사용해야 하는지 명확히 알 수 있도록 신경 써서 이름을 지어야 한다. 마땅한 이름이 떠오르지 않는다면 설계에 더 근본적인 문제가 숨어 있을 가능성이 높다. 그래서 혼란스러운 이름을 잘 정리하다 보면 코드가 훨씬 간결해질 때가 많다. 다음으로 필요한 경우는 코드가 중복되는 경우다. 코드가 중복되면 각각을 볼 때마다 서로 차이점은 없는지 주의 깊게 살펴봐야 하는 부담이 생긴다...
Refactoring. 리팩터링 원칙 2장에서는 리팩터링 전반에 적용되는 원칙을 정의, 리팩터링 시기, 고려해야 할 문제 등을 통해 알아본다. 먼저 책에서 정의 하는 리팩터링 정의를 보자. 명사로는 소프트웨어의 겉보기 동작은 그대로 유지한 채, 코드를 이해하고 수정하기 쉽도록 내부 구조를 변경하는 기법. 동사로는 소프트웨어의 겉보기 동작은 그대로 유지한 채, 여러 가지 리팩터링 기법을 적용해서 소프트웨어를 재구성하다.라고 나와있다. 보통 많은 사람이 코드를 정리하는 작업을 모조리 '리팩터링'이라고 표현하는데 앞선 정의를 따르면 특정한 방식에 따라 코드를 수정하는 것만이 리팩터링이다. 누군가 리팩터링하다가 코드가 깨져서 며칠간 고생했다라고 한다면 리팩터링 잘못한 거라고 한다. 앞에서 래픽터링을 정의할 때 '겉보기 동작'이란 표현을 썼는데, 이..
Refactoring. 계산 단계와 포맷팅 분리, 다형성 활용한 코드 재구성 저번 리팩토링 글에 이어서 1장 나머지 부분을 정리하려고 한다. 먼저 기존에 작성된 코드를 단개 쪼개기라는 방법을 통해 재구성해야 한다. 근데 이전에 리팩터링 한 결과의 코드는 statement 안에 중첩 함수로 들어가 있다. 이대로 기능을 추가하면 코드를 그대로 복사해서 HTML버전을 만들게 될 거다. 그래서 여기서 목표는 텍스트 버전과 HTML 버전 함수 모두가 똑같은 계산 함수들을 사용하게 만들고 싶다. 따라서 statement 함수의 로직을 두 단계로 나눌 것이다. 첫 단계에서는 statmnet에 필요한 데이터를 처리하고, 다음 단계에서는 앞서 처리한 결과를 텍스트나 HTML로 표현하도록 한다. 일단 기존 코드를 다음과 같이 수정한다 mport plays from "./plays.js" impor..
Refactoring. 예시를 통해 알아보자 리팩터링이라는 책을 읽으려고 하는데, 1장에 간단한 예시와 팁들이 있어서 정리를 하고 가려고 한다. 먼저 예시 코드를 보자. import plays from "./plays.js" import invoices from "./invoices.js" function statement(invoice, plays){ let totalAmount =0 let volumeCredits = 0 let result =`청구 내역 (고객명: ${invoice.customer})\n`; const format= new Intl.NumberFormat('en-US', {style: "currency", currency: "USD", minimumFractionDigits: 2}).format for(let perf of i..
This Month. 1월 오늘은 어제의 week 복습에 이어서 이번 한 달 공부한 내용들을 돌아보자. 면접 준비한다고 쓴 것들이랑 여러 가지 글들이 너무 많아서 일단은 리스트로 보자. DOM 자바스크립트 관련 글들(실행 컨텍스트, 엔진, 히든 클래스, 이터러블,프로토타입, 클로저, 모듈 등) 타입스크립트 관련 글들( 타입스크립트에 관해, 인터페이스, 제네릭, 설정, 코드 생성 관계) 리액트 최적화 관련 훅들 ,리덕스 간단한 개념 CSR, SSR, FLUX DI, DIP개념 이번 달이 특별히 많을 수도 있다. 이전에 정리했던 글들을 블로그에 다시 쓰면서 몰아서 쓴 경향이 있다. 이걸 앞으로 어떻게 해야 될지 명확하지 않은데, 그래도 한 번씩 더 보면서 복습을 하면 그것만으로도 충분히 의미가 있다고 생각이 든다. TWIL은 미처 정..
This Week. 24 ~ 29 한 주간 정리 오늘부터 시작하는 일주일을 되돌아보는 시간. 먼저 이번 주에 공부한 내용들을 체크해 보자. FenickTree, Segment Tree 타입스크립트 제너릭, 코드 중복 슬라이딩 윈도우, 투 포인터 quick sort, merge sort 타입스크립트 설정 및 코드 생성 간단하게 펜윅트리랑 merge sort 복습하는 겸 백준 문제에서 1517 버블 소트라는 문제를 풀면서 정리를 해야겠다. 이문제가 마침 두 가지로 풀 수 있다. 먼저 펜윅트리부터 보자. 트리 크기는 세그먼트랑 다르게 입력값만큼 만들어 주면 된다. #include #define fastio ios::sync_with_stdio(0), cin.tie(0), cout.tie(0) #define endl "\n" #define pii pair #..
TS. 타입스크립트 설정 관련 그리고 코드 생성과의 관계 오늘은 상당히 바쁜 하루였다. 그래서 이펙티브 타입스크립트에서 공부한 부분을 간단하게 정리하려 한다. 왔다 갔다 하면서 보고 있어서 빼먹는 부분을 오늘 간단히 정리하겠다. 타입스크립트는 설정하는 거에 따라서 완전 다른 언어가 될 수 있다. 컴파일을 할 때 설정을 하면서 컴파일해줄 수 있다. 근데 그것보다 설정 파일을 사용하는 것이 좋다고 한다. 타입스크립트 설정들은 어디서 소스 파일을 찾을지, 어떤 종류의 출력을 생성할지 제어하는 내용이 대부분이다. 그런데 언어 자체의 핵심 요소들을 제어하는 설정도 있다. 이러한 설정을 제대로 사용하려면, noImplicityAny와 strictNullChecks를 이해해야 한다. noImplicityAny는 변수들이 미리 정의된 타입을 가져야 하는지 여부를 제어한다. ..