BO의 개발로그

목차 1. 실행 컨텍스트란? 2. 실행할 코드와 콜스택 2.1 실행할 코드 2.2 콜스택 3. 컨텍스트에 담기는 정보 3.1 Variable Environment 3.2 Lexical Environment 3.3 This Binding 4. 생성 과정 4.1 스코프 체인의 생성과 초기화 4.2 변수 객체화 실행 4.3 this value 결정 5. 참고 링크 1. 실행 컨텍스트란? 실행 컨텍스트란, 자바스크립트 코드가 실행되고 있는 컨텍스트(환경)를 말한다. 즉, 실행 컨텍스트는 실행할 코드에 제공할 환경 정보(변수 정보)들을 담아놓은 환경이다. 함수를 실행할 때마다 그 함수에 대한 새로운 실행 컨텍스트를 생성하여 자신만의 고유한 컨텍스트에서 실행된다. 다시 말해, 하나의 함수는 본인의 고유한 실행 컨텍..

프리온보딩코스 3주차 주간 회고 > 학습 기간: 8/9(월)~8/15(일) 이번 주는 1~2주 차와 다르게 과제가 코드 리뷰와 블로깅 위주의 과제여서 비교적 여유로울 줄 알았지만 전혀 아니었던 한 주였다.... 하나의 개념 정리 블로그 글을 쓰기 위해 들인 시간이 얼마더냐.....ㅎ... 진짜 나 혼자만 보는 필기가 아닌, 개념을 정리해서 다른 사람이 읽었을 때도 이해할 수 있게 쓰는 블로그 포스팅은 정말 어려운 거구나를 깨달았던 일주일!^^... (그렇다고 성공한 거 같지도 않다...) 너무 예뻤던 이번 주의 하늘과 함께 프리온보딩코스 3주 차 주간 회고 시작해보자! ☁ 이번 주 배운 것들 🔗 [프리온보딩코스 세션 회고 #5] 리액트에서 좋은 코드와 세 번째 과제 리뷰 (2) [프리온보딩코스 세션 회고..

8/12 (목) [핵심 자바스크립트 개념 1] 세션 내용 동기와 비동기의 이해 콜백 함수 Promise async & await 0. 프론트엔드 개발자라면 가지고 있어야 할 책 Top 3 - → a.k.a 코뿔소책.... - - → 세션 끝나자마자 바로 구매 완..! 1. 관련 면접 질문 - Callback 패턴과 그의 문제점에 대해서 설명해주세요. - Promise와 Callback의 차이점은 무엇이고 각각 장단점은 무엇인지 설명해주세요. - Promise는 무엇인지 설명해주세요. - Promise All은 언제 쓰이는지 설명해주세요. - async/await와 Promise의 차이는 무엇인지 설명해주세요. - 관련 코드를 보고 예상되는 순서와 그 이유에 대해서 설명해주세요. 2. 배운 내용 정리 이번..

목차 1. 동기와 비동기 1.1 동기와 비동기란? 1.2 동기와 비동기의 장단점 1.3 비동기 처리가 필요한 이유 2. 콜백 함수 (Callback Function) 2.1 콜백 함수란? 2.2 콜백 지옥 3. 프로미스 (Promise) 3.1 프로미스란? 3.2 reject와 resolve 3.3 Chaining 3.4 state 3.5 에러 처리 3.6 더 알아보기 4. async & await 5. 더 알아보기 5.1 오늘 정리한 내용에서 확장하여 공부하면 좋은 내용 5.2 위의 내용까지도 다 공부하고 나서 추가적으로 공부하면 좋은 내용 프로미스 공부를 들어가기에 앞서, 먼저 짚고 넘어갈 내용들을 살펴보고, 프로미스에 대해서 공부해보도록 하자! 1. 동기와 비동기 1.1 동기와 비동기란? 웹 앱을 ..

1. 과제 내용 ※ 코드 리뷰를 위해 연출된 스토리입니다. 이응수 대리님이 혼자서 진행하였던 '책 찾기' 프로젝트가 예상치 못한 반응을 불러일으켰고, 회사는 서비스를 확장하고자 한다. 이응수 대리님의 코드와 결과물을 분석하고 리뷰하여 더 큰 규모의 프로그램이 될 수 있도록 개선 방향을 찾는다. 2. 과제 수행 시 신경 쓴 부분 - 실제 프로덕트라고 가정하고 리뷰한다. - 확장 가능성에 주안점을 둔다. - 좋은 점, 나쁜 점에 대해 솔직하게 반응한다. - 본인의 개발 경험 중심으로 풀어나간다. - 버그 발견 시, 추측이 아닌 구체적 방법을 제시한다. - 수정할 수 있는 부분을 다 말한다. - 클린 코드의 관점이 아니다. - 내가 멘토라고 생각하고, 신입 사원에게 코드에 대해 리뷰한다는 느낌으로 작성한다. ..

목차 1. 동시성 모델 2. 이벤트 루프 2.1 자바스크립트 엔진 2.2 Web APIs 2.3 Task Queue 3. 이벤트 루프의 실행 과정 4. 참고 링크 1. 동시성 모델 이벤트 루프에 대해서 알아보기 전에, 우리는 동시성 모델에 대해서 먼저 알아야 한다. 자바스크립트는 이벤트 루프에 기반한 동시성(concurrency) 모델을 가지고 있다. 💡 동시성이란? 실제 물리적으로 동시에 일어나는 것이 아니라, 흐름을 실행시키는 것은 하나지만 작은 타임 슬라이스 단위로 다른 흐름을 돌아가면서 실행시켜서 동시에 일어나는 것처럼 보이게 하는 방식을 말한다. 자바스크립트의 큰 특징 중 하나는 '싱글 스레드' 기반의 언어라는 점인데, 스레드가 하나라는 말은 곧 한 번에 하나의 작업만 처리할 수 있다는 뜻이다...

8/9 (월) [리액트에서 좋은 코드란?] 세션 내용 리액트에서 좋은 코드란? React에 적용할 수 있는 Clean Code 확장성을 고려하고, 재사용이 가능한 컴포넌트 설계 0. 블로그 작성 Tips 글의 대제목/소제목이 잘 분리되어 정리되어 있고, 문단이 깔끔하고, 코드의 syntax highlighting이 잘 되어 있어야 한다. 명확한 주제가 있는 글이어야 한다. - 나의 경험을 통해 다른 사람에게 새로운 정보를 전달하는가? - 특정 주제를 깔끔하고 알기 쉽게 정리하여 다른 사람들로 하여금 그 개념을 쉽게 이해할 수 있게 작성되었는가? - 인사 담당자가 읽었을 때 이 사람을 뽑고 싶게 만드는 글인가? (긍정적/협업능력/셀프피드백/회고) css, jsx, js, bash 등 언어에 맞는 synta..

8/2 (월) [React Foundation 2] 세션 내용 React: Functional/Class Component, React Hooks, Event 등 프론트엔드 라이브러리 선정 가이드 애자일 개발 0. React 학습 가이드 💡 리액트 초보라면? - 영어 잘하는 경우: 🔗 유데미 강의 - 한국어로 된 좋은 강의는 🔗 인프런 - 책 추천 : - 김민준 저. 💡 리액트 경험이 있다면! - 책 추천 : - 이재승 저. 1. 두 번째 기업 과제 Review 1.1 Routes는 상수로 작성하면 좋다! 앞으로는 두 번 이상 썼다! 하면 그냥 무조건 상수로 빼자! 유지보수를 위해서! 1.2 URL 설계 1.3 컴포넌트 파일은 일반 파일과 구분 짓기 위해 항상 대문자로 파일을 시작한다! 또, 확장명으로 ..