반응형

함수 5

[React.JS] 리액트 하위 컴포넌트 함수 호출시 여러번 호출 이슈.

원인은 간단하다. 보통 map 함수로 레이아웃 컴포넌트로 생성된 여러개의 해당 함수를 호출하는데, 이때 특정 event을 하는 함수가 내장되어 있다면 개발자가 보기엔 1개지만, map함수로 호출된 갯수만큼 동일한 이름의 함수가 생성된다. 그러므로 해당 event를 일으키는 것을 외부로 꺼내서 호출하는 방식으로 사용하면 한번만 사용하게 된다. counter 내 increase, decrease 함수가 있다면 map으로 30개를 counter를 복제했을 경우, increase 호출 시 30번 호출하게 되는 것. 그래서 이를 바깥으로 꺼내 counter에서 호출해서 사용하는 방법을 사용하면, 해당 이슈가 해결된다.

취업/React.JS 2023.01.27

[자바스크립트] 화살표 함수의 제약.

this나 super에 대한 바인딩이 없고, methods 로 사용될 수 없습니다. new.target키워드가 없습니다. 일반적으로 스코프를 지정할 때 사용하는 call, apply, bind methods를 이용할 수 없습니다. 생성자(Constructor)로 사용할 수 없습니다. yield를 화살표 함수 내부에서 사용할 수 없습니다. - 출처 - https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Functions/Arrow_functions 화살표 함수 - JavaScript | MDN 화살표 함수 표현(arrow function expression)은 전통적인 함수표현(function)의 간편한 대안입니다. 하지만, 화살표 함수는 몇 가..

[자바스크립트] 화살표 함수 안에서 this 사용하기

$("#test").click(()=>{ let dif=$(this).attr('value'); console.log(dif); }); 위 코드의 결과물은 "undefinded"이다. 왜? 라고 생각할텐데 그 이유는 $(this)가 해당 익명함수를 가르키는 것이 아니라 window 객체를 지칭해버린다. 즉, 저 함수 내부를 지칭하는 게 아니라 함수 밖을 지칭해버림. 그렇기에 이를 해결하려면, $("#test").click(function() { let dif=$(this).attr('value'); console.log(dif); }); 화살표 함수를 지우고 익명함수로 바꿔버리자. 그러면 $(this)가 익명 함수를 읽어버린다. console.log찍어보니 bind가 끊어지는 듯? 그래서 그런 듯 싶다.

[위코드] TIL(Today I am Learned) -31(기업협업)(DatePicker 완성)

- 오늘의 할일. 코드 리팩토링. 기능 구현 상담 후 수정할 것 있는지 확인 후 merge할 것. -코드 리뷰 3일간 날 괴롭히던 datepicker의 기능을 대부분 구현했다. 기존에 하드 코딩으로 2019를 표시했던 것을 이제 자동으로 시간이 지나도 알아서 작동되게 구현하였고, WRDS처럼 2007년 페이지를 기준으로 했던 것처럼, 내가 만든 부분도 13년으로 설정해서 현재는 2007년 내년에는 2008년 내후년은 2009년으로 자동으로 바뀌게 만들었다. 원래 J쿼리로 만들어진 것이라 구현이 매우 빡셌다. 자료도 대부분 J쿼리 전용이라... 이에 참고한 자료가 HackerOne에서 만든 React-datepicker 자료 https://reactdatepicker.com/ React Datepicker..

728x90