TypeScript는 널리 사용되는 오픈 소스 프로그래밍 언어로 JavaScript를 기반으로 하며 정적 타이핑을 언어에 추가한다. 개발자가 보다 유지 관리 및 확장 가능한 코드를 작성할 수 있도록 설계되었으며 최근 몇 년 동안 많은 주목을 받았다. 이 글에서는 JavaScript 프로젝트에서 TypeScript를 사용하려는 이유와 그에 따른 장단점을 살펴보자. TypeScript 사용의 주요 이점 중 하나는 개발 프로세스 초기에 오류를 발견하는 데 도움이 된다는 것이다. 코드에 정적 타이핑을 추가하면 TypeScript는 코드를 실행하기 전에 타입 관련 오류를 포착할 수 있으므로 나중에 디버깅하는 데 드는 시간과 노력을 절약할 수 있다. 이는 문제가 되기 전에 문제를 식별하고 수정하는 데 도움이 되므로..

리액트 프로젝트 진행 중 회원가입 페이지에서 프로필 사진을 업로드하기 위해 FormData를 사용했다. const formData = new FormData(); const data = { email: email.current.value, nickname: nickname.current.value, password: password.current.value, }; formData.append("file", fileRef.current.files[0]); formData.append( "joinData", new Blob([JSON.stringify(data)], { type: "application/json" }) ); console.log(formData) // FormData {} 위 코드와 같이 f..

자바스크립트는 언어이고, ES(ECMAScript)는 자바스크립트의 표준 규격을 의미한다. 더보기 ECMAScript 자바스크립트는 넷스케이프에서 개발했다. 그리고 그에 대항하기 위해 MS에서는 J스크립트를 만들었다. 이처럼 브라우저마다 스크립트 언어가 다르게 때문에 서로 호환이 되지 않고 파편화가 생기기 시작했다. 파편화는 간단히 말해서 똑같은 코드인데 어떤 브라우저에서는 제대로 실행되고 어떤 브라우저에서는 에러가 나는 현상을 의미한다. 이런 파편화를 막으려면 표준을 만드는 것이 중요하다. 그래서 넷스케이프는 1996년 11월에 브라우저에서 돌아가는 스크립트 언어를 표준화하기 위해서 Ecma International이라는 국제 표준화 기구에 자바스크립트 기술 규격 제정을 요청했다. Ecma Intern..

자바스크립트(JavaScript)의 자료형과 특성 느슨한 타입(loosely typed)의 동적(dynamic) 언어 자바스크립트는 느슨한 타입(loosely typed)의 동적(dynamic) 언어다. 자바스크립트의 변수는 어떤 특정 타입과 연결되지 않으며, 모든 타입의 값으로 할당 및 재할당이 가능하다. 형 변환 (type conversion) 자바스크립트는 타입이 매우 유연한 언어다. 너무 유연해서 탈이다 함수와 연산자에 전달되는 값은 대부분 적절한 자료형으로 자동 변환된다. 이런 과정을 형 변환이라고 한다. Window.alert() 메서드가 전달받은 값의 자료형과 관계없이 문자열로 변환하여 보여주는 것이나, 수학 관련 연산자가 전달받은 값을 숫자로 변환하는 경우가 형 변환의 대표적인 예라고 볼 ..

덱(Deque)이란? Double-ended queue의 약자로 삽입과 삭제가 양쪽 끝에서 모두 발생할 수 있는 선형 자료구조이다. 자바스크립트를 이용해서 양방향 큐(Deque)를 구현해보자. 구현할 메서드(method) 데이터 전체 반환 Deque.getBuffer() 데이터가 비어 있는지 확인 Deque.isEmpty() 앞쪽 데이터 추가 / 삭제 Deque.pushFront() / Deque.popFront() 뒤쪽 데이터 추가 / 삭제 Deque.pushBack() / Deque.popBack() 가장 앞쪽 데이터 반환 Deque.front() 가장 뒤쪽 데이터 반환 Deque.back() 데이터 개수 확인 Deque.size() 데이터 전체 삭제 Deque.clear() 양방향 큐 구현 - ge..

원형 큐(Circular Queue)란? 원형 형태를 가지며 먼저 들어간 데이터가 먼저 나오는 FIFO(First In First Out) 기반의 선형 자료구조이다. 자바스크립트를 이용해서 원형 큐 자료구조를 구현해보자. 구현할 메서드(method) 데이터 전체 반환 CircularQueue.getBuffer() 인덱스(index)가 비어 있는지 확인 CircularQueue.isEmpty() 인덱스(index)가 다 찼는지 확인 CircularQueue.isFull() 데이터 추가 / 데이터 삭제 CircularQueue.enqueue() / CircularQueue.dequeue() 첫 번째 데이터 조회 CircularQueue.front() 데이터 개수 확인 CircularQueue.dataSize..

우선순위 큐(Priority Queue)란? 우선순위를 고려해 먼저 들어간 데이터가 먼저 나오는 FIFO(First In First Out) 기반의 선형 자료구조이다. 정렬 방식으로 배열 기반, 연결리스트 기반, 힙(Heap) 기반 등이 존재한다. 구현할 메서드(method) 데이터 전체 반환 PriorityQueue.getBuffer() 비어 있는지 확인 PriorityQueue.isEmpty() 데이터 추가 / 데이터 삭제 PriorityQueue.enqueue() / PriorityQueue.dequeue() 첫 번째 데이터 조회 PriorityQueue.front() 데이터 개수 확인 PriorityQueue.size() 데이터 전체 삭제 PriorityQueue.clear() 우선순위 큐 구현 ..