상상코딩

JS는 싱글스레드 프로그래밍 언어이다. 싱글스레드는 한번에 하나의 일을 처리할 수 있는데, 이는 앞단의 작업이 끝날때 까지 어떤 작업도 수행할 수 없음을 의미한다. 이를 극복하기 위해 웹 브라우저를 포함한 다양한 JS 실행환경에서 비동기 방식으로 처리하기 위한 매커니즘을 제공한다. 그렇다면 JS를 동적으로 사용하기 위해서는 어떻게 해야할까? 비동기 처리 방식(Asynchronous) 비동기 처리 방식은 작업의 요청과 결과가 동시에 일어나지 않는 방식을 말한다. JS의 비동기 처리 방식은 아래와 같이 구현할 수 있다. function func1() { setTimeout( () => { console.log( 'func1' ) }, 10000 ); } function func2() { setTimeout(..

웹 브라우저는 url을 통해 서버에 요청을 하고 그에 따른 HTML응답을 받는다. 응답받은 HTML은 웹 페이지를 구성하는 여러 정보가 포함되어 있는데, 웹 브라우저는 어떤 과정을 거쳐 HTML을 웹 페이지로 표현하는지에 대해 정리한다. CRP(Critical Rendering Path) HTML은 웹 페이지를 구성하는 각 요소에 대한 정보와, CSS, JavaScript에 대한 정보를 포함하고있다. 하지만 그 내용은 평소 보던 웹 페이지와 많이 다르고 정보를 확인하기 어렵다. 또한 Javascript를 실행할 수 없기 때문에 HTML에 Javascript를 통해 구현한 여러 기능을 사용할 수 없다. 따라서 웹 브라우저에서 HTML을 웹 페이지로 변환하게 되는데, 이 과정을 CRP(Critical Ren..

웹 브라우저는 웹 페이지를 표현하기 위해 다양한 정보를 필요로한다. 웹 페이지를 표현하기 위해 웹 브라우저는 어떤 정보를 관리하고 있는지에 대해 정리한다. BOM BOM(Browser Object Model)은 웹 페이지가 구성되어있는 객체 모델들을 말한다. 웹 페이지를 구성하는 최상위 객체인 window객체 아래 document, screen, location 등 많은 객체 모델을 통틀어 BOM을 구성하는 객체 모델인 것이다. window window 객체는 웹 페이지를 구성하고 있는 모든 객체를 포함하는 최상위 객체이다. window 객체는 alert, prompt 등의 메소드를 내포하고 있으며 DOM, screen, location, JS Core등이 포함된다. 이러한 window 객체는 활성화 된..

자바스크립트에는 배열과 유사배열이 있다. 이 둘의 차이와 목적에 대해 알고 사용하는게 좋을것 같아 정리한다. 배열(Array) 자바스크립트에서 배열이란 관련 있는 데이터를 하나의 변수에 할당해 관리하기 위해 사용하는 데이터 타입이다. 자바스크립트는 명시적 타입이 없기때문에, 하나의 배열은 여러 자료형을 가질 수 있는 특징이 있다. 배열을 사용하면 여러 데이터를 관련성 있게 관리할 수 있기 때문에 생산성 및 코드 가독성이 높아지고 이는 유지보수 비용의 감소로 이어진다. 이 외에도, 배열에서 기본으로 제공하는 함수를 사용할 수 있는 점, 데이터에 순차적으로 접근이 가능하다는 점 등을 비롯해 장점이 아주 많다. JS(JavaScript)에서 배열을 사용하는 방법은 아래와 같다. // array 배열 선언 //..