Ama_gramer

- 목표자바스크립트 엔진이벤트 루프, 태스크 큐정리📝 자바스크립트 엔진자바스크립트 엔진은 싱글 스레드 방식으로 동작한다. 이때 싱글 스레드 방식으로 동작하는 것은 브라우저가 아닌 브라우저에 내장된 자바스크립트 엔진이라는 것에 주의해야한다. 만약에 모든 자바스크립트 코드가 싱글스레드로 동작한다면 자바스크립트는 비동기로 동작할 수 없다. 즉, 엔진은 싱글스레드로 동작하지만, 브라우저는 멀티 스레드로 동작한다.자바스크립트의 엔진(V8) 은 위 그림과 같이 크게 2개의 영역으로 구분된다.- Call Stack  : 소스 코드 평가 과정에서 생성된 실행 컨텍스트가 추가되고 제거되는 스택 자료 구조인 실행 컨텍스트 스택- Heap : 객체가 저장되는 메모리 공간이처럼 콜 스택과 힙으로 구성된 자바스크립트 엔진은..

자바스크립트 엔진은 싱글 스레드 방식으로 동작한다.즉, 한번에 하나의 task 만을 처리할 수 있다.싱글 스레드로 동작하는 것은안정성과단순함을 갖는 대신성능적 한계가 있을 수 있다.이러한 문제를 다루는 내용이 동기 프로그래밍과 비동기 프로그래밍이다.- 목표동기 비동기📝 동기 실행 컨텍스트 스택에 실행 컨텍스트가 여러개 있으면 FILO(First In Last Out) 구조로 컨텍스트가 실행되고 스택에서 POP 되어 제거 되기 전 까지는 실행 컨텍스트 아래의 다른 실행 컨텍스트는 실행되지 않고 task 가 대기하는 방식이다.const first = () => { console.log('First Func...');}const second = () => { console.log('Second Func..

- 목표Set Map 기본 정의Set Map 내장 메서드Set 수학적 집합 구현정리Set Map 기본 정의1. Set - 중복되지 않는 유일한 값들의 집합- 수학적 집합을 구현하기 위한 자료구조- 배열과 유사하지만 다음과 같은 차이가 있다.구분배열Set동일한 값을 중복하여 포함훌 수 있는가?가능불가능요소 순서에 의미가 있는가?가능불가능인덱스로 요소에 접근할 수 있는가?가능불가능2. Map- key value 쌍으로 이루어진 컬렉션- 내부적으로 해시 테이블 구조를 사용하여 구현   ㄴ hash table 구조로 특정 키를 조회(get)하거나 확인(has)할 때 일정한 시간 복잡도를 가진다. (평균적으로 O(1))- 객체와 유사하지만 다음과 같은 차이가 있다.구분객체Map키로 사용할 수 있는 값의 Ty..

- 목표spread syntaxspread syntax vs rest parameterspread syntax 사용- spread syntax하나로 뭉쳐 있는 여러 값들의 집합을 펼쳐서(전개, 분산하여, spread) 개별적인 값들의 목록을 만든다.es6 이전 Function.prototype.apply() 와 같은 역할을 한다. 스프레드 문법을 사용할 수 있는 대상은 Array, String, Map, Set, DOM collection(NodeList, HTMLCollection), arguments 와 같이 for...of 반복문으로 순회 가능한 이터러블 속성을 갖은 데이터에 한정된다. ※ 쉼표로 구분한 값의 목록을 사용하는 문맥 - 함수 호출문의 인수 목록- 배열 리터럴의 요소 목록- 객체 리터..

- 목표this는 무엇일까?this를 써야하는 이유는?함수 호출 방식에 의해 동적으로 결정되는 this 바인딩- this 는 무엇일까?자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수다.this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. Java나 C++ 같은 클래스 기반 언어에서 this는 언제나 클래스가 생성하는 인스턴스를 가리키지만,JavaScript의 this는 함수가 호출되는 방식에 따라 this에 바인딩될 값, 즉 this 바인딩이 동적으로 결정된다. ※ JavaScript는 strict mode(엄격 모드) 역시 this 바인딩에 영향을 준다.- this 사용 이유객체는 상태를 나타내는 property와 동작을 나타내는..

- 목표생성자 함수의 인스턴스 생성과정을 알아보자.내부 메서드 [[Call]] 과 [[Construct]]를 알아보고 비교해보자.constructor와 non-constructor를 구분해보자.- 생성자 함수의 인스턴스 생성과정생성자 함수의 역할은 프로퍼티 구조가 동일한 인스턴스를 생성하기 위한 템플릿(클래스)으로서 동작하여 인스턴스를 생성하는 것과 생성된 인스턴스를 초기화(인스턴스 프로퍼티 추가 및 초기값 할당)하는 것이다. 인스턴스 생성 과정인스턴스 생성과 this 바인딩인스턴스 초기화인스턴스 반환1. 인스턴스 생성과 this 바인딩암묵적으로 빈 객체가 생성된다. 이 객체는 완성된 객체는 아니나 생성자 함수가 생성한 인스턴스로 분류된다.그리고 이 객체는 this에 바인딩 된다.바인딩은 식별자와 값을 ..

- 목표생성자 함수를 이용하여 객체를 생성하는 방식을 알아보자. 객체 리터럴을 사용하여 객체를 새엇앟는 방식과 생성자 함수를 사용하여 객체를 생성하는 방식과의 장단점을 살펴보자.- Object 생성자 함수생성자 함수란 new 연산자와 함께 호출하여 객체를 생성하는 함수를 말한다.new 연산자는 사용자 정의 객체 타입 또는 내장 객체 타입의 인스턴스를 생성한다. - MDN 생성자 함수에 의해 생성된 객체를 인스턴스 라고 한다. 자바스크립트에서는 Object 생성자 이외에도 String, Number, Boolean, Function, Array, Date, RegExp, Promise 등의 빌트인 생성자 함수를 제공한다.- 생성자 함수1. 객체 리터럴로 객체를 생성하는 방식의 장점과 문제점객체 리터럴은 아..