원티드, 위코드 FE 프리온보딩 – 일곱 번째 수업 [5] (This)

This 일반적으로는 class에서 사용합니다. 보통 class로 생성한 인스턴스 객체를 this라고 합니다. 하지만 JavaScript에서는 그렇지 않고 this가 가리키는 대상이 항상 달라집니다. 1. 함수와 메서드 메서드는 객체의 프로퍼티로 함수가 정의되어야 합니다. 객체가 함수를 호출해야지 메서드입니다. let user = { name: 'kim', underTwenty: function(age) { return age < 20; } } user.underTwenty(30); // 메서드 const under20 = user.underTwenty;... » read more

원티드, 위코드 FE 프리온보딩 – 일곱 번째 수업 [4] (Closure)

Closure 일급 함수를 이용해서 스코프엔 묶은 변수를 바인딩하기 위한 기술입니다. 즉, 함수가 선언할 때 만들어진 scope가 사라진 후에도 호출할 수 있는 함수입니다. 함수가 선언됐을 때가 중요합니다. var A = function() { var a = 1; var B = function() { return ++a; }; **return B;** }; var outer = A(); console.log(outer()); // 2 console.log(outer()); //... » read more

원티드, 위코드 FE 프리온보딩 – 일곱 번째 수업 [3] (Scope)

Scope 변수가 유효한 범위를 말합니다. 어디까지 쓸 수 있는 지를 이야기하는 것입니다. var x = 'global'; function foo () { var x = 'function scope'; console.log(x); //function scope } foo(); console.log(x); //global 스코프가 없다면 충돌하지 않도록 중복되는 변수명은 쓸 수 없을 것입니다. 1. Scope 종류 1.1. Global Scope 코드 어디에서든지 참조할 수 있습니다. var로 선언한... » read more

원티드, 위코드 FE 프리온보딩 – 일곱 번째 수업 [1] (실행 컨텍스트)

실행 컨텍스트 1. 실행 컨텍스트란? JS 코드가 실행되고 있는 컨텍스트(환경)를 제공하는 객체입니다. 실행할 코드에 대한 정보를 가지고 있습니다. 2. “실행할 코드'와 콜스택 (=실행스택 = Excution Stack) 함수가 실행될 때마다 Call Stack이 쌓이고 끝나면 나가고 이런 방식으로 이루어 집니다. https://ui.dev/javascript-visualizer/ 실행 컨텍스트를 시각화해서 보여주는 사이트 3. 실행할 코드 전역 코드 전역 영역에 존재하는 코드는 전역 컨텍스트가... » read more

원티드, 위코드 FE 프리온보딩 – 여섯 번째 수업[6] (async & await, 이벤트 루프)

async & await 1. async & await es8에서 도입되었습니다. 비동기 함수를 선언합니다. 2. 즉시 실행함수(Immediately invoked function expression, IIFE) 외부 함수 없이 바로 await를 쓰고 싶을 때 아래처럼 활용합니다. 3. 예외 처리 try와 catch 이벤트 루프 1. 이벤트 루프 Heap 단순히 메모리 영역을 지칭하는 용어입니다. 변수 등의 정보를 저장합니다. 콜스택 최상단에 있는 실행 컨텍스트가 실행되면서... » read more

원티드, 위코드 FE 프리온보딩 – 여섯 번째 수업[5] (Promise – state, 에러 처리, 기타)

Promise - state 1. Promise의 3가지 상태 promise 객체는 ‘상태'를 가지고 있습니다. Pending(대기) : 비동기 처리 로직이 완료되지 않은 상태 FulFilled(이행) : 비동기 처리가 완료되어 프로미스가 결과 값을 반환해준 상태 Rejected(실패) : 비동기 처리가 실패하거나 오류가 발생한 상태 promise객체를 console.log()로 불러오면 상태 값이 나옵니다. Promise - 에러 처리 1. 에러 처리 - reject then의 2번째... » read more

원티드, 위코드 FE 프리온보딩 – 여섯 번째 수업[4] (Promise Chaining)

1. Promise Chaining 비동기 작업을 순차적으로 해야하는 경우가 있습니다. 그때 순차적으로 비동기 작업이 끝나고 다음 비동기 작업이 실행해야 하는 경우 사용합니다. 1번 abc, 2번 bbc 2. then의 cb의 반환 값 then의 콜백함수는 여러 타입의 값을 반환할 수 있습니다. 2.1. 값의 반환 첫 번째 비동기에서 2를 return하기 때문에 두 번째 비동기는 2가 console.log에 출력됩니다. 2.2. promise... » read more

원티드, 위코드 FE 프리온보딩 – 여섯 번째 수업[3] (Promise – resolve, reject)

1. Promise es6에서 처음 도입되었습니다. 비동기 동작을 처리합니다. Promise는 클래스입니다. Promise 클래스를 인스턴스화 시켜서 객체를 만들어 사용합니다. 반환된 promise로 원하는 비동기 동작을 처리합니다. Promise는 ‘State’와 ‘resolve’, ‘reject’ 함수를 이해하면 됩니다. 2. Promise 구현하기 resolve : 비동기 로직이 성공했을 때 실행할 함수 reject : 비동기 로직이 실패했을 때 실행할 함수 3. resolve 이해하기 4. reject 이해하기... » read more

원티드, 위코드 FE 프리온보딩 – 여섯 번째 수업[2] (콜백함수(Callback Function))

1. 정의 함수의 매개변수가 함수이면 매개변수로 받은 함수를 콜백함수라고 부릅니다. 영어 그대로의 의미예요. 1.1. 추가 용어 고차 함수(Higher Order Function): 매개변수를 함수로 받은 함수입니다. (외부에서 콜백함수를 전달 받음 함수예요.) 일급 함수 함수를 다른 변수와 동일하게 다루는 것이 일급함수입니다. 함수형 프로그래밍의 특징 중의 하나가 ‘일급함수'입니다. 함수를 변수에 할당 가능 함수를 또 다른 함수 인자로 전달 가능... » read more