본문 바로가기

FrontEnd

(437)
타입스크립트 함수의 시그니처와 리스코프 치환 원칙 https://itchallenger.tistory.com/382?category=1091150 타입스크립트의 타입 불건전성에 대하여 2 : 공식 예제 코드 살펴보기 https://www.typescriptlang.org/play?strictFunctionTypes=false#example/soundness TS Playground - An online editor for exploring TypeScript and JavaScript The Playground lets you write TypeScript or J.. itchallenger.tistory.com 함수 파라미터는 반공변성, 리턴 타입은 공변성을 갖는다. (예제 코드는 위 글의 2. Function Parameter Bi-variance(..
타입스크립트의 타입 대수(type argebra)를 통해 타입 오류 분석하기 Type algebra는 TypeScript에서 많이 알려지지 않은 주제이며 TypeScript의 몇 가지 단점을 이해하는 데 필수적인 주제입니다. Algebras (대수) 집합 대수가 |,&에서 모두 분배법칙이 성립하며 타입스크립트의 타입 합집합 교집합은 집합 대수를 따름을 이해하면 됩니다. 우리 모두 수학 수업에서 몇 가지 대수 법칙을 배웠습니다. 곱셈은 덧셈에 대해 왼쪽 분배 법칙 성립: a * (b + c) === (a * b) + (a * c) 곱셈은 덧셈에 대해 오른쪽 분배 법칙 성립: (a + b) * c === (a * c) + (c * c) 덧셈은 곱셍에 대해 분배법칙이 성립하지 않습니다. 그리고 우리가 방금 본 일반 대수학(ordinary algebra)과 약간 다른 부울 대수학(boo..
타입스크립트 타입 호환성과 타입 계층 트리 타입스크립트의 타입 계층을 통해 타입 호환성을 알아봅시다. 1. 타입 호환성은 뭔가요? 타입 호환성 Documentation - Type Compatibility How type-checking works in TypeScript www.typescriptlang.org 타입스크립트에는 다양한 타입이 존재하는데, 어떠한 타입 변수에 다른 타입 데이터(값)이 할당 가능하면 타입이 호환된다고 합니다. 타입스크립트는, 구조적 타이핑을 허용하기에, 클래스 명이 다르면 하위 구조가 완전 같아도 호환이 불가능한 자바의 명목 타이핑과 다른 동작을 보여줍니다. 기본적으로 타입 호환성은 업캐스팅 가능 여부로 판단합니다. 이 게시물에서는 타입스크립트 기본 타입 간의 계층 구조를 이해하며, 타입 호환성을 알아봅니다. 아래..
아폴로 클라이언트로 알아보는 클라이언트 아키텍처 [Apollo Client & Client-side Architecture Basics] https://www.apollographql.com/blog/apollo-client/architecture/client-side-architecture-basics/ Apollo Client & Client-side Architecture Basics Architecture is the foundation, the skeleton, that sets your project up for success. It’s the stuff that we wish we got right from the start because making drastic architectural changes, later on, can be challenging and time-consuming. Today, we React de ..
타입스크립트의 타입 불건전성에 대하여 2 : 공식 예제 코드 살펴보기 https://www.typescriptlang.org/play?strictFunctionTypes=false#example/soundness TS Playground - An online editor for exploring TypeScript and JavaScript The Playground lets you write TypeScript or JavaScript online in a safe and sharable way. www.typescriptlang.org 타입 이론에 대한 배경 지식이 없으면, "건전성"이라는 타입 시스템의 개념에 익숙하지 않을 것입니다. 건전성은 컴파일러가 런타임 값이 컴파일 타임과 런타임에 같은 타입임을 보장할 수 있다는 것을 의미합니다. 처음부터 정적 언어로 설계된 ..
타입스크립트의 타입 불건전성에 대하여 1 : 타입시스템의 한계 해당 페이지를 번역 및 요약함. https://effectivetypescript.com/2021/05/06/unsoundness/ Effective TypeScript › 62 Specific Ways to Improve Your TypeScript Effective TypeScript: 62 Specific Ways to Improve Your TypeScript effectivetypescript.com 2부 : 타입스크립트의 타입 불건전성에 대하여 2 : 공식 예제 코드 살펴보기 (tistory.com) 타입스크립트의 타입 불건전성에 대하여 2 : 공식 예제 코드 살펴보기 https://www.typescriptlang.org/play?strictFunctionTypes=false#example/..
Context API와 React.memo contextAPI 내부의 React.memo HTML 삽입 미리보기할 수 없는 소스 Context API의 컨텍스트 안에 있는 요소는 Provider의 children인 컴포넌트는 React.memo를 사용한다 해도 렌더링된다. 명시적으로 props에 value만 없는 형태이지, 실제로는 props drilling이 일어나는 것처럼 사용된다. children 컴포넌트 내부에 memo를 적용하면, 해당 memo는 잘 적용된다. dispatch / setState Context를 분리하면? HTML 삽입 미리보기할 수 없는 소스 위의 예제코드와 같이 dispatch/setState Context를 따로 분리해줘도 마찬가지이다. https://react.vlpt.us/mashup-todolist/02-man..
Context API(컨텍스트API)는 Dependency Injection(의존성 주입) 수단이다. 원문 : React Context for Dependency Injection Not State Management (testdouble.com) React Context for Dependency Injection Not State Management Dive into the concept that React Context API is primarily a tool for injecting dependencies into a React tree and how we can use that to improve testability, reusability, and maintainability of our … blog.testdouble.com TLDR : ContextAPI는 전이적 의존성을 추상화하기 위..