입력 값에 따른 새로고침 없이 바로 메뉴 검색 입력 값에 따라 더미데이터에 있는 메뉴 자동완성자동 완성 클릭 시 해당 메뉴 렌더링css는 생략합니다. MenuProvider.jsMeals.jsAvailableMeals.jsMenuSearch.jsuseContext, c

Function Component의 줄임말로 React + TypeScript 조합으로 개발할 때 사용하는 타입함수형 컴포넌트 사용 시 타입 선언에 쓸 수 있도록 React에서 제공하는 타입React.FC를 사용하는 경우 위와 같이 props의 타입을 Generics로

클래스는 객체지향 프로그래밍에서 특정 객체를 생성하기 위해 변수와 메소드를 정의하는 일종의 틀로, 객체를 정의하기 위한 상태(멤버 변수)와 메서드(함수)로 구성된다. 이렇게 클래스를 생성한 후, new MyClass() 를 호출하면 내부에서 정의한 메서드가 들어 있는

이벤트 event 는 무언가 일어났다는 신호이다.모든 DOM 노드는 이런 신호를 만들어 낸다. 아래는 자주 사용되는 DOM 이벤트이다. 이벤트에 반응하기 위에서 이벤트가 발생했을 떄 실행되는 함수인 핸들러 handler 를 할당해야 한다. 핸들러는 사용자의 행동에 어떻

Promise 는 JS에서 비동기 처리를 위해 광범위하게 사용되는 것이다. ES6에서 이것이 도입되기 전까지는 주로 콜백 함수를 다른 함수의 인자로 넘겨서 비동기 처리를 했었다. 이 방식은 단순한 코드를 작성할 때에는 문제가 생기지 않았지만, 콜백 함수를 중첩해서 연쇄

Synchronous 동시에 발생하는 single thread 한 작업이 실행되는 동안 다른 작업은 멈춘 상태를 유지하고 자신의 차례를 기다리는 것▪ 순차적, 직렬적으로 수행한다.▪ 요청을 보냈다면, 응답을 받아야 다음 동작이 이루어진다.▪ 작업 중단 blocking

DOM을 이용하면 요소와 요소의 콘텐츠에 무엇이든 할 수 있다. 먼저, 조작하고자 하는 DOM 객체에 접근해야 한다. DOM에 수행하는 모든 연산은 document 객체에서 시작한다. document 객체는 DOM에 접근하기 위한 진입점이다. 원리를 배우기 전에 일단은

JS는 본래 웹 브라우저에서 사용하려고 만든 언어였다. 진화를 거쳐 현재의 다양한 플랫폼을 지원하는 언어로 변해왔다. JS가 돌아가는 플랫폼을 호스트 host 라고 부르며, 호스트는 브라우저, 웹서버, 심지어는 커피 머신이 될 수도 있다. 각 플랫폼은 특정되는 기능을

객체의 속성 중 함수 자료형인 속성을 메서드 method 라고 한다. 이렇게 객체 프로퍼티에 할당된 함수를 메서드라고 한다. 위 예시에서는 user 에 할당된 like 와 sayHi 가 메서드이다.객체 리터럴 안에 메서드 선언할 때 사용할 수 있는 단축 구문이다. 메서

object객체란 한 마디로 정의하면 '실제로 존재하는 사물'로, 키 key 와 값 value 으로 구성된 속성 property 을 가진 JS의 기본 데이터 타입이라고 말할 수 있다. JS에는 8가지 자료형이 있는데, 이 중에 7개는 오직 하나의 데이터(문자열, 숫자

callbackJS는 함수도 하나의 자료형으로 취급하기 때문에 매개변수로 전달할 수 있다. 이렇게 매개변수로 전달하는 함수를 콜백 함수라고 한다. 함수를 함수의 매개변수로 전달하고, 나중에 필요할 때 호출한다는 의미에서 call back 이라고 불려진다. 위 코드를 아

JS는 함수도 하나의 자료라는 개념을 가지고 있다.다른 언어에서처럼 함수를 지정된 위치에서 만들지 않아도 되고, 특별한 동작을 하는 구조로 취급되지 않는다. 함수 표현식은 let showMessage = ...; 와 같은 구문 안에서 값의 역할을 하기 때문이다. 모든

함수는 코드의 집합을 나타내는 자료형이다.함수를 사용하는 것을 함수 호출, 함수를 호출하다 라고 표현한다.함수를 호출할 때 전달하는 자료를 매개 변수 라고 부르며,함수를 호출에서 최종적으로 나오는 결과를 리턴값 이라고 한다. 반복 작업 최소 : 반복되는 코드를 한 번

if 조건문은 조건에 따라서 코드를 실행하거나 실행하지 않을 때 사용하는 구문이다. 이 때 조건은 boolean 자료형을 의미한다.비교 연산자 와 논리 연산자 를 활용하여 조건을 만들고, 이 조건을 사용하여 조건 분기를 한다.else 는 if 문 뒤에 사용하며, if

배열 Array 은 여러 개의 변수를 한 번에 선언하여 다룰 수 있는 자료형이다.배열 내부에 있는 값을 요소 element 라고 하고, 요소의 순서를 인덱스 index 라고 한다. 인덱스는 0부터 시작한다.JavaScript 배열은 길이와 각 요소의 자료형이 고정되어

🎇Linked List 구현하기 객체 생성 LinkedList.java Main.java 노드 구현 노드는 실제로 데이터가 저장되는 그릇과 같은 것이다. 자바는 객체지향 언어이기 때문에 노드는 객체로 만들기 딱 좋은 대상이며, 노드 객체는 리스트의 내부 부품이기

Linked List는 Array List와 다르게 엘리먼트와 엘리먼트 간의 연결(link)을 이용해서 리스트를 구현한 것을 의미한다. 그래서 이름도 Linked List이다. Linked List에서 연결은 무엇일까? 또 연결이 아닌 것이 무엇인지 생각해보자.먼저 컴

ArrayList는 Collection Framework 중 List 인터페이스에 해당된다. 그래서 저장 순서가 유지되고 중복을 허용한다는 특징이 있다. 여러 개의 데이터를 쉽고 효율적으로 관리할 수 있는 표준화된 방법을 제공하는 클래스 중 하나이다. 출처 TCPSCH

ArrayList는 Array를 이용해서 List를 구현한 것을 의미한다.장점은 내부적으로 Array를 이용하기 때문에, Index를 이용한 접근이 빠르다.단점은 데이터의 추가와 삭제가 느리다. List와 Array의 가장 큰 차이는 크기가 정해져 있지 않고 동적으로

들어가기 전에, 빠르게 JAVA의 Array API를 훑어보도록 하자Array의 선언과 초기화를 따로 진행해야 할 경우 (이미 선언된 Array를 초기화할 경우)메소드의 인수로 Array를 전달하면서 초기화해야 할 경우자료형\[] 배열명 = new 자료형\[]{요소1