프론트엔드18 useEffect에 대하여 useEffect(setup, dependencies?) When your component is added to the DOM, React will run your setup function. After every re-render with changed dependencies, React will first run the cleanup function (if you provided it) with the old values, and then run your setup function with the new values. After your component is removed from the DOM, React will run your cleanup function. dependencies: Reac.. 2024. 3. 13. 클로저 (Closures) 자바스크립트에서 클로저(Closure)는 특정 함수가 자신이 선언될 당시의 환경(lexical environment)을 기억하는 현상을 말합니다. 클로저는 내부 함수가 외부 함수의 스코프에 있는 변수에 접근할 수 있게 하며, 외부 함수가 실행을 마친 후에도 그 변수를 기억합니다. 핵심 포인트는 다음과 같습니다: 함수 내의 함수: 클로저는 일반적으로 내부 함수가 외부 함수의 변수에 접근할 때 생성됩니다. 내부 함수는 외부 함수의 지역 변수에 접근할 수 있습니다. 변수의 지속성: 외부 함수가 실행을 마치고 반환되더라도, 내부 함수는 외부 함수의 변수에 대한 참조를 유지합니다. 이는 내부 함수가 호출될 때마다 해당 변수들이 여전히 사용 가능하다는 것을 의미합니다. 데이터 은닉과 캡슐화: 클로저를 사용하면 다른.. 2024. 3. 12. Critical Rendering Path What's Critical Rendering Path? The Critical Rendering Path is the sequence of steps the browser goes through to convert the HTML, CSS, and JavaScript into pixels on the screen. Why is it important? Optimizing the critical rendering path improves the time to first render. The Rendering Proccess A request for a web page or app starts with an HTTP request. The server sends a response containing th.. 2024. 3. 5. [Lexical Scope] Static Scoping vs. Dynamic scoping JavaScript는 정적 스코핑(static scoping), 또는 **렉시컬 스코핑(lexical scoping)**을 사용합니다 이는 변수가 코드를 작성하는 시점에서의 범위에 따라 결정된다는 것을 의미합니다. 즉, 함수나 블록 내에서 변수를 참조할 때, JavaScript는 해당 변수가 코드 내에서 어디에 선언되었는지에 기반하여 변수의 범위를 결정합니다. (In JavaScript, lexical scope is the concept of determining the scope of a variable based on its declaration. This means that the scope of a variable is determined by the block of code in which i.. 2024. 3. 5. 자바스크립트의 객체참조모델과 가비지콜렉션 1. 자바스크립트의 객체 참조 모델 자바스크립트에서 객체는 참조 타입입니다. 이는 변수에 객체를 할당할 때, 실제 객체 자체가 아니라 객체의 메모리 주소(참조)가 저장된다는 것을 의미합니다. (1) 객체 참조 모델의 주요 특징: 참조에 의한 할당과 전달: 자바스크립트에서 객체를 변수에 할당하거나 함수에 인자로 전달할 때, 실제로 전달되는 것은 객체의 참조(메모리 주소)입니다. 이는 두 변수가 동일한 객체에 대한 참조를 공유할 수 있음을 의미합니다. 공유된 참조: 두 변수가 같은 객체를 참조하고 있을 때, 한 변수를 통해 객체의 속성을 변경하면 다른 변수를 통해 객체를 조회했을 때도 이 변경사항이 반영됩니다. 이는 두 변수가 같은 메모리 위치를 가리키고 있기 때문입니다. 변경 불가능성과 참조: 기본 데이터.. 2024. 2. 27. [WHY] 프론트엔드 개발자가 왜 네트워크 관련 지식을 알아야 할까? 1. 네트워크 환경에서 데이터가 오가는 과정을 이해하는 것이 중요한 이유 문제 해결: 데이터 전송 중 문제가 발생할 경우, 오류를 찾아내고 해결하는 데 도움이 됩니다. 예를 들어, 데이터가 손실되거나 손상될 수 있습니다. 이러한 문제는 대개 데이터가 이동하는 경로를 추적하여 해결할 수 있습니다. 보안: 데이터는 민감한 정보를 포함할 수 있으므로, 데이터가 전송되는 방식을 이해하는 것은 보안 측면에서 매우 중요합니다. 암호화, 인증 및 권한 부여 등의 보안 기능이 데이터 전송 프로세스에 포함될 수 있으며, 이러한 기능을 이해하면 데이터 보안을 강화할 수 있습니다. 최적화: 데이터 전송 프로세스를 최적화하여 더 빠르고 효율적인 데이터 전송을 할 수 있습니다. 데이터가 전송되는 방식, 전송 프로토콜, 데이터의.. 2024. 2. 27. 이전 1 2 3 다음