Today Hailie Learned

✔️ 실행 컨텍스트란? 자바스크립트의 동작 원리를 담고 있는 핵심 개념이다. 실행 컨텍스트는 식별자 (변수, 함수, 클래스 등)를 등록하고 관리하는 스코프와 코드 실행 순서 관리를 구현한 내부 메커니즘으로, 모든 코드는 실행 컨텍스트를 통해 실행되고 관리된다. 식별자와 스코프는 실행 컨텍스트의 렉시컬 환경으로 관리하고 코드 실행 순서는 실행 컨텍스트 스택으로 관리한다. ✔️ 소스 코드의 과정 1. 소스코드의 평가 => 실행 컨텍스트를 생성하고 변수, 함수 등의 선언문만 먼저 실행하여 생성된 변수나 함수 식별자를 키로 실행 컨텍스트가 관리하는 스코프에 등록한다. 2. 소스코드의 실행 => 선언문을 제외한 소스코드가 순차적으로 실행된다. (런타임 시작) / 소스코드 실행에 필요한 정보는 스코프에서 검색해서 ..

✔️ 이번 정독을 통해 알게 된 것 전역 변수와 지역 변수의 생명주기를 설명해주세요. 전역 변수 사용을 억제해야하는데 그 이유가 무엇인가요? 🤔 전역 변수와 지역 변수의 생명주기를 설명해주세요. 🤓 전역 변수는 애플리케이션의 생명 주기와 대체로 같습니다. 지역 변수는 함수가 호출되어 실행되는 동안에만 유효합니다. 🤔 전역 변수 사용을 억제해야하는데 그 이유가 무엇인가요? 🤓 전역 변수는 생명 주기가 길기 때문에 메모리 리소스도 길게 사용할 뿐더러, 전역 상태를 의도치 않게 변경할 가능성도 커진다는 것이기 때문에 전역 변수 사용을 억제해야합니다. ✔️ 변수의 생명 주기 지역 변수의 생명 주기 => 함수가 호출되어 실행되는 동안에만 유효하다. 전역 변수의 생명 주기 => 애플리케이션의 생명 주기와 같다. 변..

✔️ 이번 정독을 통해 알게 된 것 스코프란 무엇인가요? 블록 레벨 스코프를 설명해보세요. 스코프 체인이 무엇인가요? 🤔 스코프가 무엇인가요? 🤓 스코프는 식별자가 유효한 범위를 말합니다. 모든 식별자(변수명, 함수명, 클래스명 등)는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 스코프가 결정됩니다. 🤔 블록 레벨 스코프를 설명해보세요. 🤓 함수 내부 뿐만 아니라 모든 코드 블럭(if, for, while, try/catch)이 지역 스코프를 만드는 것이 블록 레벨 스코프이고 let, const 가 이에 해당됩니다. 🤔 스코프 체인이 무엇인가요? 🤓 스코프가 계층적으로 연결된 것을 스코프 체인이라고 하는데, 모든 지역 스코프의 최상위 스코프는 전역 스코프입니다. 변수를 참조할 때..

✔️ 이번 정독을 통해 알게 된 것 함수가 왜 필요한가요? 함수 선언문과 함수 표현식은 어떤 차이가 있나요? 원시 타입 인수와 객체 타입 인수는 어떤 차이가 있나요? 함수형 프로그래밍은 무엇이고 왜 필요한가요? 🤔 함수가 왜 필요한가요? 🤓 함수는 몇 번이든 호출할 수 있으므로 코드의 재사용 측면에서 매우 유리하기 때문입니다. 그리고 유지보수의 편의성을 높이고 실수를 줄여서 코드의 신뢰성을 높이는 효과가 있습니다. 🤔 함수 선언문과 함수 표현식은 어떤 차이가 있나요? 🤓 함수 선언문과 함수 표현식 모두 자바스크립트의 특징으로 인하여 호이스팅이 일어난다는 특징이 있지만, (런타임 이전에 식별자를 생성함) 함수 선언문은 암묵적으로 생성된 식별자는 함수 객체로 초기화되어 선언문 이전에 호출하면 호출이 가능합니..

✔️ 이번 정독을 통해 알게 된 것 변수가 왜 필요한지? 호이스팅이란? 🤔변수가 왜 필요한가요? 🤓 자바스크립트를 해석하고 실행하는 자바스크립트 엔진이 코드를 평가하려면 변수 선언을 통해 자바스크립트 엔진에 식별자의 존재를 알려야 하기 때문입니다. 🤔호이스팅이란 무엇인가요? 🤓 변수 선언이 어디에 있든지 상관없이 어디서든 변수를 참조할 수 있습니다. 이것은 자바스크립트 고유의 특징이기 때문에 모든 변수, 함수, 클래스는 호이스팅이 일어납니다. (모든 선언문은 런타임 이전 단계에서 먼저 실행되기 때문!) ✔️ 변수 변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 혹은 그 메모리 공간을 식별하기 위해 붙인 이름을 말합니다. ▸ 변수에 값을 저장하는 것을 할당이라고 합니다. ▸ 변수에 저장된 값을 ..

보호되어 있는 글입니다.

프로젝트 마무리 단계에서나 배포하기 전에 확인하면 좋을 내용을 간단히 정리합니다. 1. 웹 페이지 Title에는 React App 또는 Vite + React app가 아니라 파비콘과 앱 이름이 정확히 적혀 있어야 합니다. 저는 프로젝트에서 Vite라는 빌드 도구를 사용했습니다. 아무런 설정을 하지 않으면 아래와 같이 웹 탭이 생성이 되는데, 프로젝트를 배포할 때에는 꼭 설정을 해서 완성도를 높여야 합니다. 2. SNS로 다른 사람에게 링크로 공유시 og 카드는 제대로 나와야 합니다. (Open Graph태그 설정하기) 'og 카드'라는 단어가 생소해도 위의 캡쳐본을 보면 한눈에 알겠죠? og 카드는 SNS미리보기 화면이라고 생각하면 되고, SNS에 게시되는데 최적화된 데이터를 가질 수 있도록 설정하는 ..

이 내용은 우아한테크코스 테코톡 영상을 보고 정리한 글입니다. MVC란? 유지보수가 편해지는 코드 구성 방식! Model : 데이터와 관련된 부분 View : 사용자한테 보여지는 부분 Controller : Model과 View를 이어주는 부분 MVC는 왜 생겨났을까? 코드가 많아지면 많아질수록 코드가 복잡해져서 코드를 파악 하기도 힘들어지고 기능을 수정할 때마다 대부분의 코드를 갈아엎는 경우가 많았다고 합니다. 유지보수를 편하게 하기 위해 고민하다가 생겨나게 된 디자인 패턴이 바로 MVC 입니다. MVC 맛보기 1. 유저가 '무언가'를 검색함 2. Controller는 유저가 검색한 데이터를 Model에게 요청함. 3. Model은 결과 데이터를 Controller에게 줌 4. Controller는 M..

방법1 const solution = (arr) => { let newArr = [] for(let x of arr){ let newarr = x.toString().split('').reverse().reduce((a,b) => a+b,0) newArr.push(Number(newarr)) } console.log(newArr); } solution([32, 55, 62, 20, 250, 370, 200, 30, 100]) // 결과 [ 23, 55, 26, 2, 52, 73, 2, 3, 1 ] 방법2 const solution = (arr) => { let newArr = [] for(let x of arr){ let result = 0; while(x){ let t = x % 10; result =..