본문 바로가기

전체 글

 (72)
[JS] Promise Promisepromise는 자바스크립트에서 이전 코드의 처리가 완료되기 전에 다음 코드를 실행하는 '비동기 처리'를 위한 객체이다. 이 비동기 처리의 특성에 의한 문제 중 하나가 이전 코드의 작업의 결과가 준비되지 않아 다음 코드 실행 시에 발생하는 에러이다.이를 해결하기 위한 단순한 방법은 콜백 헬이 발생하는 방법인데, 간단히 소개하자면db.query(query, param, (err, result) => { if (err) //에러 처리 db.query(query2, result.data, (err, result2) => { if (err) //에러 처리 db.query(query3, result2.data, (err, result3) => { if (e..
[JS] 옵셔널 체이닝: "?." 웹을 만들다 보면, 특히 데이터를 다룰때 흔히 볼 수 있는 " TypeError: "로 시작하는 에러가 있다.이 에러는 많은 경우에서 어떤 데이터를 가져올 때 그 값이 ' undefined '이거나 ' null '인 경우에 발생한다. 물론 데이터가 없으면 표현되어서는 안되는 것도 있지만, 종종 데이터가 존재하지 않으면 존재하지 않는 대로 랜더링은 지속해야하는 경우가 있다.그럴때 사용하는 문법이 옵셔널 체이닝, ' ?. ' 이다. const users = [{ name: "홍길동", age: 20 }, { name: "김철수", age: 26 }];const userPh = users[0].ph; //TypeError: Cannot read property 'ph' of undefinedconst use..
[React] filter의 무한루프와 useMemo 데이터를 걸러내어 원하는 데이터로 변환시키기 위해 흔히 사용하는 메서드인 filter() 는const filteredArr = arr.filter(word => word.length === 3);이런식으로 사용한다. 단순히 이렇게만 사용한다면 아무런 문제가 되지 않지만, filter의 결과값이 상태나 props로 사용된다면 문제가 발생한다. 예를들면,const filteredArr = arr.filter(word => word.length === 3);useEffect(() => { ...}, [filteredArr]); 이런식으로 filteredArr이 의존성 배열로 존재하고, useEffect 내부의 내용이 상태를 변화시키는 내용일 경우에 무한루프가 발생한다. 일반적인 useEffect와 그 내부의 ..

티스토리툴바