본문 바로가기
728x90

분류 전체보기153

클로저(2) MDN 공식문서 https://developer.mozilla.org/ko/docs/Web/JavaScript/Closures 클로저 - JavaScript | MDN 클로저는 함수와 함수가 선언된 어휘적 환경의 조합이다. 클로저를 이해하려면 자바스크립트가 어떻게 변수의 유효범위를 지정하는지(Lexical scoping)를 먼저 이해해야 한다. developer.mozilla.org 클로저를 사용하기 위해서는 전역변수 와 지역변수 에 대한 개념부터 알아봐야 한다. 전역변수는 해당 컴포넌트(= 페이지) 안이라면 어디서든 사용할 수 있는 변수를 의미한다. 지역변수는 함수 안에서 정의된 변수로써, 해당 함수 안에서만 사용되는 변수를 의미한다. 이 두 가지 의미를 가지고, 클로저는 내부 함수에서 외부 함수의 지.. 2022. 1. 3.
react-router-dom이 안된다구? npm install react-router-dom yarn add react-router-dom 설치를 했는데도 왜 안되는거야!! 하면서 들어왔다면 npm install react-router-dom@5 yarn add react-router-dom@5 @5를 붙여서 설치해보자~ 2021. 12. 30.
Script - /bin/csh: Event Not Found 스크립트를 사용하여 문자열을 출력하다 Event Not Found라는 에러가 발생한다. 첫열에 #!/bin/csh를 넣었는데 그 다음부터 다시 !가 들어가는 문자열을 echo나 print로 출력하려고 하면 Event Not Found가 발생한다. 해결 방법은 !앞에 역슬래쉬 \를 붙여주면 에러가 발생하지 않고 !도 잘 출력된다. echo 뒤에 "" 대신 ''을 써주면 문자 그대로 출력된다. 2021. 11. 17.
엑셀 다운로드 button안에 onClick={() => this.download()} 넣어주고 클릭할 때 다운로드가 될 수 있도록 download() { const table = document.getElementsByTagName('table')[0]; let tab_text = ''; tab_text += ''; tab_text += ""; let exportTable = table.cloneNode(true); tab_text += exportTable.outerHTML; tab_text += ''; let data_type = 'data:application/vnd.ms-excel'; let ua = window.navigator.userAgent; let msie = ua.indexOf("MSIE "); l.. 2021. 11. 12.
Portal DOM 계층 구조 바깥에 있는 DOM 노드로 자식을 렌더링 하는 최고의 방법 전에 했던 ThankyouDialog.jsx를 사용한다 Open클릭 하하하가 안나오도록 덮어지지 않는다 ThankyouDialog를 마지막에 오도록 내려보면 덮어진다 현재는 한 부모안에서 바꿀 수 있지만 이게 어느 컴포넌트 속에 속에 속에 들어있다면 이 모든 레이어가 이미 순차적으로 갖고 있는 UI의 스택을 벗어나는 일을 할 수가 없다 이럴 때 Portal이 필요하다 다시 하고 html에 root아래 을 적고 root밑에 컴포넌트가 계속 생겼는데 그걸 벗어나는 Portal에다가 이 자녀를 바로 그려버리는 것 Portal을 넣으면 Open이 없다 Dialog버튼에 드래그 되어있는 것을 준다 Open클릭하면 Portal을 주석처리.. 2021. 10. 30.
Memoization, Profiler, useMemo, useCallback 메모이제이션? 메모이제이션은 컴퓨터 프로그램이 동일한 계산을 반복해야 할 때, 이전에 계산한 값을 메모리에 저장함으로써 동일한 계산의 반복 수행을 제거하여 프로그램 실행 속도를 빠르게 하는 기술이다. 결과 값을 계속 가져다가 사용 CommentItem이 없다고 함 불러온다 React.memo 동일한 props로 렌더링을 한다면, React.memo를 사용하여 성능 향상을 누릴 수 있다. memo를 사용하면 React는 컴포넌트를 렌더링 하지 않고 마지막으로 렌더링 된 결과를 재사용한다 이렇게 하면 메모이제이션이 된 것 1초마다 새로운 컴포넌트가 생기게 만들면 여기서 1초마다 계속 생긴다 이게 최적화가 되어 있을까? 를 봐야 된다 여기서 콘솔창에 들어가면 하나씩 추가 되는게 아니라 1 1, 2 1, 2, .. 2021. 10. 29.
728x90