본문 바로가기

개발공부/Javascript

(11)
[JS] JavaScript 프로젝트에서 스타일 설정 방법 3가지 코드 예시 1. 인라인 스타일 app.style.background = '#000'; app.style.setProperty('background', '#f00'); cssText는 기존에 설정된 inline이 날아감 app.style.cssText = ` background: #fff; max-width: 500px; width: 100%; margin: 100px auto; padding: 20px; border-radius: 6px; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); `; app.style.removeProperty('box-shadow'); 2. 스타일 시트 document.styleSheets[0].insertRule(` #app { background: #f..
[JS] 실행 컨텍스트 실행 컨텍스트란? 자바스크립트 엔진이 코드를 실행하는데 사용하는 내부 매커니즘이다. 이 컨텍스트는 실행되는 코드에 대한 환경 정보를 포함한다. 변수, 함수 선언, this의 값 등의 스코프 값 정보가 포함된다. 실행 컨텍스트가 활성화 되는 시점에 호이스팅, 외부환경, this값 등을 설정한다. 전역 실행 컨텍스트 js 코드가 실행될 때 생성되는 가장 기본적인 실행 컨텍스트로 전역 함수와 변수를 포함한다. 글로벌 실행 컨텍스트에 대한 예시 코드이다. let globalLet = 'Hello World'; // 전역 변수 function globalFunction() { // 전역 함 return 'Hello Global Function'; } 객체 형식으로 글로벌 실행 컨텍스트 구조를 표현해 보면 다음과 ..
[JS] 클로저 클로저는? 정의) A closure is the combination of a function bundled together (enclosed) with references to its surrouding state (the lexical environment). 함수가 선언될 당시의 Lexical Environment의 상호 관계에 따른 현상. 비공개 변수를 가질 수 있는 환경에 있는 함수가 클로저이다. 외부 변수를 기억하고 이 외부 변수에 접근할 수 있는 함수이다. 클로저는 열린 변수식을 닫힌 변수식으로 변환해준다. 외부 스코프의 변수에 접근해서 그 변수가 가비지 컬렉션의 대상에서 제외 되도록 한다. 즉, 함수의 실행 컨텍스트가 종료되어도 해당 변수를 계속 참조할 수 있게 해준다. 클로저는 내부 함수..