Js (8) 썸네일형 리스트형 MVC 패턴 연습(재고관리 프로그램) 로그 #1 문제정의 시나리오작은 상점의 재고를 콘솔에서 관리하는 프로그램을 만들어라. 사용자는 콘솔 메뉴를 통해 상품을 등록/수정/삭제하고, 입고/출고로 수량을 조정하며, 검색과 정렬, 간단한 통계(총 재고 수량, 총 재고 금액)를 확인할 수 있어야 한다. 프로그램은 MVC 패턴을 따라 Model-View-Controller로 역할을 분리해야 한다. 기능 요구사항1) 상품 도메인- id: 문자열 (고윳값, 예시) P-001)- name: 문자열 (중복 가능하지만 빈 문자열은 불가능하다. 최대 50자까지 허용이다)- price: 정수(원단위며, 0이상이다)- quantity: 정수 (0이상이다)- category: 문자열 ("음료", "과자", "문구" 등) 제약사항- id는 중복이 불가능하다.- price와 quantity.. Js / JavaScript 문법 / difference between strict equality and loose equality 자바스크립트의 비교연산자는 좌항과 우항의 피연산자를 비교한 다음 그 결과를 불리언 값으로 반환한다. loose equality/strict equality operator동등비교 연산자와 일치 비교 연산자는 좌항과 우항의 피연산자가 같은 값으로 평가되는 지 비교해 불리언 값을 반환한다. 하지만 두 개는 비교하는 엄격성의 정도가 다르다. ==동등비교x == yx와 y의 값이 같음===일치비교x == yx와 y의 값과 타입이 같음!=부동등 비교x != yx와 y의 값이 다름!==불일치 비교x !== yx와 y의 값과 타입이 다름 자바스크립트에서의 동등비교 동작좌항과 우항의 피연산자를 비교할 때 먼저 implicit coersion을 통해 type을 일치시킨 후 같은 값인지 비교한다. 이는 예측불가능한 값.. JS / javascript / Promise Promise가 아닌 비동기 함수 동작에 관하여 get함수는 비동기함수이다. 비동기함수란 함수 내부에 비동기 동작 코드가 있는 함수이다.비동기함수 호출시 비동기 호출이 완료되기 전에 비동기함수는 종료된다. 위 코드를 실행하면 아래처럼 콘솔로 출력을 확인할 수 있다. 내부 동작 순서를 정리해보겠다. 1. get함수가 호출되어 send하며 이벤트 핸들러에 콜백함수를 등록한다.2. get함수가 종료되어 콜스택이 비어있다.3. 이벤트가 발생하여 테스크 큐에 콜백함수를 푸시함4. 이벤트 루프는 콜스택이 비어있으므로 콜스택에 대기하는 콜백함수를 콜스택에 푸시함5. 콜백함수는 상위스코프도 없어 값의 반환이 불가능하다. 즉, 비동기 함수는 비동기 처리 결과를 외부에 반환할 수 없고, 상위 스코프의 변수에 .. Js / javascript 문법 / async/await 비동기 처리 키워드 도입ES8 에서는 간단하고 가독성 좋게 비동기 처리를 동기처럼 구현할 수 있도록 async/await 키워드가 도입되었다. 설명async / await 는 Promise를 기반으로 동작한다. 예시코드const fetchTodo = async () => { const url = 'https://jsonplaceholder.typicode.com/todos/1'; const response = await fetch(url); const todo = await response.json(); console.log(todo);}fetchTodo(); await 키워드는 반드시 async 함수 내부에서 사용해야 하며 async 키워드를 사용한 함수는 언제나 Promise를 반환한다(명시적 반환이 없.. 단축평가(short circuit) 단축평가란 표현식을 평가하는 도중에 평가 결과가 확정된 경우 나머지 평가 과정을 생략하는 것을 말한다.자바스크립트에서의 AND연산(&&)과 OR연산(||)을 사용한 표현식은 언제나 2개의 피연산자 중 하나로 평가된다.이때 implicit coersion이 이루어지지 않고 피연산자를 그대로 반환하는 특징이 있다. OR(||)연산에서의 단축평가 let a = 'DOG' || 'CAT';|| 연산자의 왼쪽의 피연산자는 Truthy값이며 우항의 피연산자를 평가하기 전에 평가결과가 Truthy로 확정되어 'DOG'로 평가되며 a에 'DOG'가 할당된다. let a = false || 'DOG';||연산자의 왼쪽이 Falsy값이므로 우항을 평가해야 하며 우항이 'DOG'이므로 'DOG'로 평가되어 a에 'DOG'가.. 데이터 타입 자바스크립트의 타입은 크게 원시(primitive)타입과 객체(object)타입으로 나눌 수 있다. 원시(primitive)타입 원시타입은 number, string, boolean, null, undefined, symbol로 나눌 수 있다. 숫자(number)타입은 다른 static type(정적타입)언어와 다르게 정수, 실수를 구분하는 타입이 정해져 있지 않다. C언어(static type) int a = 1; float a = 0.1; long a = 1; 정수를 저장하기 위해서는 int 타입을 부동소수점수를 저장하기 위해서는 float를 타입으로 지정해준다. 자바스크립트에서는 정수만 혹은 부동소수점만 표현하기 위한 데이터타입(integer type or float type)이 존재하지 않는다. .. 표현식과 문 표현식과 문이라는 용어는 컴퓨터 공학 전반에서 사용하는 용어이며 용어의 정확한 이해와 설명할 수 있는 능력이 필요하다. 값(value)이란 무엇일까 값은 표현식이 평가되어 생성된 결과를 말한다. 그렇다면 뒤에서도 설명하지만 표현식은 무엇일까 값의 정의를 생각해보면 값으로 평가될 수 있는 식이 표현식이 아닐까 싶다. 리터럴(literal)은 무엇일까 리터럴은 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법(notation)이다. >>3 3은 그냥 아라비아 숫자가 아니라 사람이 이해할 수 있는 문자로서 값을 생성한 표기법이다. 이외에도 함수리터럴, 배열리터럴, 객체리터럴등 다양한 표기법이 있다. 표현식(expression)이란 무엇일까 표현식(expression)은 값(value.. 변수 선언과 실행, 호이스팅(hoisting) 자바스크립트의 변수 선언과 값의 할당은 조금 특이하다. 가령 console.log(score); var score; 이런 코드가 있다고 하자 score라는 변수는 선언되기 전에 console.log함수에 의해 참조된다. 따라서 reference error가 발생할 것이라고 생각할 수 있다. 변수를 선언하는 평가과정과 선언문을 제외한 코드를 실행하는 실행과정이 분리되어 있기 때문에 reference error는 발생하지 않는다. 위에 코드를 실행해보면 undefined가 콘솔창에 출력된다. 변수를 선언할 때 평가과정에서 undefined로 초기화(initialize)하기 때문이다. 이처럼 변수의 선언문이 위로 끌어 올려진 것처럼 보이는 것을 변수 호이스팅(hoisting)이라고 한다. JS에서는 변수선언문.. 이전 1 다음