기존의 객체 타입을 기반으로 새로운 객체 타입을 만드는 문법인터페이스에서는 사용할 수 없다. 타입 별칭으로 써야함다음과 같은 예가 있다고 하자.updateUser에서 나이만 바꾸고 싶을 때 age만 수정하고 싶은데, updateUser함수 매개변수의 타입을 User로
객체타입으로부터 key들을 유니언 타입으로 뽑아줌getPropertyKey 함수의 매개변수 중 key는 string, 이렇게 지정해버리면 나중에 getPropertyKey(person, “name123”)이렇게 없는 매개변수 넣게되면 return에서 오류가 발생한다.
기본 타입이나 별칭 또는 인터페이스로 만든 원래 존재하던 타입들을 상황에 따라 유동적으로 다른 타입으로 변환하는 타입스크립트의 강력하고도 독특한 기능이다.제네릭도 타입 조작하기 중 하나인데 내용이 방대해 따로 본 것타입 조작하기객체,배열 타입으로부터 특정 프로퍼티 타입
타입스크립트에서 개인적으로 이해하기 어려웠던 부분중 하나가 제네릭이다. 그만큼 어렵지만 타입 정의할 때 꽤나 자주 쓰이고 특히 라이브러리나 기존 정의된 타입들에 대부분 쓰인다고 볼 수 있다.제네릭과 몇몇 개념을 조금 익히고 실제로 미리 정의된 타입을 보면 어떻게 동작하
리액트를 사용하다보면 클래스에 대해 마주할 일이 그리 많지 않은 것 같다. 그래도 일부 라이브러리나 가끔가다 클래스를 쓸 일이 생기곤 한다. 최근에 바닐라 자바스크립트를 만지다 생성자 함수로 불러오는 걸 클래스로 바꾸고 타입을 적용해보는 일이 있었는데, 음 내가 사용하
타입에 이름을 지어주는 또 다른 문법. - 객체의 구조를 정의하는데 특화된 문법거의 type 정의하는거랑 똑같다.참고로 함수 오버로딩을 하려면 화살표 함수로 정의하면 안된다. 호출 시그니쳐 형태로 해야 한다.알던것들이지만, 추가적으로 몰랐던 건 Animal이 inter
알고리즘과 자료구조는 여전히 어렵다. 최근까지도 dp를 멀리하고 있었다. 어느날 아는 동생이 면접에서 dp를 맞닥뜨리고 어려워했다는 이야기를 들었다. 이 놈, 얼마나 어려우려고? 하는 생각에 문제를 보니.. 처음엔 뭔소린가 했다.처음 몇 문제는 다른 사람의 풀이를 보며
호출 시그니쳐는 함수 매개변수와 타입을 정의하는 부분을 따로 떼어 정의해놓은걸 갖다 쓰는 모습을 호출 시그니쳐라고 부른다.여기 add2에 정의된 Operation2처럼 { } 중괄호 안에 정의하거나,add 처럼 중괄호 안하고 화살표로 정의할 수 있다.개인적으로 화살표로
지난 글에 타입은 집합이라는 것을 보았으며, 타입 단언 및 타입 좁히기에 대해 간단한 예시와 함께 설명했었다. 이번 글은 지난 글에 있었던 타입 좁히기를 더 직관적으로 설명해주는 서로소 유니온 타입에 대해 설명하려한다. 교집합이 없는 타입들로만 만든 유니온 타입타입 좁
타입스크립트의 기본적인 타입을 알면 끝일까? 아쉽게도 아니다. 기본적인 타입을 처리할 순 있겠지만, 제대로 활용하기엔 어렵다.어떤 기준으로 타입을 정의하는지, 어떤 기준으로 타입간의 관계를 정의하는지, 어떤 기준으로 타입의 오류를 검사하는지를 알고 작성하는 게 중요하다
자바스크립트 타입을 정의하는 기본적인 타입 정의가 있다. 그리고 자바스크립트에는 없는 기본적인 타입 정의가 있다. 간단한 예시와 함께 정리해보려 한다.타입을 설정하는 자리에 값 자체를 넣는 형태다. numA 같은경우 10 외에는 다른걸 못넣는 것이다.보통 1번을 더 많
vite, next, cra와 같은 것들로 리액트를 진행할 때는 커맨드로 쉽게 타입스크립트를 시작할 수 있다. 하지만 바닐라 자바스크립트를 쓸 때는 초기 세팅을 해줘야한다.타입스크립트 환경을 구성할 때 tsconfig.json에 컴파일러 옵션을 설정해야한다. 이 컴파일
최근 했던 프로젝트는 타입스크립트로 작성했지만 내가 잘 정의하고 있는지 감이 안왔다. 일부분에서는 any로 대처하며 타입스크립트를 제대로 아는게 맞을까 개인적으로 안 와닿았다. 더 나은 타입스크립트 작성을 위해 타입스크립트 강의를 결제해 처음부터 끝까지 완강하게 됐다.
HTTP 와 HTTPS의 차이에 대해 공부하려했다. 하다보니, HTTP에서 왜 HTTPS가 나오게 됐고, 어떻게 HTTPS가 동작하는지를 보는 방향으로 글을 쓰면 흐름이 깨지지않고 이해될 수 있을 것 같았다.이러한 흐름 속 알아두어야 이해가 더 쉬워지는 개념들 (대칭키
힙에 대해 이전에 공부했었지만, 쓰지 않으면 까먹게 된다. 알고리즘을 풀며 때마침 힙이란 개념을 다시 공부하고 문제를 풀 기회가 생겨 풀며 기왕 공부한 거 정리까지 해보면 좋을 것 같아 정리해보려 한다.이 문제는 제목처럼 최소 힙을 구현하여 풀면 된다.기본적으로 트리의
최근 스터디에서 JWT를 주제로 발표할 기회가 있었다. 이번 기회에 제대로 설명하기 위해 준비했다가, JWT를 더 잘 이해하기 위해선 쿠키나 세션 방식을 알아야 이해가 더 쉬웠다. 그래서 순서대로 정리하며 JWT를 설명하려한다.JWT란 인가(Authorization)에
워터마크에 대한 요구조건이 있었다.1\. videoJS에 워터마크 넣어주세요.2\. 워터마크는 아래 그림처럼 9군데 중 하나를 백오피스에서 설정하면 그 위치에 고정돼야 해요. (원래는 5군데였는데 또 바꿈)3\. 반응형이 되도록 항상 그 위치에 있게 해주세요.(이것도
IOS 기기는 동영상 전체화면 버튼을 클릭하면 IOS 자체 플레이어로 구동된다. 이렇게 되면 기껏 짜놓은 videoJS의 기능들을 사용할 수 없게 되는 크나큰 문제가 발생한다 (!)이를 해결하기 위해 꼼수(?) 와 같은 형태로 문제를 해결했다.IOS임을 detectin
리액트 스터디를 하면서 처음 알았던 부분중에 하나는, map을 돌리는 배열에서 key 값을 주는 게 아닌, 컴포넌트에 key 값을 주어 다른 컴포넌트라는걸 알려주는 방법이였다.(react 공식문서 중)key를 사용해 React가 모든 컴포넌트를 구분하도록 할 수 있습니