개발/💡 TIL

클로저는 함수와 함수가 선언된 어휘적 환경의 조합을 의미한다!  하지만, 클로저는 for (var i = 0; i   만약 다음과 같이 반복문 안에서, 1초 간격으로 i를 출력하려 했을때 결과는 어떻게 될까?  0부터 시작해 반복문을 돌게 되면서, 1초 간격으로 console 출력값으로 0, 1, 2, 3, 4 를 차례대로 출력하는 것을 예상하겠지만, 결과적으로는 그렇지 않는다.    다음과 같이, 1초마다 숫자 5가 찍혀서 총 다섯번의 5가 출력되는 것을 알 수 있다.  반복문의 흐름을 생각해본다면 아래와 같이 그 과정을 나눠볼 수 있는데, 0setTimeout(() => console.log(i), 0 * 1000); → 즉시 실행1setTimeout(() => console.log(i), 1 * 1..

🔹 단방향성과 JSX리액트의 장점에 대해 묻는다면, 가상돔과 `batching`을 통한 효율적인 상태 관리를 들 수 있겠는데그외에도 react 딥다이브를 읽다가 생소했던 부분, 그리고 알고 있지만 면접에서 `그래서 react가 왜 좋아서 쓰는데요?` 라는 물음에 대답하면 좋을 내용이 있어서 기록하고자 한다. 그동안, `react`의 장점을 언급하기 위해, `vanilla js`와 이를 비교하는 식으로 다뤄왔는데 `Angular`와s 붙여 생각해보고자 한다. 📍 단방향 바인딩을 하는 `React`단방향 바인딩은 말그대로 `데이터의 흐름이 방향`으로 흐른다는 말이다.특히, 리액트의 경우, 상태변화가 `단방향`으로 `명시적`으로 이뤄지기 때문에 부모 -> 자식으로 데이터가 흐르는 경향이 있다. 이때는 `p..

🔹 Link 목록 페이지에서 카드 컴포넌트를 눌렀을때 세부 페이지로 이동 시키는 경우, nav 바에서 로그인이나 회원가입 등 특정 페이지로 이동 시키는 경우 등 .. 그동안 한 페이지에서 -> 다음 페이지로 이동시킬때 `Link` 태그를 이용해왔다. 하지만 내부 동작 및 속성에 대해 자세히 알고 쓰지 못했기에 더 공부해보고자 한다. 📍 `Link` 태그에 대해서`react-router-dom` 에서 제공하는 태그로, 웹 내에서 페이지간에 네비게이션을 처리하는 컴포넌트이다. 기본적으로 `` 태그와 유사한 역할을 한다. 정확히는 `` 태그의 성질을 확장한 구조인데 이는 후술하도록 하겠다. (HTMLAnchorElement 와 관련하여) 그럼 `` 를 쓰지 왜 `Link`를 따로 만들었나?`` 는 전체 페..