analogcoding

javascript main keyword 본문

Study JS for me/Keyword

javascript main keyword

be well 2019. 8. 14. 01:58

부족한 정의 등 간단하게 정리 요약

 

자바스크립트

이벤트루프 기반의 싱글스레드 언어, 하나의 호출 스택을 사용해서 어느 하나의 함수가 실행되면 이 함수가 끝날 때 까지

다른 task 를 실행할 수 없다.

 

비동기 (event loof)

이 때 비동기영역 eventQueue 에 담긴 비동기함수들은  스택이 모두 비워지고 대기열에 들어온 순서대로 수행된다.

 

비동기 처리 Promise & async await

콜백이 중첩되는 경우가 따라서 발생하였고, 이를 해결할 방안으로 등장한 것이 Promise 패턴이다.

Promise 패턴을 사용하면 비동기 작업들을 순차적으로 진행하거나, 병렬로 진행하는 등의 컨트롤이 보다 수월해진다.

또한 예외처리에 대한 구조가 존재하기 때문에 오류 처리 등에 대해 보다 가시적으로 관리할 수 있다.

 


var , let , const

var 펑션 스코프 변수 재선언 가능

 

let,const 블록 스코프 변수 재선언 불가능 , let 변수에 재할당 가능

 


호이스팅


자바스크립트 코드를 해석함에 있어서 선언된 변수나 함수를 해당 Scope의 최상단으로 끌어올리는 것을 말한다.

var가 function-scoped로 hoisting이 되었다면 let, const는 block-scoped단위로 hoisting이 일어나는데

 let변수에 접근이 불가능한 이유가 바로 TDZ때문이다. let과 const는 블록의 시작부터 초기화가 실행되기전까지 
TDZ에 존재하게 된다는 것. 
TDZ에 존재하면 호이스팅을 통한 접근을 할 수 없다.

 


클로져

 

외부함수의 변수에 접근할 수 있는 내부함수. scope chain으로 표현되기도 한다.

보통 함수를 return하여 사용하고 return 하는 내부함수를 closure함수라고 칭한다.

 

Closure가 가지는 세가지 scope chain

  1. Closure 자신에 대한 접근. (Closure function 내에 정의된 변수)
  2. 외부함수의 변수에 대한 접근
  3. 전역 변수에 대한 접근

 Closure를 이용해 변수를 scope 안 쪽에 숨겨서 함수 밖으로 노출시키지 않을 수도 있다.

 

스코프

 

변수와 그 값이 어디서부터 어디까지 유효한지 판단하는 범위.

scope는 변수 접근 규칙에 따른 유효범위를 의미한다.

javascript에서 함수가 선언되는 동시에 자신만의 scope를 가진다.

 


This

자바스크립트에서 모든 함수는 실행될 때마다 함수 내부에 this라는 객체가 추가된다. arguments라는 유사 배열 객체와 함께 
함수 내부로 암묵적으로 전달되는 것이다. 그렇기 때문에 자바스크립트에서의 
this는 함수가 호출된 상황에 따라 그 모습을 달리한다.

함수 호출 방식에 따라 this 에 바인딩되는 객체가 달라진다.

Execution Context 

정의 : 실행컨텍스트는 추상적인 개념 . 실행 컨텍스트는 실행 가능한 코드가 실행되기 위해 필요한 환경

(실행 컨텍스트)는 scope, hoisting, this, function, closure 등의 동작원리를 담고 있다.

어떤 함수가 호출되면 execution context가 만들어진다.

 


react 란?

MVC 패턴의 프레임워크에서 뷰 부분을 컴포넌트로 만들기 위한 라이브러리

템플릿언어가 아닌 자바스크립트로 컴포넌트 작성
특정 관심사에 집중된 기능 블록 (관심사의 분리)

 

특징 : 단방향 흐름 , JSX

페이지를 렌더할 때 전과 비교해서 변화가 필요한 부분을 렌더해서 빠르게 처리할 수 있다.

컴포넌트 기반 아키텍처 (컴포넌트는 프로그래밍의 한 부분을 의미하며 재사용이 가능한 최소 단위)

  • 현대의 웹은 크고 복잡하다.
  • 복잡한 문제(개발할 시스템)를 작게 나누어서 해결하기 위해 필요하다.
  • 컴포넌트 단위로 코드를 작성하면 캡슐화(테스트 가용성, 신뢰성), 확장성, 결합성, 재사용성 같은 이점이 있다.

react lifecycle

 

React의 컴포너트는 생명주기(Life cycle)을 가진다. 생명주기란 컴포넌트가 생성되고 사용되고 소멸될 때 까지 일련의 과정을 말한다.
이러한 생명주기 안에서는 특정 시점에 자동으로 호출되는 메서드가 있는데, 이를 라이프 사이클 이벤트라고 한다.

 

session & cookies

쿠키와 세션을 사용하는 이유

 

HTTP 프로토콜의 특징이자 약점을 보완하기 위해서 사용한다.

 

쿠키(Cookie)

쿠키는 클라이언트 로컬에 저장되는 키와 값이 들어있는 작은 데이터 일.

쿠키에는 이름, 값, 만료날짜(쿠키 저장기간), 경로 정보가 들어있다.

쿠키는 일정시간동안 데이터를 저장할 수 있다. (로그인 상태 유지에 활용)

쿠키는 클라이언트의 상태 정보를 로컬에 저장했다가 참조한다.

 

세션(Session)

일정 시간동안 같은 브라우저로 부터 들어오는 일련의 요구를 하나의 상태로 보고 그 상태를 유지하는 기술

즉, 웹 브라우저를 통해 웹 서버에 접속한 이후로 브라우저를 종료할 때 까지 유지되는 상태

클라이언트가 Request를 보내면, 해당 서버의 엔진이 클라이언트에게 유일한 ID를 부여하는 데 이것이 세션ID다.


키는 클라이언트에 파일로 저장, 세션은 서버에 저장

세션은 서버의 자원을 사용하기때문에 무분별하게 만들다보면 서버의 메모리가 감당할 수 없어질 수가 있고 속도가 느려질 수 있다..


Routing 처리

라우팅은 애플리케이션 엔드 포인트(URI)의 정의, 그리고 URI가 클라이언트 요청에 응답하는 방식

네트워크상에서 주소를 이용하여 목적지까지 메시지를 전달하는 방법을 체계적으로 결정하는 경로선택 과정

클라이언트가 서버로 접속할때는 특정한 URL를 통해 접속한다. 서버에서는 이 URL에 해당하는 자원을 클라이언트로 보내준다.

 


MVC 패턴

개발 할 때, 3가지 형태로 역할을 나누어 개발하는 방법론

효율적으로 만들어지는 일련의 패턴 , 유지보수의 용의

 


서버 node 

Node.js는 확장성 있는 네트워크 애플리케이션(특히 서버 사이드) 개발에 사용되는 소프트웨어 플랫폼

 


스키마란?

 DB내에 어떤 구조로 데이터가 저장되는가를 나타내는 데이터베이스 구조를 스키마


join ( Foreign Key )

FOREIGN KEY는, 두개의 테이블을 연결하는데 사용되는 키다.

한쪽 테이블에서 PRIMARY KEY인 속성(또는 속성그룹)이, 다른쪽 테이블과 관계를 가질때,

한쪽 테이블의 PRIMARY Key 속성이 다른쪽 테이블에 속성으로 들어가며, FOREIGN KEY가 된다.

 


함수형 프로그래밍,객체 지향 프로그래밍?

 

함수형 프로그래밍에서는 프로그래머가 모든 것을 예측하고 통제할 수 있어야한다?

쉽게 에러를 추적 할 수 있다

 


RESTFul API 란?

REST는 분산 시스템 설계를 위한 아키텍처 스타일

자원을 이름(자원의 표현)으로 구분하여 해당 자원의 상태(정보)를 주고 받는 모든 것을 의미
주로 5가지의 Method(GET, POST, PUT, PATCH, DELETE)를 사용하여 CRUD를 구현

 


TDD 란 무엇이며 어떠한 장점이 있는가?

테스트 주도 개발: 테스트가 개발을 이끌어 나간다.

만드는 과정에서 우선 테스트를 작성하고 그걸 통과하는 코드를 만들고를 반복하면서 제대로 동작하는지에 대한 

피드백을 적극적으로 받는 것


Git

파일의 변경사항을 추적하고 여러 명의 사용자들 간에 해당 파일들의 작업을 조율하기 위한 분산 버전 관리 시스템

 


CORS

CORS 란 웹브라우저에서 현재 사용자가 사용중인 사이트 이외에 동시에 다른 사이트에 접근하는 경우를 처리하기 위한

웹브라우저 표준기술


HTTP 와 HTTPS 의 차이점

HTTP  웹브라우저(Client)와 서버(Server)간의 웹페이지같은 자원을 주고 받을 때 쓰는 통신 규약


HTTPS 는 인터넷 상에서 정보를 암호화하는 SSL(Secure Sockey Layer)프로토콜을 이용하여

웹브라우저(클라이언트)와 서버가 데이터를 주고 받는 통신 규약

'Study JS for me > Keyword' 카테고리의 다른 글

자바스크립트 this  (0) 2019.09.08
자바스크립트 클로져 ( Closure )  (0) 2019.08.31
function default parameters  (0) 2019.05.14
Destructuring  (0) 2019.05.14
arrow function 의 this context  (0) 2019.05.14
Comments