전체 글21 Refactoring 2판 3장 리팩터링을 언제 시작하고 언제 그만할지를 판단하는 일은 리팩터링의 작동 원리를 아는 것 못지않게 중요합니다. 이 장에서는 리팩터링하면 해결할 수 있는 문제의 징후를 제시할 뿐 이런 일들을 언제 해야하는지는 제시하지 않습니다. 즉, 인스턴스 변수는 몇 개가 적당한지와 같은 것들은 각자 경험을 통해 감을 키워야한다고 합니다. 기이한 이름(Mysterious Name) 코드는 단순하고 명료하게 작성해야 한다. 함수, 모듈, 변수, 클래스 등은 그 이름만 보고도 각각 어떻게 사용되는지 혹은 어떻게 사용해야 하는지 명확히 알 수 있도록 해야합니다. 중복 코드(Duplicated Code) 똑같은 코드 구조가 여러 곳에서 반복된다면 하나로 통합하여 더 나은 프로그램을 만들 수 있다. 예시를 들어보겠습니다. 한 클래.. 2023. 8. 29. TypeScript의 구조적 타이핑과 Brading TypeScript의 타입 체크는 구조적(structural) 시스템을 따릅니다. 이는 아래와 같은 신기한(?) 특징을 가집니다. interface Foo { a: number } interface Bar { a: number b: string } const foo: Foo = { a: 3, b: 'b' } as Bar위 코드는 Foo에 Bar를 할당하고 있습니다. Bar에는 Foo와는 다르게 추가적으로 b가 존재합니다. 그런데도 위 코드는 정상 동작합니다. 이러한 이유는 TypeScript가 구조적 시스템을 따르기 때문입니다. Foo가 되기 위해서는 a: number만 있으면 되고, 이는 Bar도 만족하기 때문에 위 코드가 정상 동작하는 것입니다. 즉, 구조적으로 타입이 맞기만 하면, 이.. 2023. 8. 23. React component의 순수성이란 Component를 순수하게 유지하자 순수 함수(Pure function)는 계산만 수행합니다. 그러므로 component를 순수 함수로만 엄격하게 작성하면, 코드 베이스가 커짐에 따라 함께 올 수 있는 각종 버그들과 예측 불가능한 동작을 피할 수 있습니다. 순수 함수 효과를 얻기 위해서 따라야할 몇 가지 규칙이 있으며, 지금부터 알아보겠습니다. 순수성 함수형 프로그래밍에서는 순수 함수가 다음의 특성을 따릅니다. 호출되기 전에 존재했던 객체나 변수는 변경하지 않습니다. 즉 자기 자신에 대해서만 생각합니다. Input이 같으면 output도 같습니다. Input으로 같은 값이 주어지면, 순수 함수는 항상 같은 결과를 반환해야 합니다. 이미 우리는 수학에서 순수 함수와 비슷한 것을 본 적이 있습니다. y=2.. 2023. 8. 18. Render와 Commit 여러분이 만든 컴포넌트들이 화면에 보이기 전에 컴포넌트들은 React에 의해 렌더링이 되어야 합니다. 이러한 프로세스를 익힌다면, 우리는 코드가 어떻게 실행되는지와 그 이면에 대해 이해할 수 있을 것입니다. 뜬금없지만 지금부터는 컴포넌트(Component)가 부엌에서 여러 재료들을 조립해서 맛있는 요리를 만드는 요리사라고 생각해봅시다. 이 시나리오에서는 React는 고객의 요청을 접수하고 전달해주는 종업원이 됩니다. UI를 요청하고 제공하는 이 프로세스에는 다음과 같은 세 가지 단계가 존재합니다. Triggering a render(손님의 주문을 부엌으로 전달) Render the component(부엌에서 주문을 준비) Committing to the DOM(테이블에 주문한 음식을 놓기) 첫 번째 단계.. 2023. 7. 20. 이전 1 2 3 4 ··· 6 다음 반응형
