목록언어/JavaScript (6)
우당탕탕
BF캐시(bfcache) BF캐시 (Back Forward Cache) bf캐시란 브라우저에서 발생하는 최적화 기능으로 브라우저의 뒤로 가기 버튼, 앞으로 가기 버튼을 눌렀을 때 화면을 바로 보여주는 역할을 한다. bf캐시는 자바스크립트를 포함하여 페이지 전체를 캐시로 저장해버리는 기능을 가진다. 이러한 기능은 화면을 빠르게 보여줄 수 있는 기능을 제공하지만, js가 다시 로드되어 동작을 해야 하는 페이지에서는 문제가 발생한다. 이를 해결하기 위해서는 아래와 같은 방법들이 존재한다. 1. html로 브라우저 캐시를 초기화하는 방법 head사이에 meta태그를 추가하여 해결하는 방법이다. # 지정일까지 캐싱 비활성화 # 캐시된 페이지를 삭제하는 시간 # 캐시 비활성화 HTTP 1.0 # 캐시 비활성화 HT..
',"와 `의 차이 자바스크립트 코드를 보다 보면 따옴표와 백틱을 많이 보게 된다. 따옴표 하고 백틱을 언제 사용해야 하고 차이는 무엇일까? 보통 스트링(String) 값을 선언할 때 따옴표를 아래와 같이 많이 쓴다. ( 백틱은 숫자 1번 왼쪽 물결 표시 키이다 ) // 큰 따옴표 let temp = "Hello World" // 작은 따옴표 let temp2 = 'Hello World' // 백틱 let temp3 = `Hello World` 위의 코드에서는 큰 따옴표, 작은따옴표로 스트링 값을 선언한 것인데 JS에서는 차이가 없다. 그럼 `(backtick)백틱은 차이가 있을까? 백틱 백틱의 경우 ${}를 통해 변수를 넣어 사용할 수 있는데 이를 템플릿 리터럴이라 부른다. ( ES6 이후 ) 한번 아..
이벤트 버블링과 이벤트 캡처링이란? 이 글은 이벤트 JS에서 이벤트 버블링과 이벤트 캡처링에 대해 설명한다. 이벤트 버블링과 캡처링 모두 계층적으로 짜여있는 HTML 요소에 이벤트가 발생할 때 나타나는 연쇄반응을 칭한다. 해당 반응이 발생하는 방향에 따라 버블링과 캡처링으로 나뉜다. 말로보면 어려우니 아래 그림과 코드를 통해 알아보자 이벤트 버블링 아래와 같은 코드가 있다고 가정해보자 클릭해! 브라우저는 이벤트가 발생하면 그 이벤트를 최상위에 있는 요소까지 이벤트를 전파시키는 특성이있다. 해당 코드에서 p 태그인 "클릭해!"를 누르게 되면 처음으로 알럿 창인 "p"가 뜨게 된다 이후 "div"와 "form"이 순차적으로 출력되며 총 3개의 알럿 창이 뜨게 된다. p태그만 클릭하였지만 div와 form요소..
일급 객체란 무엇인가? 자바스크립트로 개발을 하다 보면 일급 객체와 일급 함수라는 말을 많이 듣는다. 일급 객체란 뭘까? 일급 객체(First Class Object) 일급 객체란 다음과 같이 설명할 수 있다. 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가리킨다. 보통 함수에 매개변수로 넘기기, 수정하기, 변수에 대입하기와 같은 연산을 지원할 때 일급 객체라고 한다. - 출처: 위키 설명이 어렵다면 일급 객체의 특징을 아래의 예시로 한번 보자 1. 변수(variable)에 담을 수 있다 let mozzi = function() { return "HelloWorld"; } console.log(mozzi()); 변수 mozzi의 경우 HelloWorld가 출력된다. 2. 파라미터로 ..
호이스팅이란? 호이스팅(Hoisting) JavaScript로 개발을 진행하다 보면 호이스팅이라는 말을 들어본 경험이 있을 것이다. 보통은 호이스팅이라 하면 코드가 실행되기 전에 함수, 변수의 선언을 맨 위로 끌어올린다고 설명한다. 하지만 실제로 끌어올리는 것은 아니다. 호이스팅이란 간단하게 말하면 아래와 같이 말할 수 있다. 호이스팅이란 코드가 실행되기 전에 변수 및 함수에 대한 메모리를 설정하는 것이다. 역시 말로만 보면 이해하기 어려울 수도 있으니 밑에 예시 코드를 통해 확인해보자 function hoist(a) { return a+1 } var hoistV = "var hoist" const hoistC = "const Hoist" let hoistL = "let Hoist" 처음 코드가 실행되기..
V8 엔진이란 무엇인가? 어느 날 면접 질문으로 V8엔진에 대해 질문이 들어온 적이 있다. 처음 V8엔진을 들었을 때에는 자동차 엔진인가? 밖에 생각이 들지 않았지만 이후 자바스크립트 엔진인 것을 알게 되었다. V8 엔진이란? V8은 Google Chrome과 Node.js 에서 사용되고 있는 구글에서 제작된 자바스크립트 엔진이다. 이는 C++로 작성되었고 다중 스레드 방식을 사용하며, 환경과 상호 작용하고 프로그램을 실행하기 위한 바이트 코드를 생성하는 역할을 한다. ( 초기의 V8은 웹 브라우저의 성능 향상 메커니즘으로 도입되었다. ) 다른 엔진보다 왜 V8인가? V8엔진과 다른 엔진의 차이점으로는 JIT( Just In Time ) 컴파일러이다. JIT 컴파일러는 런타임에 모든 JavaScript를..