강의 들으면서 복습겸 적은거라 나중에 따로 정리를 다시 하던가 해야겠다.프로젝트 생성npx create-react-app [프로젝트명]프로젝트 실행npm start // http://localhost:3000HMR(Hot Module Replacement) : 코드 수정 시 화면에 바로 반영Component함수형 컴포넌트JSX(JavaScript XML) 스타일은 객체 형태로 전달해야 적용이 된다. 카멜케이스로 작성 중괄호({ }) 내부에서 변수 사용 가능재사용에 용이import Hello from "./component/Hello";function App() { const name = "Tom"; const naver = { name: "네이버", url: "https://naver..

스코프(Scope)란?MDN에서 정의하는 스코프스코프는 컨텍스트 내에서 값과 표현식이 "표현"되거나 참조 될 수 있는 현재 실행 컨텍스트(Execute Context)를 의미한다.만약 변수 또는 표현식이 "해당 스코프"내에 없으면 사용할 수 없다. 스코프는 또한 계층적인 구조를 가지며, 하위 스코프는 상위 스코프에 접근할 수 있지만 그 반대는 불가하다. 🌿 스코프의 기본 개념- 변수나 함수의 접근 가능한 범위를 의미한다.- 코드의 구조를 이해하는 데 중요한 역할을 하며, 변수의 생명 주기와 유효성을 결정한다.- 모든 변수와 함수는 선언 위치에 의해 스코프를 갖게 된다.// 전역 스코프let globalVar = "I'm global!";function outerFunction() { // 지역 ..

자바스크립트 복습을 하던 중 클로저가 아직 헷갈려 다시 공부하며 정리해 보고자 한다.클로저를 공부하기 전 스코프에 대한 개념 정리 및 이해가 필요하다. 클로저(Closure)란?JS에서 중요한 개념이지만, JS 고유의 개념이 아닌 함수형 프로그래밍 언어에서도 사용되는 특성이다.MDN에서 정의하는 클로저 클로저란 함수와 함수가 선언된 어휘적 환경 (lexical environment)의 조합이다.즉, 클로저는 내부 함수에서 외부 함수의 범위에 대한 접근을 제공. JavaScript에서 클로저는 함수가 생성될 때마다 생성 🌿 클로저의 기본 개념- 함수와 그 함수가 선언된 렉시컬 환경의 조합으로, 내부 함수가 외부 함수의 변수에 접근할 수 있게 해 준다.- 함수가 자신의 외부 스코프에 있는 변수에 접근할 수..

호이스팅(Hoisting) 이란?변수와 함수 선언이 코드의 상단으로 끌어올려진 것처럼 동작하는 JS 고유의 특징이는 자바스크립트 엔진이 코드를 실행하기 전에 변수와 함수 선언을 메모리에 미리 저장하는 방식 때문에 발생한다.호이스팅 대상변수 선언(변수 호이스팅)과 함수 선언문(함수 호이스팅)🌿 변수 호이스팅변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 JS 고유의 특징console.log(name); // undefinedvar name = 'hjlee';console.log(name); // hjleevar로 선언된 변수는 선언만 호이스팅되고, 초기화는 호이스팅되지 않아 처음 호출 시 undefined 출력let과 const로 선언된 변수는 호이스팅되지만, TDZ에 영향을 받아 초기화되기 ..

퇴사 후에 이것저것 계획을 세우긴 했지만, 너무 우당탕이어서 일단 프론트엔드 복습부터 해보자항상 프로젝트를 진행하면서 필요한 기능만 검색해서 적용했더니 프론트엔드 이론을 제대로 공부해본 적이 없었다. 그래서 유튜브를 통해 한 번 훑어보고 시작하기로 결정했다.JAVASCRIPT코딩앙마 - 자바스크립트 중급 강좌 : 140분 완성기초지만 잘 안쓰는 것들은 다시 봐도 새로워서 반복이 중요하다는 걸 다시 느꼈다.오늘 일단 중급 강좌 하나만 들어서 차차 복습하는 내용들을 이어서 적을 예정이다. 모던 자바스크립트 Deep Dive마침 책도 있고 유튜브에 스터디 강의가 있길래 1.5배속으로 수강하고 복습해야지 모던 자바스크립트 Deep Dive를 틈틈이 읽으며 사이드 프로젝트를 진행하는 중인데역시나 React에 대한..