V-logue

Overloading TS에서는 같은 이름의 함수를 다중으로 정의할 수 있고, 각 함수는 서로 다른 타입을 가져야 한다. 이와 같이 같은 이름의 함수를 다중으로 정의하고, 변수의 타입을 달리 정의하는 것을 TS에서 function Overloading 함수 오버로딩이라고 한다. typescript에서 Overload Signature는 overload 함수를 위해서만 사용된다. 실제로 많은 오버로딩된 함수를 작성할 일은 많지 않을 것이다. 그 대신, 대부분의 시간을 다른 사람들이 만든 패키지나 라이브러리 같은 것을 사용할 텐데 이런 패키지나 라이브러리는 Overloading을 매우 많이 사용한다. 그래서 제대로 이해하기 위해서는 Overloading이 무엇인지 이해하고 넘어가야 한다. 앞서서 배운 typ..

호출 시그니쳐(Call Signatures) function add(a , b){ return a + b } 위와 같은 코드가 작성됐을 때 TS는 (parameter) a: any , 'a' 매개 변수는 암시적으로 'any' 형식이지만, 사용량에서 더 나은 형식을 유추할 수 있습니다.ts(7044) 라는 a, b의 argument가 이상하다고 메세지를 보낸다. 그 이유는 아직 a, b의 type이 지정되지 않았기 때문이다. type이 지정되지 않는 argument(인수)는 any타입인데 TS는 any타입을 싫어한다. 위 코드에 타입을 줘야한다. function add(a : number, b : number){ return a + b } 다음은 다른 방법으로 위 코드를 표현해 볼건데, => 화살표 함수를..

Types of TS part Three Typescript에는 매우 독특한 몇 가지 타입이 존재한다." 독특하다고 말하는 이유는 이전 2_3.ts 에서 JS에서도 쓰이는 타입을 다뤘기 때문 number , string, boolean 등... 이제부터 등장할 type은 TS에서만 존재한다. TS의 Type Checker와 잘 소통한다. TS에서 중요한 포인트는 Type Checker와 소통하는 것이다. "unknown" 어떤 타입인지 모르는 변수는 TS에게 어떻게 말해야 하는걸까? 이런 상황일 때는 unknown을 사용하면 된다. let a : unknown; 위와 같이 선언하면 TS로부터 일종의 보호를 받게 된다. 어떤 작업을 하려고 할 때 이 변수의 타입을 먼저 확인하는 방식으로 보호된다. let ..

Types of TS part Two "ReadOnly" TS에는 readonly 속성을 추가할 수 있다. ReadOnly 속성은 요소들을 읽기전용으로 만들 수 있다. JS는 기본적으로 이런 동작이 존재하지 않는다. 하지만, TS에는 이런 동작을 구현하고 싶다면 구현을 도와주는 보호 장치가 존재한다. Player type이 name이라는 속성을 가지는데, 이 요소는 ReadOnly가 될 것이다. type Player = { readonly name : Name, age? : Age } readonly라는 뜻은, 누군가 Player의 name을 수정하려고 시도하면, TS가 수정 하려는 시도를 멈춰준다는 뜻이다. 즉, 수정 불가능하게 읽기 전용으로 만든다. Choi.name = "Kim" name은 읽기 전..

Types of TS part One const player = { name : "nico" } const player : object = { name : "nico" } 예를들어 player 중 전부 name이 있지만, 일부만 age가 있다면 player를 object라고 지정해주면, player.name했을 때 TS는 player에 name이 있는지 읽을 수 없다. player.name 'object' 형식에 'name' 속성이 없습니다. ts(2339) 이럴 때 필요한 것이 object의 타입을 정해주는 것이다. const player : { name : string, age : number } = {} 첫번째 중괄호, player의 타입을 지정한다. name은 String, age는 Number ..

Node로 코드를 짜다보면 은근히 흔하게 볼 수 있는 에러의 종류인데, Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client 에러가 뜨는 원인이 내가 찾은 해답을 제외하고도 또 있을 수 있겠지만, 아마도... 주로... 구글로 찾아보니.. 서버가 클라이언트에게 둘 이상의 응답을 보내려고 할 때 뜨는 에러일 확률이 상당히 높다. router.get('/auth', authMiddleware, async(req, res) => { try { const user = res.locals.user if(user === undefined) { res.status(401).json({ errorMessage: "로그인이 ..

Node와 FE에서 사용자가 이미지를 올리는 방법은 여러가지가 있는데, 개인 서버에 static 폴더를 만들어서 클라이언트로부터 요청받은 파일을 저장하는 방법과 db에 저장하는 방법이 있고, 마지막으로 AWS S3 버킷을 이용해서 이미지 파일을 저장하고 db에 버킷의 경로를 받아서 서버가 이 경로로 클라이언트에 응답하는 방법이 있다. 찾아보니, axios로 form태그를 사용해 이미지를 넘기려면 multer를 사용해야 한다고 하니 어처피 나는 이 multer에 대해서 배웠어야 했다. 이 AWS S3를 사용하면 개인 서버에 저장하는 것에서 고려도는 PC 성능을 고려하지 않아도 되고, 또 이 S3 버킷이라는게 내가 사용하는 만큼 비용을 지불하는 것이기 때문에 비용적인 부담도 줄어들어 아주 효율적인 서버를 구..

Bcrpyt, bcrypt.hashpw(password, bcrypt.gensalt()) bcrpyt는 암호를 해시화 하는데, 도움이되는 라이브러리다. 1999년 USENIX에서 발표된 ..... 암호 해싱 기능이다. 비밀번호 해싱(Password hashing)이란? 유저가 클라이언트에서 입력한 정보가 db에 저장되는데, 비밀번호와 같은 정보는 아주 민감하고 안전하게 다뤄줘야 한다. 만약 유저가 1q2w3e4r이라는 Plain Text를 입력하고, 이대로 Plain Text가 db에 저장된다면 서버 관리자가 알 수 있음은 물론이고 해커마저도 쉽게 알아낼 수 있을 것이다. 바로 이럴때에, 필요한 것이 해싱인데 해싱은 위의 Plain Text를 특정적인 해시화하는 무언가를 사용해 잘게 쪼개고 어렵게 인간이..