본문 바로가기

전공공부213

JavaScript 엔진과 동작원리 JS의 엔진JavaScript 엔진이란 JavaScript를 실행하는 프로그램 또는 인터프리터주요 엔진 종류V8(Chrome, Node.js)구글에서 개발한 오픈소스 엔진C++로 개발된 빠른 실행속도와 높은 성능을 가진 엔진-> 속도향상을 위해 인라인 캐싱 등 최적화 기법을 사용주로 Chrome 브라우저나 Node.js 런타임 환경에서 사용안드로이드 브라우저에도 탑재되어있음SpiderMonkey(FireFox)Mozilla에서 개발한 엔진최초의 JS엔진으로 안정성과 호환성에 중점을 둔 엔진주로 Firefox 브라우저에서 사용JavaScriptCore(Safari)Apple에서 개발한 엔진, MacOS 및 IOS 환경의 Safari 브라우저에서 사용그외에도 Chakra(Microsoft), Hermes(R.. 2025. 3. 31.
Command 패턴 Command 패턴행동 패턴(Behavioral Pattern) 중 하나로 객체가 자신의 역할을 깔끔하게 수행할 수 있도록 도움기능을 캡슐화 해서 작업(행동)을 규격화 하는 것왜 사용하는가?어떤 객체 A에서 객체 B의 메서드를 실행할 경우 객체 B에 대해 의존성이 발생한다.B의 기능이 수정될 경우 A도 수정이 필요할 수 있다.하지만 커맨트 패턴을 사용하면 B에 대한 의존성을 제거할 수 있다.예시만약 그림판 기능을 만든다고 생각해보겠다.그림을 그리는 사용자 User 클래스, 그림판 Board 클래스, 연필 Pencil 클래스가 있다고 한다.이 코드를 작성하면 아래와 같을 것이다.public class Pencil { public void drawPencil() { System.out.pr.. 2025. 3. 29.
프론트 버블링에 대하여 아래 코드에서 우리는 em부분을 클릭해도 div에 할당된 핸들러가 동작한다.이것은 어떻게 가능한 것인가?``` EM을 클릭했는데도 DIV에 할당한 핸들러가 동작합니다.```바로 버블링이 발생하기 때문이다### 버블링버블링이랑특정 화면 요소에서 이벤트가 발생했을 때이벤트가 더 상위의 화면 요소들로 전달되어가는 것이다.마치 vue에서 emit을 통해 부모 컴포넌트로 이벤트를 발생시키는 것과 비슷한 개념 같다.한 요소에서 이벤트가 발생하면이 요소의 이벤트 핸들러가 동작하고 부모의 핸들러가 동작한다.이 과정을 최상위 요소를 만날 때까지 반복한다. 부모요소 자식 요소이런 구조에서 p를 클릭한다면p의 핸들러를 동작하고 부모인 div의 핸들러를 동작하게 된다.따라서 p alert가 동작하고.. 2024. 12. 12.
자바스크립트 변수 호이스팅이란? 호이스팅인터프리터가 코드를 실행하기 전에 함수, 변수, 클래스 또는 import의 선언문을 해당 범위의 맨 위로 끌어올리는 것처럼 보이는 현상var 변수 호이스팅아래 javascript 코드를 vs에서 실행하면console.log(a)var a = 10console.log(a)원래라면 a는 참조오류가 나야한다.하지만 결과로 나온다.왜? 그럴까?javascript가 해당 코드를 실행할 때 변수 호이스팅이 발생하여변수 선언문을 최상단으로 보낸다.var aa = undefinedconsole.log(a)a = 10console.log(a)결과적으로 이렇게 변환해서 실행하기 때문에 오류가 나지 않고 undefined가나타나는 것이다.let 변수 호이스팅여기서 var가 아니라 ES6부터 등장한 let으로 선언하면.. 2024. 11. 25.