JAVASCRIPT

호이스팅이란?호이스팅이란 사전적 의미로 끌어 올리기라는 의미입니다. 자바스크립트에서도 코드를 실행하기 전에 함수, 변수, 클래스 또는 import의 선언문을 해당 범위의 맨 위로 끌어올리는 현상입니다.변수 호이스팅변수는 var, let, const로 선언하는데 호이스팅되는 방식이 다릅니다. 변수의 생성과정은 선언 단계, 초기화 단계, 할당 단계 3가지입니다.var: 호이스팅과 동시에 undefinde로 변수를 초기화let, const: 선언 자체는 호이스팅은 되었지만 초기화가 되지 않으므로 초기화 전에 호출하게 되면 TDZ라는 일시적인 사각지대에 존재하기 때문에 참조에러가(ReferenceError) 발생console.log(a); // undefinedvar a = 1;console.log(b); //..

쿠키와, 로컬스토리지, 세션스토리지세개 모두 웹 브라우저에서 데이터를 저장하는 기술로 각각의 목적과 사용 방식이 다릅니다.Cookie클라이언트와 서버 간의 통신에 이용되는 정보사용자 정보, 특정 값 등등http 요청 시 Header에 담아서 보냄쿠키정책을 서버, 클라이언트 모두 설정 가능 (단 클라이언트에서 설정 시 제한적)설정된 만료 시간에 따라 쿠키 유지 기간을 제어할 수 있음이용 예시자동 로그인팝업 등 이벤트 성 UI 비노출 기간을 설정 가능다크모드, 언어 등 사용자 설정을 저장보안 및 주의사항XSS(Cross-site Scripting) 악성 스크립트가 브라우저에서 실행되어 쿠키 데이터 읽기 가능하거나 인증 토큰이나 세션 쿠키 탈취 가능하다. 해당 기능에 대해 대처하기 위해 HttpOnly속성을 ..

자바스크립트의 Proxy객체란?프록시의 사전적 정의는 "대리인", "대리"라는 뜻이다. 자바스크립트에서도 뜻 그래도 대리인의 역할을 해주는데 객체의 여러 동작을 가로채(트랩) 다시 정의하는것을 뜻합니다. 해당 기능은 ES6에 새로 추가되었습니다. Vue 2.x 버전에서 객체의 수정 및 삭제를 Object.defineProperty의 getter와 setter를 사용하여 구현하였지만 프로퍼티 변경 시 추적이 어렵다는 이유로 Vue 3.x 부터는 Proxy를 도입했습니다.사용법target은 Proxy의 대상이 되는 객체handler는 대상이 되는 객체의 여러 트랩을 정의const proxy = new Proxy(target, handler);트랩 핸들러 종류객체의 속성 트랩 메서드메서드작동 시점get속성을 ..

setInterval과 requestAnimationFrame의 차이두 메서드보다 자바스크립트 내에서 반복 작업을 실행할 때 사용되는 주요 메서드입니다. 그러나 둘은 동작 방식, 성능, 사용 목적이 다릅니다.setInterval지정된 시간 간격마다 콜백 함수를 반복 실행하는 메서드고정된 간격: 일정한 시간 간격마다 콜백 함수 실행타이머 지연: 브라우저가 많은 작업을 처리하고 있을 때 타이머가 딜레이 될 수도 있다CPU 사용: 브라우저가 바쁘거나 해당 브라우저 탭을 비활성화 하더라도 계속 작동사용 용도: 주기적으로 특정 작업 실행 (서버 폴링, 시계 업데이트) 주로 데이터 처리 & 작업에 용이함setInterval(() => { console.log("1초마다 실행");}, 1000);requestAni..

자바스크립트의 언어 특성자바스크립트는 싱글 스레드 언어이면서 논블로킹 언어입니다. 싱글스레드란 한 번에 하나의 작업만 처리할 수 있다, 즉 일하는 사람이 1명이라는 이야기입니다. 하나의 콜 스택을 가지고 있으면서 이 스택에서 하나하나씩 처리를 합니다. 두 개의 이상의 작업을 동시에 처리할 수 없으며 하나의 작업이 완료되어야 다음 작업을 수행합니다. 하지만 자바스크립트는 비동기 작업을 통해 여러 가지 일을 수행할 수 있게 됩니다.싱글스레드인데 동시에 다른 작업을 할 수 있는 이유 (Non-blocking)비동기 방식을 통한 긴 작업을 하는 동안 짧은 작업들을 같이 처리합니다. (ex: 파일 다운로드, 네트워크 요청)자바스크립트 엔진은 메모리 힙(우리가 만든 데이터가 저장되는 공간), 콜 스택을 가지고 있습..

자바스크립트는 기본적으로 인터프리터 언어로 분류되지만 현대 자바스크립트 해석 엔진(V8 엔진 등)에서 컴파일이 되는 언어이다. 전통적으로 인터프리터 방식으로 동작하였지만 자바스크립트 실행 성능을 높이기 위해 Just-In-Time(JIT) 컴파일을 사용한다. 이 방식은 실행 중에 필요한 부분만 바이트코드나 기계어로 컴파일 된다. 예를 들면 console.log(); 와 같은 코드는 컴파일이 필요하지 않다.인터프리터 언어란? (Interpreter Language)코드를 작성하면 한 줄씩 읽고 즉시 실행하는 언어컴파일 과정이 없으며 코드가 작성되면 바로 실행 가능코드 실행 중에 발생하는 오류를 즉시 확인 가능코드가 실행될 때마다 매번 해석을 해야하기 때문에 컴파일된 언어에 비해 실행 속도가 느릴 수 있다컴..