JavaScript

Constuctor 는 생성자 라는 이름으로 일반적으로 불린다. 이러한 생성자는 다양하게 필요할 경우가 많다. 같은 기능을 하는 여러개의 메서드를 객체화 하거나 메서드의 인자가 각각 다르게 필요할 경우 파라미터를 정의하고 생성자를 이용하여 각각 다르게 초기화 할 수 있

Prototype은 (원형) 이란 뜻이며, 자바스크립트의 중고급 수준까지 올라가기 위해 필수적인 문법이다. 이러한 Prototype을 이용하여 재사용성이 높은 코드를 작성할 수 있다.자바스크립트는 Prototype Based Language 이라고도 불린다.함수 Pe

클래스는 대표적으로 자바, PHP, Python 등에서도 지원을 하는데, 자바스크립트는 원래 지원하지 않았다. 원래는 constructor 함수를 통해서 객체를 찍어냈었다.Class 라는 문법이 ES6(ECMAScript) 부터 업데이트 되며 조금 더 손쉽게 객체지향을

상속은 기존 클래스에 있는 기능들을 다른 클래스를 만들어 기존 클래스에 있는 기능을 그대로 가져오는 것을 의미한다. 상속의 필요성은 기존 클래스에 있는 기능에서 추가적으로 만들고 싶은 기능이 있다고 가정하자.기존 클래스에 기능을 추가하는 방법이 있지만 기존 클래스가 내

이 문법을 사용하여 손쉽게 상속을 받는 방법도 있다. 아래 소스코드를 참고해보면, subObj 객체에다가 suberObj 객체를 대입하는 것이다. 이는 상속한 것과 결과가 같으며 아래 subObj 에서 superVal 을 접근하여 출력하는 것을 보면 쉽게 파악할 수

CustomEvent

Garbage Collection Garbage Collection(이하 GC) 은 메모리 관리 기법 중 하나로 프로그램이 동적으로 할당했던(Heap 영역) 영역 중에서 필요없게 된 영역을 해제하는 기능이다. 즉, 동적으로 할당 된 메모리 영역 가운데 어떤 변수도 가리

Java 언어가 모든 OS 운영체제에서 Virtual Machine 환경 안에서 Runtime 이 구동 되듯이 Node.JS 는 웹브라우저에 종속적인 자바스크립트에서 외부에서 실행할 수 있는 Runtime 환경을 Chrome V8 엔진을 제공하여 여러 OS 환경에서 실

Java 언어가 모든 OS 운영체제에서 Virtual Machine 환경 안에서 Runtime 이 구동 되듯이 Node.JS 는 웹브라우저에 종속적인 자바스크립트에서 외부에서 실행할 수 있는 Runtime 환경을 Chrome V8 엔진을 제공하여 여러 OS 환경에서 실

Node.JS 에서는 require 메서드를 통해 외부 모듈을 가져올 수 있습니다. require 메서드는 node가 local object에 추가한 메서드로서 다음과 같이 파라미터로 추가할 모듈의 파일 경로값을 받습니다.require 메서드의 소스코드는 매우 복잡합니

require 는 Node JS에서 사용되고 있는 CommonJS 키워드이고, 여기서 배워볼 import 는 ES6에서 새롭게 도입된 키워드입니다. 두 개의 키워드 모두 하나의 파일에서 다른 파일의 코드를 불러온다는 동일한 목적을 가지고 있습니다.위 2줄의 코드는 기본

import 를 사용하여 모든 스크립트를 동시에 가져온다면 로딩 시간이 길어질 수 밖에 없습니다.ES6에서는 이러한 단점을 보완하기 위해 필요한 스크립트만 가져와서 사용할 수 있도록 Dynamic Import 를 정의하였습니다.사용법은 간단합니다.import 안에 im

Node.js 는 간단한 모듈 로딩 시스템을 갖고 있습니다. Node.js 에서 파일과 모듈은 일대일로 대응하며, 각 파일은 별도의 모듈로 처리됩니다. 그렇기 때문에 여러곳에서 하나의 파일에 작성된 모듈을 필요로 할 때 동일한 인스턴스를 사용할 수 있도록 합니다.즉 모

자바스크립트는 기본적으로 동기적으로 작동합니다. 하지만 자바스크립트는 여러개의 비동기 메소드를 지원하여 사용자에 이벤트나 HTTP 응답에 반응할 수 있도록 만들어 졌습니다.사용자의 행동은 언제 발생할지 예측하는 것은 매우 복잡한 문제이며 실제로 그런 방법은 많지 않습니

콜백(Callback Hell)의 문제를 해결하기 위해 여러 라이브러리들이 등장했고 많은 개발자들에게 선택받은 것이 바로 Promise 패턴을 사용한 라이브러리들입니다. 이 라이브리러들은 표준화되어서 결국 ES2015에 이르러 Javascript 언어 자체에 포함되었

Fetch API는 네트워크 통신을 포함한 리소스 취득을 위한 인터페이스가 정의되어 있습니다.XMLHttpRequest 가 비슷한 역할을 하지만, Fetch API가 좀더 강력하고 유연한 조작을 가능하게 합니다.Fetch 에는 일반적인 오브젝트로 Request 와 Re

HTTP 통신을 하기 위해 Promise 가 어떻게 사용되는지 살펴 보겠습니다. 아래 예제에 사용된 axios 는 Javascript를 통해 직접 요청을 보내기 위해 널리 사용되는 라이브러리 입니다. GET 메서드로 요청을 보내기 위해 axios.get() 함수를 사용

XMLHttpRequest (XHR) 객체는 서버와 상호작용 하기 위하여 사용됩니다. 전체 페이지의 새로고침없이도 URL로부터 데이터를 받아올 수 있습니다. 이는 웹 페이지가 사용하고 있는 것을 방해하지 않으면서, 페이지의 일부를 업데이트할 수 있도록 해 줍니다. XM

JWT(Json Web Token) JWT 개념 JWT(Json Web Token) 란, Json 포맷을 이용하여 사용자에 대한 속성을 저장하는 Claim 기반의 Web Token 입니다. JWT 는 토큰 자체를 정보로 사용하는 Self-Contained 방식으로

Vue.js 는 웹 페이지 화면을 개발하기 위한 프론트엔드 프레임워크 입니다. vue.js는 여타 다른 프론트엔드 프레임워크보다 배우기 쉽다는 장점이 있습니다. 리액트 및 앵귤러의 장점들을 쏙 빼와서 더욱 빠르고 가볍게 만든 프레임워크라고 합니다.Vue.js 는 위 그

컴포넌트(Component)란 조합하여 화면을 구성할 수 있는 블록을 의마합니다. 컴포넌트를 활용하면 화면을 빠르게 구조화하여 일괄적인 패턴으로 개발 할 수 있으며, 코드를 쉽게 이해하고 재사용할 수 있습니다.컴포넌트는 Vue의 가장 강력한 기능 중 하나입니다. 기본

Webpack은 자바스크립트 모듈 번들러(Bundler)로, 자바스크립트로 작성된 모듈을 번들링하여 하나 혹은 여러개의 번들로 만들어주는 도구입니다.Webpack은 자바스크립트 번들링 기능 외에도 변도의 플러그인을 통해 CSS번들링, 트랜스파일, Lint, 코드 난독화