일단 시작하고 보자

변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징을 변수 호이스팅이라한다(variable hoisting) 변수 선언이 소스코드가 한 줄씩 순차적으로 실행되는 시점, 런타임이 아니라 그 이전 단계에서 먼저 실행되기 때문에 참조에러가 발생되지 않는다. 변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립 고유의 특징 JavaScript에서 호이스팅(hoisting)이란, 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미합니다. var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화합니다. 반면 let 과 const로 선언한 변수의 경우 호이스팅 시 변수를 초기화하지 않습니다. -MDN- var, 함수 선언문이 호이..

자바스크립트 공부를 하다보면 엔진이라는 말이 자주 나온다 엔진이란? 무언가를 구동하는 것을 이야기하는데 그렇다면 자바스크립트를 구동하기 위해서는 엔진이라는 것도 자연스래 있다는 것을 알 수 있을 것이다. 이때 등장하는게 자바스크립트 엔진과 렌더링 엔진이다. 우선 자바스크립트 엔진에 대해서 먼저 알아보도록 하겠다. 자바스크립트 엔진이란? 앞서 말한 것 처럼 자바스크립트 코드를 실행하는 인터프리터 또는 프로그램이라고 볼 수 있다. 전형적인 인터프리터의 역할 및 JIT 컴파일 활용 및 많은 기능을 하고, 주로 웹 브라우저를 위해 사용된다. 대중적으로 알려진 자바스크립트의 엔진은 구글의 V8이다. Node.js에서 사용되는 엔진이다. 여기서 주의해야할 점은 자바스크립트 엔진이 V8이 아니라, 잘알려진 자바스크립..

자바스크립트를 처음공부할 때 단순히 놓치고 지나갔던 부분이 였던것 같아서, 이번에 복습을 하며 어떻게 HTML 코드에 자바스크립트를 포함해야 할지에 대해서 다시 정리를 해보았다. HTML을 처음 배우고 실습할 때 단순이 head에 스크립트 코드를 입력했었는데, 제대로 실행되지 않을 때도 있었고, 그래서 body 태그 맨 뒤에 스크립트를 넣었는데, 유일한 해결법이 아니라 더 효율적인 해결법이 있다는 것을 알았을 때는 매우 놀랐었다. HTML에 스크립트 코드를 삽입하는 방법을 크게 4가지로 나누어 알아보도록 하자. 1. 안에 자바스크립트는 parser blocking resource(파서 차단 리소스)이다. asynce, defer 모두 사용하지 않은 기본 모드로 브라우저는 문서를 파싱해 읽다가 자바스크립트..

DOM과 BOM에 대해서 알아보기 전에 큰 그림을 먼저 보고 가도록 하자 문서객체모델(DOM, document object model) html, XML 문서의 프로그래밍 interface이다. DOM은 문서의 구조화 된 표현을 제공하며 프로그래밍 언어가 DOM 구조에 접근 할 수 있는 방법을 제공하여 그들의 문서 구조 및 스타일, 내용 등을 변경할 수 있게 돕는다. 웹페이지는 일종의 문서이다. 이 문서는 웹브라우저를 통해 그 내용이 해석되어 웹브라우저 화면에 나타나거나 html 소스 자체로 나타나기도 한다. DOM은 웹페이지의 객체 지향 표현이며, 자바스크립트 와 같은 스크립팅 언어를 이용해 DOM을 수정 할 수 있다. 브라우저 객체 모델(BOM,Browser Object Model) 브라우저와 상호작..

ECMAScript란? JS의 표준 사양인 ECMA-262를 말함 프로그래밍 언어의 값, 타입, 객체와 프로퍼티, 함수, 객체 등의 핵심 문법을 규정 각 브라우저는 ECMAScript 사양을 준수해 브라우저에 내장되는 JS 엔진을 구현 브라우저: DOM API를 기본적으로 제공, 클라이언트 사이드 Web API를 지원한다. node.js: 파일 생성, 수정이 가능한 파일 시스템을 기본 제공, 클라이언트 사이드 Web API를 지원하지 않고, ECMASript와 node.js 고유의 API를 지원한다. *클라이언트 사이드 Web API: DOM, BOM, Canvas, XMLHttpRequest, fetch, SVG, Web Storage, Web Component, Web Worker ...

자바스크립트 공부했던 내용들을 다시 복습겸 블로그에 포스팅을 해봐야 겠다! 웹 브라우저에서 동작하는 유일한 프로그래밍 언어 개발자가 별도의 컴파일 작업을 수행하지 않은 인터프리터 언어 명령형, 함수형, 프로토타입 기반 객체지향 프로그래밍(객체지향 프로그래밍 능력을 가짐)을 지원하는 멀티 패러다임 프로그래밍 언어 *프로토타입 기반 객체지향 프로그래밍: 클래스 기반 언어에서 상속을 사용하는 것과는 다르게, 객체를 원형(프로토타입)으로 하여 복제의 과정을 통해 객체의 동작 방식을 다시 사용할 수 있다.(=클래스리스, 프로토타입 지향, 인스턴스 기반) *다중 패러다임 프로그래밍 언어: 하나 이상의 프로그래밍 패러다임을 지원하는 프로그래밍 언어 *프로그래밍 패러다임: 간단하게 프로그래밍 스타일을 의미하며 전체적인..

저번 간단하지만 헷갈리는 개념들(클래스, 객체, 인스턴스)에 이어 이번에는 매개변수(parameter)와 인자(arguments)에 대해서 알아보려 한다. 매개변수(parameter) 함수를 정의할 때 사용되는 변수 ( = 인자) 인수(arguments) 실제로 함수가 호출될 때 넘기는 변수값 결론! 영어로는 확실히 구분이 되는데 한글로는 비슷하게 생겨서 헷갈릴 수도 있는데 이 부분을 주위해서 기억하면 어려운 개념은 아닌것 같다 !

이전에 노션에 작성했던 글들을 복습하며 노션에만 남겨두기 아쉬워, 작성 했던 글들을 블로그에 업로드 하려 한다. 쉬운내용이지만, 나뿐만 아니라 다른 개발자들도(?) 간간히 헷갈릴 때가 있을 것이라 생각되어 '클래스', '객체', '인스턴스' 에 대해 알아보려 한다. 클래스 객체를 정의하고 만들어 내기 위한 설계도 혹은 틀 클래스 안에는 객체를 만들어내기 위해 필요한 변수와 메서드들이 존재 객체 클래스에 선언된 모양 그대로 생성된 실체를 말하며 ‘클래스의 인스턴스’라고 한다 인스턴스 클래스를 통해서 구현된 대상(객체)이 실제로 구현된 구체적인 실제 즉, 객체를 소프트웨어에 실체화 하면 그것을 ‘인스턴스’라고 부른다. 실체화된 인스턴스는 메모리에 할당된다. 예를들어 붕어빵을 만든다고 상황을 가정해보자. 여기..