도록

문제 설명 (링크)햄버거 가게에서 일을 하는 상수는 햄버거를 포장하는 일을 합니다. 함께 일을 하는 다른 직원들이 햄버거에 들어갈 재료를 조리해 주면 조리된 순서대로 상수의 앞에 아래서부터 위로 쌓이게 되고, 상수는 순서에 맞게 쌓여서 완성된 햄버거를 따로 옮겨 포장을 하게 됩니다. 상수가 일하는 가게는 정해진 순서(아래서부터, 빵 – 야채 – 고기 - 빵)로 쌓인 햄버거만 포장을 합니다. 상수는 손이 굉장히 빠르기 때문에 상수가 포장하는 동안 속 재료가 추가적으로 들어오는 일은 없으며, 재료의 높이는 무시하여 재료가 높이 쌓여서 일이 힘들어지는 경우는 없습니다.예를 들어, 상수의 앞에 쌓이는 재료의 순서가 [야채, 빵, 빵, 야채, 고기, 빵, 야채, 고기, 빵]일 때, 상수는 여섯 번째 재료가 쌓였을..

전통적인 개발 방식의 단점 (html, css, Javascript)1. 유지보수의 어려움2. dom 조작의 비효율성 : 브라우저 렌더링 효율이 좋아짐3. 재사용성 부족  React가 불러온 개발 방식의 변경- Multi Page Application -> Single Page Application: html 을 불러오는 시간 단축 - Server Side Rendering -> Client Side Rendering -- 장점 ; DOM apis 에 대하여 Full Access 를 갖고 있다-- 단점 : 검색엔진 최적화(SEO)에 불리하다    React 프로젝트 만들기1. CRA (Create React App)2. Vite3. Gatsby4. NextJs (프레임워크)  React 주요 개념1. 가..

개발 하는 데 꼭 필요한 헬스 운동 루틴... 12시간 정도 앉아있으려면 운동을 꼭 해야한다. 진짜... 정말로  상체푸쉬업153~4숄더프레스15~203~4사이드/프론트 리터럴 레이즈204어시스트 풀업153~4  하체스모 스쿼트204힙 어브덕션15~203덤벨 스티프 데드리프트204힙 익스텐션 어브덕트 (뒷발, 옆발차기) 203~4

함수 선언시 function* (){}와 같이 *을 붙여서 선언한다. 함수 내부에서 yield가 있을 때마다 멈추고 대기 상태가 되며, next가 실행될 때마다 대기하던 yield를 지나쳐 실행된다.var addCoffee = function (name) {    return new Promise(resolve => {         setTimeout(() => {             coffeMaker.next(prevName ? `${prevName}, ${name}` : name;         }, 500);    });}var coffeGenerator = function* () {    const espresso = yield addCoffee("", "에스프레소");    console...

문제 설명 (링크)휴대폰의 자판은 컴퓨터 키보드 자판과는 다르게 하나의 키에 여러 개의 문자가 할당될 수 있습니다. 키 하나에 여러 문자가 할당된 경우, 동일한 키를 연속해서 빠르게 누르면 할당된 순서대로 문자가 바뀝니다.예를 들어, 1번 키에 "A", "B", "C" 순서대로 문자가 할당되어 있다면 1번 키를 한 번 누르면 "A", 두 번 누르면 "B", 세 번 누르면 "C"가 되는 식입니다.같은 규칙을 적용해 아무렇게나 만든 휴대폰 자판이 있습니다. 이 휴대폰 자판은 키의 개수가 1개부터 최대 100개까지 있을 수 있으며, 특정 키를 눌렀을 때 입력되는 문자들도 무작위로 배열되어 있습니다. 또, 같은 문자가 자판 전체에 여러 번 할당된 경우도 있고, 키 하나에 같은 문자가 여러 번 할당된 경우도 있습..

Null 병합 연산자 (??)좌변이 null 이나 undefined 일 때만 우변을 평가합니다.console.log(null ?? 'right');              // 출력: rightconsole.log(undefined ?? 'right');    // 출력: rightconsole.log('' ?? 'right');                   // 출력: ''console.log(0 ?? 'right');                  // 출력: 0

객체 Destructuring 1) 다중 속성 추출const coffe = {    name : '커피',    price : 4000};const { name, price } = coffe;console.log(name);   // 커피console.log(price);    // 4000 2)함수 매개변수function menu({name, age}) {  console.log(`오늘의 커피는 ${name}이고 가격은 ${age}원입니다.`)}const todayCoffe = {    name : '카페라떼',    price : 5000};menu(todayCoffe);  배열 Destructuringconst colors = ['red', 'orange', 'yellow', 'green'];con..

일급 객체1. 무명의 리터럴로 생성할 수 있다. 즉 런타임에 생성이 가능하다.2. 변수나 자료구조에 저장할 수 있다.3. 함수의 매개변수에 전달할 수 있다.4. 함수의 반환값으로 사용할 수 있다. 함수 객체의 프로퍼티1. arguments : 매개변수 객체 순회 가능한 유사 배열 객체이며,함수 내부에서 지역 변수처럼 사용된다.매개변수 개수를 확정할 수 없는 가변 인자 함수를 구현할 때 유용하다. 2. caller : 함수 자신을 호출한 함수.참고) 비표준 프로퍼티이기에 사용하지 말자 3. length : 선언한 매개변수의 개수arguments.length와 함수 객체의 length는 다른 수 있다.  4. name : 함수의 이름  5. __proto__ 접근자 : [[prototype]] 내부 슬롯이 ..