HYEWON JUNG의 개발일지

이번주의 목표 자바스크립트 강의 정리 끝내기 리액트 강의 2회독 내가 만들고 싶은 페이지 구성해보기 부채 강의 없애기 오늘의 목표 React 강의 1회독 자바스크립트 4강 정리 오늘의 개발, 새롭게 알게된 것 React component 2023.10.31 - [React] - React Component 구성/JSX문법 React Component 구성/JSX문법 컴포넌트를 통해 UI를 재사용이 가능한 개별적인 여러조각으로 나누고, 각조각을 개별적으로 살펴볼수 있습니다(독립적이다.). 개념적으로 컴포넌트는 JavaScript함수와 유사합니다. "prop"(input)라 hyewonjung-coding.tistory.com React Props 2023.10.31 - [React] - React prop..

props = 컴포넌트끼리 정보/데이터 교환 방식= 부모 컴포넌트가 자식 컴포넌트에게 물려준 데이터 1. props는 반드시 부모에서 자식으로만 흐른다. 2. props는 반드시 읽기 전용으로 취급하며, 변경하지 않는다. function Child(props){ return내가{props.GrandFa2} 손자다 } function Parents(props){ // console.log("props", props.GrandFaName) 확인 const GrandFa = props.GrandFaName; return } function GrandFa(){ const name = "할아버지" return } function App(){ return } 위 예제로 보면 GrandFa..

리액트의 핵심 빌딩 블록이다. 컴포넌트를 통해 UI를 재사용이 가능한 개별적인 여러조각으로 나누고, 각조각을 개별적으로 살펴볼수 있습니다(독립적이다.). 개념적으로 컴포넌트는 JavaScript함수와 유사합니다. "prop"(input)라고 하는 임의의 입력을 받은 후, 화면에 어떻게 표시되는 지를 기술하는 React엘리먼트(output)를 반환합니다. 이렇듯 UI요소를 표현하는 최소한의 단위이며 화면의 특정부분이 어떻게 생길지 정하는 선언체입니다. React Component 함수형 컴포넌트 // props(//input)라는 입력을 받음 // React 엘리먼츠(//output)를 반환(return) function Welcome(props) { return Hello, {props.name}; } ..

1. 호출 시점에 대한 제어권 let count = 0; let timer = SetInterval(function(){ console.log(count); if(++count>4)ClearInterval(timer); },300); //SetInterval이 함수 실행 제어권을 가지고 있다. //만약 제어권을 우리가 가지고 있다면 함수는 1번 돌고 멈춘다. let count = 0; let Func = function(){ console.log(count); if(++count>4)ClearInterval(timer); } let timer = SetInterval(Func,300); //이렇게 SetInterval의 매개변수를 따로 선언함. 위와 같은 식 // 만약 호출을 Func(); 로만 했다면 ..

실행 컨텍스트 = 코드에 제공할 환경 정보들을 모아놓은 객체 => 선언된 변수를 위로 끌어올리고 /hoisting => 외부환경정보를 구성하고 => this를 바인딩 콜스텍 = 실행콘텍스트가 담기는 장소 => 코드의 순서를 보장함 실행콘텍스트가 있는 장소를 대표적으로 스택과 큐로 나눌 수 있는데 스택은 Last in First out 컵 모양을 생각하면 되고 , 큐는 First in First out 위아래가 뚫린 원기둥이라고 생각하면된다. VariableEnvironment => 현재 실행할 코드에 식별자 정보 record를 지님 => outer를 지님 => LexicalEnvironment의 snapshot LexicalEnvironment => 현재 실행할 코드에 식별자 정보 record를 지님 =..

오늘의 목표 3강 정리 async await 이해하기 이해도 문제 4번 풀기 오늘의 개발, 새롭게 알게된 것 보충반 특강에서 async await, .then .catch등을 배웠는데 한가지 확실하게 안 것은 await가 붙어있는 곳이 기다리다가 실행이 된다고 생각했는데 await가 붙은 로직의 다음 로직에 적용이 된다는 것? => 확실하게 이해가 된 것은 아니지만 개인과제의 .then을 async await로 바꿔보는 연습하기 비동기함수를 어느정도 더 이해하고 나니까 모달을 만들기 위한 머리에 한단계 다가간 느낌이다. 지금의 fetch를 async 함수로 묶어서 선언해주고 검증 후 await으로 기다렸다가 실행 할 수 있도록 해봐야겠다. 그리고 개인 과제의 피드백이 왔다. 깃에 정신 없이 올리느라.. ..