본문 바로가기

프로그래밍 언어/Javascript14

자바스크립트 비동기, Promise, async, await 웹 브라우저에서 동작하는 자바스크립트 프로그램은 어떤 동작을 하기 전에 사용자의 클릭을 기다리는 이벤트를 중심으로(event-driven) 동작한다. 네트워크를 통해 데이터를 전달 받거나 클릭과 같은 어떤 이벤트가 발생하기 전에 프로그램은 계산 과정을 멈추는 비동기(asynchronous)적으로 동작할 필요가 있다. 프로미스(Promise)는 ES6에서 도입되었으며, 비동기 연산의 미래의 결과를 나타내는 객체이다.(결과를 바로 사용할 수도 있고, 사용하지 못할 수 도 있다) async와 await은 ES2017에서 도입되었으며, Promise로 비동기를 구현하는 코드를 마치 동기(synchronous) 프로그램을 작성하는 것처럼 간단히 비동기 프로그램을 작성할 수 있도록 만들어 준다. asynchrono.. 2021. 8. 17.
자바스크립트 iterator, generator 반복가능한 객체(iterable object)와 반복자(iterator)는 ES6에서 도입되었다. 대표적으로 배열, 문자열, Set, Map은 iterable하다. let sum = 0; for(let i of [1,2,3]) { // Loop once for each of these values sum += i; } sum // => 6 iterator 동작 방식 for/of와 spread 연산자(...)는 iterable object와 동작한다. iterable object는 iterator를 반환하는 매소드를 가진 객체이다. iterator는 iteration result object를 반환하는 next() 매소드를 가진 객체이다. iteration result object는 프로퍼티로 value와.. 2021. 8. 16.
자바스크립트 JSON 직렬화와 파싱 프로그램이 데이터를 저장하거나, 네트워크를 통해 다른 프로그램으로 데이터를 전송할 때, 메모리에 있는 데이터 구조를 문자열로 바꿔 저장하거나 전송한 다음 이후에 사용할 때 원래의 메모리상에 있는 데이터 구조를 파싱해서 사용한다. 이렇게 데이터의 구조를 문자열이나 캐릭터의 스트림으로 바꾸는 것을 직렬화(serialization), marshaling, pickling이라 한다. let o = {s: "", n: 0, a: [true, false, null]}; let s = JSON.stringify(o); // s == '{"s":"","n":0,"a":[true,false,null]}' let copy = JSON.parse(s); // copy == {s: "", n: 0, a: [true, fals.. 2021. 8. 16.
자바스크립트 Set Set은 순서없는 collection이지만 자바스크립트에서는 조금 다르다. 자바스크립트 Set은 인덱스가 없지만 순서는 기억한다. 첫 번째 들어간 원소는 반복문에서 첫번째로 방문되며, 마지막 원소는 마지막으로 반복문을 돈다. 특정 값이 원소에 있는지 확인하는 has()는 실행이 빠르다. 반면 array의 includes() 메소드는 선형시간이 걸린다. 2021. 8. 13.
자바스크립트 모듈 Node는 closure를 기반으로한 모듈을 지원하며, require() 함수를 이용한다. 하지만 이는 자바스크립트 표준에서 채택되지 않았으며 ES6는 import와 export 키워드를 사용하는 것을 정의했다. Node에서도 최근에 이를 구현했다. 실용적인 관점에서 자바스크립트의 모듈은 코드 번들링 도구에 여전히 많이 의존하고 있다. immediately invoked function을 이용해 모듈을 구현할 수 있다. utility function을 함수 안으로 숨기고 모듈의 public API를 반환값으로 한다. const BitSet = (function() { // Set BitSet to the return value of this function // Private implementation .. 2021. 8. 12.
자바스크립트 기존 클래스에 메소드 추가하기 프로토타입 객체에 새로운 메소드(method)를 추가해 자바스크립트 클래스를 확장시킬 수 있다. Complex.prototype.conj = function() { return new Complex(this.r, -this.i); }; 잘 사용하지는 않는다. 2021. 8. 11.
자바스크립트 클래스 public, private, static 필드 인스턴스 필드와 static 필드를 public과 private 형태로 정의하는 것이 2020 현재 표준은 아니지만 크롬에서는 지원하고 있다. public 인스턴스 필드에 대한 문법은 React 프레임워크와 Babel transpiler에서 흔히 사용하고 있다. class Buffer { constructor() { this.size = 0; this.capacity = 4096; this.buffer = new Uint8Array(this.capacity); } } class Buffer { #size = 0; capacity = 4096; buffer = new Uint8Array(this.capacity); get size() { return this.#size; } } 필드를 초기화가 constr.. 2021. 8. 11.

티스토리툴바