클라이언트/ 서버/ 엔지니어 "게임 개발자"를 향한 매일의 공부일지

실습 문제가 정말 많지만 하나하나 풀어보며 개념을 정리해 보겠다.    실습 5 - map, filter, reduce 구현하기   문제 파일 App.js     index.js   component.js     1. 문제 코드 실행하기     map 함수는 초기 배열을 2배 하는 것이다.     filter 함수는 주어진 값보다 작은 숫자만을 넣는 것이다.  reduce 함수는 이 배열 모두를 더하는 것이다.    2. map 함수 코드 작성하기map 함수는 for 문을 사용해서 구현한다. for 문은 전체 배열을 돌면서 func array에 전체 배열의 값을 넣는다. 만약 func가 다음과 같은 값이라고 가정하면 다음과 같이 쓸 수 있다.      3. filter 함수 코드 작성하기filter는 i..

이제 1주차의 마지막 이론 수업이 남아있다. 이후로 실습할 내용이 많이 남아있지만 얼마 남지 않지 않았다고 생각하니 더욱 힘이 난다. 처음 들어보는 개념이지만 충분히 이해할 수 있을 것이다.    이론 6 - ES6 Rest, Spread Operator      findMin은 여러 숫자를 받아 가장 작은 수를 리턴한다. findMin 함수의 모든 인자가 rest로 묶는다. 이 ...을 이용하면 함수 인자들을 하나의 배열로 묶을 수 있다. 그런 다음 reduce 로직을 통해 가장 작은 수를 찾는다.      여기서 유의할 점은 rest가 배열이 아니라 객체라는 것이다.     재귀적으로 호출하면서 sum에 head 값을 더하고 head를 제외한 나머지 인자들을 리턴한다. tail은 길이가 0일 때 리턴..

클로저라는 이름을 들어보기는 했으나 무엇을 하는 건지는 잘 모르고 있다. 이번 단원을 통해 클로저에 대해서 자세히 알아볼 것이다.    이론 5 - 자바스크립트 Closure 자바스크립트에서 함수를 만들었을 때, 함수가 f에 할당이 되면 f는 함수 객체가 된다. function이라는 객체는 전역으로 존재하는 객체이다. 모든 객체는 전역 fuction 객체를 상속받아 인스턴스가 된다. bind, call, apply 함수도 function 객체의 메서드로 프로토타입 체인으로 메서드에 접근할 수 있다. 일급 객체는 함수도 변수처럼 인자를 넘기고 리턴할 수 있는 것을 말한다. 함수를 완전히 변수처럼 다룰 수 있다.      add 함수가 있을 때 reduce는 함수의 인자로 넘어간다. reduce는 콜백 함수..

이번에는 화살표 함수와 일반 함수의 차이에 대해서 공부해 보겠다.    이론 4 - 화살표 함수와 일반 함수의 this  자바스크립트 엔진이 함수를 실행할 때 새로운 함수 컨텍스트를 생성하고 그것을 콜 스택에 넣는다고 앞서 이야기했다. 제일 먼저 전역 컨텍스트가 들어가고 함수 컨텍스트가 쌓이게 된다. 그리고 함수 안에 다른 함수도 호출하며 콜 스택이 쌓이게 된다. 함수가 너무 많이 쌓이면 콜스택이 스택 오버플로가 생긴다.변수를 참조할 때는 스코프 체인을 따라서 실행 컨텍스트 안에 참조하지 못하는 변수를 찾을 수 있다. 예를 들어 myFunc() 함수가 있을 때 a라는 변수가 있다고 하자. a가 어디에서 왔는지 스코프 체인을 따라 자바스크립트 엔진이 찾는데 전역 컨텐스트까지 가도 찾지 못하면 오류가 발생한..

이번에는 this에 대해서 자세히 학습하게 된다. 자바스크립트 심화 수업을 통해 이전에 알지 못했던 것들에 대해 알게 되는 것 같다.    이론 3 - this가 가리키는 것 myFunc()처럼 직접 함수를 호출하는 경우가 있고, o.method처럼 객체 메서드를 호출하는 경우도 있다. 이런 식으로 생성자를 호출할 수도 있고, f.call처럼 데이터를 넘겨주는 간접 호출 방식도 있다. call, apply는 function 객체의 메서드이다. 자바스크립트에서 객체를 만들면 모든 함수는 function 객체를 상속받는 인스턴스이다.      콜백 함수가 console.log로 출력한다고 가정해보자. myFunc()를 만들고 name, callback 함수를 받는다고 했을 때 특정 작업을 하고나서 콜백 함수..

어제도 공부를 얼마 하지 못하고 일찍 취침했다. 그리고 다음날 새벽 1시 10분에 일어나 공부를 시작해 본다. 새벽에 일찍 일어나 공부할 수 있어서 정말 기뻤다. 어제는 가족들과 오랜만에 식사도 하며 오손도손 이야기도 나눌 수 있어서 정말 좋았다. 식사 후에는 피곤해서 9시 조금 넘어서 일찍 취침한 것 같다.오늘은 새벽과 아침에 정말 공부를 많이 해서 가능하면 자바스크립트 심화 과정을 거의 끝내고 남은 수업도 모두 들어볼 생각이다. 그래서 저녁까지 해서 심화 과정을 웬만하면 다 끝내고 내일 새벽에는 그동안 정리하지 못했던 것들도 하는 시간을 갖기로 했다. 내일은 수료식이니 내 생애 정말 중요한 날이다.     이론 2 - 실행 컨텍스트  자바스크립트 엔진이 코드를 읽고 실행했을 때 전역 컨텍스트를 먼저 ..

첫 번째 수업을 진행해 보겠다. 수업 영상이 정말 길지만 이 공부까지 마치고 다음 일정을 시작해보려고 한다.    이론 1 - 자바스크립트 함수가 실행되는 과정브라우저와 node.js와 같은 환경에서 실행된다.  어떤 자바스크립트 코드 없이 실행해야 하는 경우에 대해서 알아보겠다.     어떤 코드도 없어도 세 가지 변수를 초기화한다. 이 세 가지 변수를 엔진이 만들게 된다.      this는 코드가 실행되는 시점의 환경 객체를 의미한다. 예를 들어 console.log(this)를 찍을 때 this는  window 객체를 가리킨다. window는 글로벌 스코프가 되고, 변수는 아무것도 실행되지 않았으므로 빈 객체가 된다. Scope chain의 경우 연결된 스코프가 없기 때문에 빈 객체가 된다. co..

오늘부터 화요일까지 이틀 반동안 자바스크립트 심화 과정을 공부해 보기로 했다. 오늘도 내일도 공부를 별로 하지 못할 것 같아 과연 화요일까지 다 마칠 수 있을지 미지수이지만 할 수 있으리라 믿어본다.이 과목과 함께 아직 남아있는 인사교 자바스크립트 수업 2시간 분량의 수업도 듣고 학습일지에 정리해 볼 생각이다. 오늘의 공부 목표는 1주차 수업까지 마치는 것이다.   수업 소개 - 자바스크립트 심화        동기적이라는 것은 특정 시점에서 순차적으로 실행한다는 뜻이다.                     학습을 마치고수업 소개와 함께 이론 첫번째 수업을 함께 묶어서 학습일지를 쓰려고 했는데 분량이 많아서 그냥 오리엔테이션만 진행해 본다. 앞으로 3일 동안 심화 과정 공부를 열심히 해볼 것이다.기초 과정..