하루 걸음 | JS Deep Dive, 면접 때 부족했던 부분을 알게 되다!

✅ 오늘의 요약

- JS Deep Dive : 호이스팅, 스코프 체인, 함수에 대해

- freeCodeCamp : HTML, CSS 연습 (var을 이용한 사용자 지정 색상 구현해서 이용하기)

- 오예스 1개와 커피를 마시고, 약 30분 달리기를 하니 다리가 욱신거리지만 정신은 말똥 하다

---

✍🏻 오늘의 개발 공부 키워드

1. (4장) 변수, 상수 

2. (5장) 함수 선언문 / 함수 표현식

3. (13,14,15장) 스코프, 호이스팅(변수/상수)

4. (12장) 생성자 함수 / return / 재귀 함수 / 중첩 함수 / 콜백 함수

- 함수 선언문으로 정의한 함수와, 함수 표현식으로 정의한 함수의 생성 시점이 다르다. (p 165)

- 즉시 실행 함수 (IIFE)

- 이상적인 함수는 한 가지 일만 해야 하며 가급적 작게 만들어야 한다. (p 172)

- 콜백 함수의 주요 사용

 : 비동기 작업 시, 외부 데이터를 불러오고 다음 코드가 연속적으로 일어나야 한다면(여기서 콜백 함수를 쓴다), JS외부 데이터가 도착할 때까지 기다리지 않고 다음 일을 수행~

- (10.4장) 메서드, 함수, 생성자 함수 (p 130)

5. (19장) 객체지향 프로그래밍 : 상속성, 다형성, 은닉성

- 자바스크립트는 프로토타입 기반의 객체지향 프로그래밍 언어이다! (p 259)

- constructor(기계), prototype(유전자)

 : constructor을 만들면 prototype이 자동으로 생성

 : 자바스크립트는 프로토타입을 기반으로 상속을 구현한다. (p 263)

- instance(새로 생성되는 오브젝트)

- __proto__ (내 부모를 알고 싶다면~ 내 부모 유전자~)

 : 모든 객체는 __proto__ 접근자 프로퍼티를 통해 자신의 프로토타입에 간접적으로 접근할 수 있다. (p 265)

- 프로토타입 체인 (p 286)

- 오버라이딩, 오버로딩 (p 289)

 : 매개변수가 동일한데 새롭게 구현한다(오버라이딩)

 : 매개변수가 다른 동일한 이름의 함수를 다시 구현한다(오버로딩) - JS는 오버로딩을 지원하지 않지만 arguments 객체를 이용해 구현할 수는 있다.

- ES5) Object.create(물려받을 부모) : 직접 상속 방법 (p 299)

- ES6) class 문법으로 구현하는 constructor

- instanceof 연산자 (p 296)

 : 우변의 생성자 함수의 prototype에 바인딩된 객체가 좌변의 객체의 프로토타입 체인 상에 존재하면 true, 그렇지 않은 경우 false

6. (16.3.2장) 접근자 (getter, setter 함수)

- 함수를 만들어서 object 데이터 다루는 이유?

 1) object 자료 복잡할 때 편리

 2) object 자료 수정 시 편리 (실수를 방지할 수 있다)

- 다른 데이터 프로퍼티 값을 읽거나 저장할 때 사용하는 접근자 함수로 구성된 프로퍼티 (p 223)

- get : 데이터 꺼내 쓰는 함수에 붙인다 : return이 꼭 필요

- set : 데이터 변경하는 함수에 붙인다 : 인자는 1개만

7. (9.4.2장) 옵셔널 체이닝 연산자 ?.

8. (20장) strict mode

- 오해 소지가 있는 코드를 쓰지 말라

예) 일반 함수 내에서 this 쓰기 : window 전역 객체임

예) 호이스팅

9. (21.4장) 전역 객체

- 전역 객체는 표준 빌트인 객체(Object, String, Number, Function, Array 등)와 환경에 따른 호스트 객체, 그리고 전역 변수와 전역 함수를 프로퍼티로 갖는다. (p326)

- 빌트인 전역 프로퍼티 (p 328) : Infinity, NaN, undefined

- 빌트인 전역 함수 (p 329) : eval, isFinite, isNaN, parseFloat, parseInt 등

8. (38.2장) HTTP

- 웹에서 브라우저와 서버가 통신하기 위한 프로토콜(규약) (p 664)

- GET, POST, DELETE, PUT, PATCH, OPTIONS

10. FreeCodeCamp - Responsive Web Design 편 (4/5 진행 중)

var을 이용한 사용자 지정 색상 구현해서 이용하기

 

---

💭 생각 넓히기

- 오늘의 생각

모던 자바스크립트 딥 다이브를 공부하며, 면접 과정에서 부족한 부분을 찾아냈다. 이렇게 또 선물이 찾아오다니 :)

유튜브 - 시니어 코딩을 추천해주신 노마드코더의 딩코님께 감사드린다.

- 그에 대한 나의 생각

타입스크립트에 대해 고민이 많았다. 그 고민의 끝은 자바스크립트를 더욱 깊이 있게 공부하자는 부분으로 연결되었다.

그리고 그 해답이 딥 다이브에 담겨있었다!

처음 자바스크립트를 공부하려고 샀던 5월에는 모르는 개념이 많았는데, 5개월 사이에 부쩍 성장한 나를 발견했다.

10월이 다 가기 전, 딥 다이브를 통해 한층 더 단단한 자바스크립트 개념을 가지고 리액트, 리덕스, 타입스크립트를 마주할 생각을 하니 정말 설레는 여정이 될 것 같다💖 :)

- 내가 바라는 것

🍊 자바스크립트를 이해한 후, 더욱 재밌게 느껴질 리액트, 리덕스, 타입스크립트를 얼른 마주하고 싶댜

얼마나 재밌을까 꺄랄라

🍊 공부량을 뒷받침할 기초 체력 및 근력 성장

---

💖 가치 높이기

- 잘한 점 칭찬하기 : 무한한 가능성을 가진 존재인 나를 믿고 조바심 내지 않고 꾸준히 달려간 점. 추천한 공부 방법을 바로 실행한 점.
- 아쉬운 점 : 오늘은 완벽한 컨디션이었다 :) 아쉬웠다고 하면 너무 많이 달려서 계속 다리가 아프다? ㅎㅎ
- 어떻게 개선할 수 있을까? : 스트레칭 잘하고 잘 자고 일어나기!