TypeScript 6

[React + TypeScript] React.FC 변경된점 과 사용법

FC : function Components // FC 를 쓰면 props 안의 chilren 을 쉽게 사용할 수 있다. // 제네릭까지쓰면 FC 에 들어있는 chilren 과 들어올 props 의 타입을 같이 사용가능하다. // 하지만 좋은 방법은 아니라고한다. // 그 이유는 사용하지 않는 children 을 암시적으로 가지고 있다고 추정 하기때문에 안티 패턴이다. // react 18v 부터는 FC의 암시적인 children이 삭제되었다고한다. 그러면 쓸 이유가 더더욱 줄어든다. app.tsx Todos 컴포넌트에 아이들이라는 children 을 내려주고있다. FC 를 사용하면 children 을 암시적으로 갖고있어서 타입설정을 안해줘도 된다고 알고있었는데 에러가 난다. 아마 리액트 18버전부터 변..

TypeScript 2023.03.29

[TypeScript] Mapped Type

비디오 라는 타입을 열심히 다른곳 에서 쓰고있다가 갑자기 비디오 타입에 속성을 변경하고 싶을때 쓰고있는 다른곳에는 영향을 안주고 바꾸는 방법이 있다 바로 Mapped Type 이다. 만약 위의 비디오라는 타입에서 타입들을 모두 옵셔널 타입으로 바꾸고싶다면 요렇게 물음표를 붙힌 새로운 타입을 만들 수도 있겠지만 그렇다면 기본 비디오 라는 타입에 새로운 타입이 생성되면 비디오2 에도 똑같이 계속 추가해 주어야 하는 문제점이 있다. 요것이 매퍼 타입이다. 받아온 T 타입안의 요소들을 루프를 돌며 인덱스 타입을 이용해서 다시한번 지정해주는 방법이다. 위의 옵셔널이라는 타입은 말 그대로 물음표를 붙혀서 받아온 타입들을 모두 옵셔널로 바꿔주는 타입이다. 요런식으로 옵셔널 타입에 제네릭으로 사용할 타입을 넣어주면 된..

TypeScript 2021.11.09

[TypeScript] OOP 원칙

1. 캡슐화 서로 연관있는 함수와 데이터를 모으는것 - 은닉화 외부에서 보일필요가 없는 데이터를 숨기는것 접근 제한자 public 어디서든 접근가능 private 클래스 밖에서는 접근이 안됨 protected 상속받은 클래스에서는 접근 가능함 함수 또는 변수 앞에 위에 속성들을 붙혀서 정보를 은닉 할 수 있음. ex:) * static class를 통한 별도의 인스턴스나 객체를 생성하지 않고도, 바로 class 내부의 함수 및 인자를 사용할 수 있는 방법 ex :) const test = new coffeeMaker(); test.makeMachine(10) 요렇게 함수호출을 해야 되던것을 static 을 붙히면 const test = CoffeeMaker.makeMachine(10) 요렇게 바아로 cl..

TypeScript 2021.11.02