분류 전체보기 118

Boolean

불리언타입에 대해 조금 더 공부를 해봤다. 기존에 내가 알고 있던 boolean이라고 한다면, 단순히 true / false 로 알고있었고조금 더 나아가면 0(false) 과 1(true) 이였다.그러다 문득 boolean타입에 대해 조금 더 알고싶어져서 mdn 사이트를 보며 새롭게 안 내용들을 정리해보려한다.우선 mdn에서는 boolean에 대해 이렇게 설명하고있다.여기에서도 보면 알수있듯이 false의 경우에는 0 이외에도 음수인 -0과 null,Nan,undefined 그리고 빈 문자열("") 또한 false가 된다는것을 알수있다. 대충 null 또는 Nan, undefined는 false일 것 같다는 느낌이 오지만 빈 문자열 또한 false가 된다는 사실을 처음접했다.실제로 테스트를 해본다면con..

리액트 2024.12.13

파라미터 함수전달과 함수호출의 차이

하나의 함수에는 여러 인자들을 받을 수 있다. 그중에서도 인자에 함수를 전달 할 수도 있는데평소 습관적으로 인자에 함수를 전달을 할 때에는, 그 함수가 가지고 있는 인자들도 전달하려는 곳에서 같이 전달하였는데이것은 함수를 전달하는것이 아닌 그 함수를 호출한 값을 전달하는 거였다. 말보다는 아래의 예시를 통해 이해하는것이 좋을 것 같다예시 function sum(a,b) { return a + b; } // a와 b를 더한 값을 return하는 sum 함수이렇게 a+b의 값을 반환하는 sum함수가 있고 function test(param) { console.log(param); }test의 함수에서는 param 이라는 인자를 받고있다. 여기에서 test함수를 ..

리액트 2024.12.11

Async / await

저번에는 Promise에 대해 공부를 해봤다면 이번에는 좀 더 편하게 처리를 할 수 있는 async/await에 대해 공부해봤다.우선 Promise를 통해 적어본다면fucntion user(){ return new Promise((resolve,reject)=> { resolve('Hello') })}const result = user()result.then(console.log)// 'Hello' 출력이렇게 될 것이다. 하지만 이보다 더 편하게 할 수 있는 방법이 있는데 그것은 함수앞에 async를 적어주는 것이다.async fucntion user(){ return 'Hello'}const result = user()result.then(console.log)// 'Hel..

리액트 2024.12.10

Promise에 대해

api와 소통하기 위해서는 비동기처리에 대해 알아야한다. 그래서 오늘 공부해본 Promise에 대해 글을 적어보려한다.우선 Promise는 Class이기 때문에 new 키워드를 통해 만들 수 있다.그리고 Promise의 생성자를 보면executor 콜백함수를 받게 되어있다. 이 콜백함수에는 성공했을 때의 resolve와 실패했을 때의 reject가 있다.아래의 예시를 살펴보자.const promise = new Promise((resolve,reject) => { setTimeout(()=> { resolve('Hello') })})라고만 적는다면 아무 일도 발생하지 않을 것이다. 왜냐하면 성공했을 때의 요청을 처리하는 로직이라던가 에러가 생겼을 때 핸들링하는 로직이 없기 때문에아..

리액트 2024.12.09

Math.min / max

Math함수에서의 min 과 max 를 사용하면서 알게 된 사실이 있는데 숫자에만 사용 할 수 있을 것 같았던 이 함수는문자열에도 적용이 된다는 것이다. 예시를 통해 설명하고자 한다.const test = ()=> { const numList = [1,2,3,4,5] console.log(Math.max(...numList)) // -> 5} 이렇게 test 함수에는 numList라는 변수안에 배열의 숫자값들이 할당되어 있는 것을 볼 수 있다.그리고 스프레드연산자를 통해 그 중 max 값인 것을 출력하고 싶다면 위와 같이 할 수가 있다. 숫자만 인식할 줄 알았던 이 함수가문자열도 인식 할 수 있다는거에 놀라웠다. 다음 아래는 문자열 예시를 설명해보겠다. fucntion test (str) { ..

리액트 2024.12.08

String.legnth 에 대하여

최근에 기본 문법부터 다시 공부하고자 여러 메서드를 사용하고 있다. 그 중 반복이 필요한 부분은 보통 map을 통해 처리를 했지만 가장 원시적인 방법으로 for문을 주로 사용해 처리를 하려고 한다. 그 중 몰랐다면 몰랐을거고 쉽게 노쳤던 부분을 적어보려고 한다. function str(param) { let res = 0; for (let i = 0; i  보통이라면 이렇게 str이 가진 값들을 다 더하는 반복문을 돌렸을텐데, 콘솔을 보면 "undefined" 가 나오는 것을 볼 수 있다.이러한 이유가 나오는데 까지 30~50분정도 걸렸던것 같다. 결국엔 알고나면 당연한 것들인데...알아채기 전까지의 과정이 고통스러웠던것 같다.  위와 같이 undefined가 나온 이유는 보통 길이를 재려고 ..

리액트 2024.11.26

for문 이해하기

오늘은 원초적으로 돌아가 for문을 사용하는 연습을 했다.내가 아는 for문의 형식은 이렇다.for (let i = 0; i 초기 설정과 조건식, 증감식 이렇게 구성되어있다는 건 알고 있었다. 그리고 프로그래머스 문제를 풀며 reduce를 통해 해결 하였는데 이 문제를 for문을 통해 풀려니 생각보다 시간이 엄청 걸렸다. 그 이유는 for문을 제대로 이해하지 못하고 reduce라는 함수를 외워서 썼다는 말 밖에 되지 않기 때문이다.. 이것도 사실 정답이다. 그래서 가장 기본적인 반복문의 for문을 연습하려고 코테문제와 비슷하게 연습을 했다. 조건은 아래와 같다.fucntion prac(str) {}prac('4141321')// prac이 가지고 있는 값들을 다 더해야한다 --> result : 16 우..

리액트 2024.11.26

React find Method

모의 프로젝트를 만들면서 구성한 디렉토리구조는 다음과 같다. src폴더안에 component라는 폴더를 만들고 목적에 맞는 list라는 폴더안에 별도로 api / react-query / view를 담당하는 component 이렇게 만들었다. 그리고 난 뒤에 api부분에는 실제 api를 붙이지않고 더미데이터를 만들어 처리 했다.우선 구조를 살펴보면 listApi 라는 객체를 만들어 각각에 필요한 것들을 외부에서 꺼내서 사용할 수 있도록 설계하였다.각각의 메서드들에 맞는 useQuery를 만들어 준 뒤에 성공을 했을 때 보여주는 view컴포넌트에 가보면 props를 준 다음 전체 게시글을 가지고 오는 데이터들을 조회 해봤을 때, 아래와 같이 나오는 것을 볼 수 있다. 그런데 사실 css적인 요소를 다 빼고..

리액트 2024.11.25

Error: connect ECONNREFUSED 에러

[문제 정의]MSA-monorepo 형식으로 처음 작업을 하면서 member서버와 main서버를 키고 기능구현 테스트를 하려고 했다.그리고 포스트맨을 통해 요청을 했더니 터미널에 아래와 같이 오류가 발생했다.Exception Error: Connection closed at ClientTCP.handleClose (/Users/shimjaedoo/Desktop/Study/MSA-monorepo/node_modules/@nestjs/microservices/client/client-tcp.js:102:25) at Socket. (/Users/shimjaedoo/Desktop/Study/MSA-monorepo/node_modules/@nestjs/microservices/client/client-..

카테고리 없음 2024.05.12