Programming 97

JavaScript의 Decorator

[ Decorator ] - 2020년 9월 meeting에서 TC39에 제시될 새로운 제안 - 가장 단순하게는 코드의 한 부분을 다른 코드로 감싸는 방법 (= 장식) - 정의 중에 클래스 요소, 기타 JavaScript 구문 양식에서 호출되는 함수, 잠재적으로 decorator가 반환한 새 값으로 래핑(또는 대체)됨 ※ 사실 이미 다른 방식으로 decorator의 느낌처럼 JavaScript에서 사용 가능했음..(아래 처럼) function loggingDecorator(wrapped) { return function() { console.log('Starting'); const result = wrapped.apply(this, arguments); console.log('Finished'); ret..

[Node.js] 싱글 스레드(Single-thread)와 이벤트 루프(Event loop)

Node.js는 Chrome의 V8 JavaScript 엔진 에 구축 된 JavaScript 런타임 비동기 이벤트 기반 JavaScript 런타임 인 ​​Node.js는 확장 가능한 네트워크 애플리케이션을 빌드하도록 설계됨. Event loop - JavaScript가 싱글 스레드라는 사실에도 불구하고, 가능할때마다 작업을 시스템 커널로 offload하여 non-blocking IO 작업을 수행할 수 있도록 함 - 대부분의 최신 커널은 다중 스레드이므로 백그라운드에서 실행되는 여러 작업을 처리 가능 - 이러한 작업 중 하나가 완료되면, 커널은 Node.js에 적절한 콜백을 poll queue에 추가하여 실행되도록 함 - Node.js가 시작되면, 이벤트 루프를 초기화하고 제공된 input script를 ..

호이스팅 (Hoisting)

호이스팅 (Hoisting) : 함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 유효 범위(함수 블록{})의 최상단에 선언하는 것을 의미 - JavaScript 함수는 실행되기 전 함수 내에 필요한 변수값을 모두 모아 유효 범위의 최상단에 선언 호이스팅 절차 1. JavaScript parser가 함수 실행 전 해당 함수를 한번 훑음 2. 함수 안에 존재하는 변수/함수 선언에 대한 정보를 기억하고 있다가 실행 ※ 실제로 코드가 위로 끌어올려지는 것이 아니라, JavaScript parser가 내부적으로 끌어올려서 처리 ※ 실제 메모리 변화가 X 호이스팅의 대상 - var 변수 선언과 함수 선언문 - 할당은 끌어올려지지 않음 - let/const 변수 선언과 함수 표현식에서는 호이스팅 발생 X ※ 함수..

var VS let VS const 의 차이

var - es5의 변수 선언 방법 - Function-level Scope let - es6의 변수 선언 방법 - Block-level Scope - 일반 변수 - 중복 선언시 TypeError 발생 const - es6의 변수 선언 방법 - Block-level Scope - 상수용 변수 - 처음 생성 시 초기값 필수 지정 함수 레벨 스코프 (Function-level scope) - 함수 내에서 선언된 변수는 함수 내에서만 유효하며, 함수 외부에서 참조 불가능 - 함수 내부에서 선언한 변수는 지역 변수 / 함수 외부에서 선언한 변수는 전역 변수 - 자바스크립트 특징 - var 키워드 생략 허용 - 변수 중복 선언 허용 - 전역 변수 남용 블록 레벨 스코프 (Block-level scope) - 모든..

ECMAScript란?

ECMAScript 란? - Ecma International이 ECMA-262 (1996년 11월 ~)기술 규격에 따라 정의하고 있는 표준화된 스크립트 프로그래밍 언어 - JavaScript를 표준화하기 위해 만들어짐 - 웹 클라이언트 측 스크립트로 많이 사용되며, 점차 Node.js를 사용한 서버 측 스크립트에도 사용됨 ※ Ecma International - 1961년 유럽에서 컴퓨터 시스템을 표준화하기 위해 세워짐 - 정보와 통신 시스템을 위한 국제적 표준화 기구 - 원래 이름 : European Computer Manufacturers Association (ECMA) - 기구의 국제적 확장을 반영하여 현재의 이름으로 바뀜 ECMAScript와 JavaScript 차이 - ECMAScript :..

[Angular5] translate 번역 값이 안나오고 번역 키가 대신 나오는 현상 해결

app.module.ts 파일에서 아래 모듈, 함수 추가 import { NgModule, Injector, APP_INITIALIZER } from '@angular/core'; import { LOCATION_INITIALIZED } from '@angular/common'; import { TranslateModule, TranslateLoader, TranslateService } from '@ngx-translate/core'; import { TranslateHttpLoader } from '@ngx-translate/http-loader'; export function appInitializerFactory( translate: TranslateService, injector: Injecto..

ECMAScript 2020

String.prototype.matchAll( ) - String.prototype.match( )와 유사하게 동작 - 정규 표현식과 매칭되는 문자열, 세부 정보를 포함하는 iterator를 반환 예제) const text = "From 2019.01.29 to 2019.01.30"; const regexp = /(?\d{4}).(?\d{2}).(?\d{2})/gu; const results = text.match(regexp); console.log(results); // [ '2019.01.29', '2019.01.30' ] const text = "From 2019.01.29 to 2019.01.30"; const regexp = /(?\d{4}).(?\d{2}).(?\d{2})/gu; const..

반응형