profile
Front-end 개발 공부일지

33 Javascript Concepts

자바스크립트 개발자가 알아야 하는 33가지 개념 1. 호출 스택 (Call Stack) 자바스크립트 엔진 가장 대중적인 자바스크립트의 엔진은 구글의 V8 엔진입니다. V8 엔진은 크롬과 노드 안에서 동작합니다. 자바스크립트 엔진은 다음과 같은 두 가지 주요 구성 요소로 이루어져 있습니다. image.png 메모리 힙(Memory Heap) — 객...

2019년 11월 19일
·
0개의 댓글

[ Learning Javascript ] - 노드

노드는 자바스크립트를 서버에서 사용할 목적으로 만들어졌고, 보통 다른 언어에 맡겨지던 작업을 자바스크립트로 가능하게 만들었다는 의미가 있다. 웹 개발자에게는 언어의 선택 이상의 의미가 있다. >서버에서 자바스크립트를 쓸 수 있게 된 것은, 사고방식을 바꿀 필요 없이 일관된 언어를 쓸 수 있다는 의미이고, 다른 전문가에게 의존할 필요가 줄어든다는 의미이며,...

2019년 11월 7일
·
0개의 댓글

[ Learning Javascript ] - 브라우저의 자바스크립트

자바스크립트는 원래 브라우저 스크립트 언어로 시작해, 이제는 그 역할을 거의 독점하고 있다. 브라우저에서 자바스크립트를 사용할 때 알아야 하는 API가 있드며 브라우저 개발에 중요한 핵심 개념을 알아보자. 문서 객체 모델 DOM, 즉 문서 객체 모델은 HTML 문서의 구조를 나타내는 표기법인 동시에 브라우저가 HTML 문서를 조작하는 핵심 요소이기도 하다...

2019년 10월 18일
·
0개의 댓글

[ Learning Javascript ] - 비동기적 프로그래밍

자바스크립트의 비동기 지금까지는 사용자의 행동에 반응하면서 비동기적 프로그래밍을 접해봤다. 사용자의 행동은 전적으로 비동기적이다. 사용자가 언제 클릭할지, 터치할지, 또는 타이핑할지 전혀 알 수 없다. 하지만 비동기적 실행이 사용자 입력 하나 때문에 필요한 건 아니다. 자바스크립트의 본적 때문에 비동기적 프로그래밍이 필요하다. 자바스크립트 애플리케이션은...

2019년 10월 13일
·
0개의 댓글

[ Learning Javascript ] - 함수와 추상적 사고

서브루틴으로서의 함수 Subroutin은 아주 오래 된 개념이며 복잡한 코드를 간단하게 만드는 기초적인 수단이다. > 서브루틴은 프로시저, 루틴, 서브프로그램, 매크로 등 다양한 이름으로 불립니다. 이들은 모두 매우 단순하고 범용적인, 호출할 수 있는 한 단위를 일컫는 말입니다. 자바스크립트에서는 서브루틴이라는 용어를 쓰지 않고 함수는 함수(메서드) 라...

2019년 10월 9일
·
0개의 댓글

[ Learning Javascript ] - 이터레이터와 제너레이터

Iterator 이터레이터와 제너레이터는 ES6에 새로 도입된 중요한 개념이다. 이터레이터는 '지금 어디 있는지' 파악할 수 있도록 돕는다는 면에서 일종의 책갈피와 비슷한 개념이다. 배열은 이터러블 객체의 좋은 예로 배열의 여러 요소에 이터레이터를 사용할 수 있다. next() 메서드를 사용하면 배열을 읽기 시작하고, 메서드가 반환하는 객체에는 valu...

2019년 10월 6일
·
0개의 댓글

서버사이드렌더링 & 클라이언트사이드렌더링

SPA Single Page Web Application 기법 하나의 페이지로 구성된 어플리케이션으로 규모가 크고 사용자와의 상호 작용이 많아짐에 따라 데이터 전송 과부화로 인한 속도 저하 등 문제점을 해결해주는 기법이다. 서버에 제공하는 페이지가 한 개로, 로딩을 하고난 후 에는 브라우저 내에서 나머지 페이지들을 정의해서 보여준다. SPA 단점 앱...

2019년 10월 4일
·
0개의 댓글

[ Learning Javascript ] - 예외와 에러 처리

Error 객체 자바스크립트의 내장된 Error 객체를 사용해서 간편한 에러 처리를 할 수 있다. Error 인스턴스는 에러와 통신하는 수단으로 Error 인스턴스를 만들어 에러가 일어나는 상황을 추측해 대처하는 방법으로 사용한다. 이메일 유효성 검사 에러 try/catch와 예외 처리 Error 인스턴스는 예외 처리에서 더 자주 사용된다. 예외 처...

2019년 9월 30일
·
0개의 댓글

[ Learning Javascript ] - 맵과 셋

map과 set ES6에서 새로 도입된 데이터 구조이다. 맵은 키와 값을 연결한다는 점에서 객체와 비슷하고, 셋은 중복을 허용하지 않는다는 점만 제외하면 배열과 비슷하다. Map ES6 이전에는 키와 값을 연결하기 위해 객체를 사용했는데 이런 목적으로 객체를 사용하면 여러 가지 단점이 생긴다. 프로토타입 체인 때문에 의도하지 않은 연결이 생길 수 있다. ...

2019년 9월 30일
·
0개의 댓글

[ Learning Javascript ] - 객체와 객체지향 프로그래밍

프로퍼티 나열 객체를 객체답게 만드는 프로퍼티는 키 (문자열 또는 심볼)과 값으로 구성된다. 객체의 특징은 키를 통해 프로퍼티에 접근할 수 있다는 점이다. 객체도 컨테이너이며 프로퍼티 나열을 지원하고 순서가 보장되지 않는다는 점을 기억해야한다. for...in 문자열 프로퍼티가 몇개 있고 심볼 프로퍼티가 하나 있는 객체가 있다고 가정. hasOwnP...

2019년 9월 26일
·
0개의 댓글

[ Learning Javascript ] - 배열과 배열 처리

프로그래밍을 하다 보면 데이터 집합을 조작해야 할 일이 정말 많은데, 자바스크립트의 배열 메서드에 익숙해지면 이런 작업을 쉽게 처리할 수 있고 자바스크립트 개발 능력이 한 단계 올라갈 수 있다. 배열의 기초 배열의 기본적인 사항 배열은 객체와 달리 본질에서 순서가 있는 데이터 집합이며 0으로 시작하는 숫자형 인덱스를 사용한다. 자바스크립트의 배열은 비균질...

2019년 9월 23일
·
0개의 댓글

[ Learning Javascript ] - 스코프

Scope 스코프 (scope)는 변수와 상수, 매개변수와 언제 어디서 정의되는지 결정한다. 함수 매개변수가 함수 바디 안에만 존재하는 것도 스코프의 한 예이다. x가 잠시나마 존재했으니 x + 3을 계산할 수 있었는데 함수 바디를 벗어나면 x는 존재하지 않는 것처럼 보인다. 따라서 우리는 x의 스코프가 함수f라고 말한다. 변수의 스코프가 어떤 함수라...

2019년 9월 21일
·
0개의 댓글

[ Learning Javascript ] - 표현식과 연산자

표현식 표현식 (expression)은 값으로 평가될 수 있는 문이다. 즉 결과가 값인 문과, 표현식이 아닌 문의 차이를 이해하는 것이 매우 중요하다. 이 차이를 이해해야만 자바스크립트의 요소들을 효과적으로 조합할 수 있다. 표현식이 아닌 문(statement)은 일종의 지시라고 생각할 수 있고, 표현식은 무언가를 요청하는 것이라고 생각할 수 있습니다....

2019년 9월 21일
·
0개의 댓글
post-thumbnail

[ Learning Javascript ] - 리터럴과 변수, 상수, 데이터 타입

러닝 자바스크립트 서적을 통해 공부한 내용을 정리하는 포스팅 시리즈 데이터를 자바스크립트가 이해할 수 있는 형식으로 바꾸는 법을 배우고 정리했습니다. 프로그램을 배울 때 용어의 중요성을 느끼게 되는 내용으로, 리터럴과 value가 어떻게 다른지 expression과 statement이 어떻게 다른지 이해하지 못하면 프로그램 언어를 배우는 데 장애가 될 ...

2019년 9월 21일
·
0개의 댓글

[JS] 비동기 처리 ( Promise / async&await )

Javascript 동기적 처리 비동기적 처리 image.png 만약 작업을 동기적으로 처리한다면 작업이 끝날 때까지 기다리는 동안 중지 상태가 되기 때문에 다른 작업을 할 수 없습니다. 그리고 작업이 끝나야 비로소 그 다음 예정된 작업을 할 수 있죠. 하지만 이를 비동기적으로 처리를 한다면 흐름이 멈추지 않기 때문에 동시에 여러 가지 작업을 처리할 수도...

2019년 9월 7일
·
0개의 댓글