일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 |
- Native select
- 버블정렬
- input class
- nodejs
- JavaScript Deep Dive
- 코드스테이츠 메인프로젝트
- OSI 7계층
- 페이지네이션
- 배열
- 재귀함수
- 코드스테이츠
- 자바스크립트
- 코딩테스트
- javascript
- sort
- 알고리즘
- 정규표현식
- 프론트엔드
- 자료구조
- next/Image
- Node js
- CSS
- kakao map api
- MUI
- react js
- 백준
- 이벤트 루프
- 백준 nodeJS
- primitive type
- 유데미
- Today
- Total
목록javascript (21)
신입 개발자에서 시니어 개발자가 되기까지
문제 calendar 기능을 개발하던 중 월 단위로 다음달 또는 이전달로 이동할 때마다 서버에 요청해서 데이터를 받아와야하는 상황이었다. 그런데 유저가 연속으로 빠르게 2~3번을 이동한다고 가정을 하고 테스트를 해보니 가끔 2번째 클릭보다 3번째 클릭의 api response가 더 빨라서 setState는 두 번째 클릭을 기준으로 실행되었다. 정확하게는 세 번째 api 요청에도 setState가 실행되고 두 번째 api 요청에도 setState가 실행됐지만, 마지막에 실행된 setState를 기준으로 state가 저장되니까 두 번째 api 응답에 대한 데이터가 화면에 출력되었다. 게다가 어차피 3개월 뒤 혹은 5개월 뒤 정보를 보기 위해 빠르게 클릭했을 땐 그 사이에 존재하는 api 요청은 무의미한 것으..

1.변수를 참조하고 있는 함수를 변수 선언보다 먼저 호출했을 때. 초기화 이전에 접근을 했다는 오류는 변수 선언보다 앞에서 변수를 참조하면 흔히 볼 수 있는 에러다. 근데 함수를 사용하면서 전역변수를 참조했는데,(인자로 전달해야 하지만, 깜빡하고 그냥 했다가 오류를 마주했다) 이 에러가 발생했다. const input = require("fs").readFileSync("example.txt").toString().trim(); let triangle = input.split("\n"); for (let i = 0; i < triangle.length - 1; i++) { makeArray(triangle[i]); } let newArr = []; function makeArray(string) { le..

문제 김진영이 듣도 못한 사람의 명단과, 보도 못한 사람의 명단이 주어질 때, 듣도 보도 못한 사람의 명단을 구하는 프로그램을 작성하시오. 입력 첫째 줄에 듣도 못한 사람의 수 N, 보도 못한 사람의 수 M이 주어진다. 이어서 둘째 줄부터 N개의 줄에 걸쳐 듣도 못한 사람의 이름과, N+2째 줄부터 보도 못한 사람의 이름이 순서대로 주어진다. 이름은 띄어쓰기 없이 알파벳 소문자로만 이루어지며, 그 길이는 20 이하이다. N, M은 500,000 이하의 자연수이다. 듣도 못한 사람의 명단에는 중복되는 이름이 없으며, 보도 못한 사람의 명단도 마찬가지이다. 출력 듣보잡의 수와 그 명단을 사전순으로 출력한다. 코드 const input = require("fs").readFileSync("example.txt..
문제 수직선 위에 N개의 좌표 X1, X2, ..., XN이 있다. 이 좌표에 좌표 압축을 적용하려고 한다. Xi를 좌표 압축한 결과 X'i의 값은 Xi > Xj를 만족하는 서로 다른 좌표의 개수와 같아야 한다. X1, X2, ..., XN에 좌표 압축을 적용한 결과 X'1, X'2, ..., X'N를 출력해보자. 입력 첫째 줄에 N이 주어진다. 둘째 줄에는 공백 한 칸으로 구분된 X1, X2, ..., XN이 주어진다. 출력 첫째 줄에 X'1, X'2, ..., X'N을 공백 한 칸으로 구분해서 출력한다. 코드 const input = require("fs").readFileSync("example.txt").toString().trim(); const..
시작에 앞서 - class 생성 class Node { constructor(val) { this.val = val; this.next = null; } } class SingleLinked { constructor() { this.head = null; this.tail = null; this.length = 0; } } 아래 메서드들은 class SingleLinked의 메서드들이다. 1. Push push(val) { /* 의사코드 1. 전달된 value로 새로운 노드를 생성한다. 2. 헤드가 없다면 리스트가 비어있으므로 전달된 값을 head와 tail에 할당한다. 3. 리스트가 비어있지 않다면, 마지막 노드의 next를 전달된 값으로 할당한다. length도 추가. 4. */ let newNode..

1. 클래스 a. 개념 i. 사전에 정의된 속성 및 메소드들을 이용해 객체를 생성하기 위한 청사진 ii. 엄격하게 보면 자바스크립트가 클래스를 지원하는 것은 아니다. 자바스크립트에 이미 존재하는 프로토타입 기반 상속자들을 구문적으로 눈속임한 것.b. 인스턴스 i. 클래스 생성자함수로 생성된 객체. Array 생성자함수로 생성된 배열 또한 인스턴스다.c. 클래스 메서드 i. static : 클래스에 종속되는 반면 클래스의 개별 인스턴스 메서드에는 종속적이지 않은 메서드를 생성할 때 사용한다. 한마디로, 인스턴스 없이 호출되는 메서드다.d. 클래스에서의 this i. 클래스로부터 생성된 객체, 즉 실제 인스턴스를 참조한다.2. 싱글 연결 리스트(단일방향 연결리스트) a. 개념 i. what is linked..

예시 코드가 매우 길고, 리팩터링 단계마다 예시 코드를 쓸 수 없어서 코드는 생략한다. 1. 긴 함수를 리팩토링 할 때 a. 전체 동작을 각각의 부분으로 나눌 수 있는 지점을 찾는다.(함수 추출하기) i. 스코프를 벗어나는 변수, 즉 새함수에서 곧바로 사용할 수 없는 변수 확인하기 ii. 새 함수에서 필요하지만, 값을 변경하지 않는 변수면 매개변수로 전달하기 iii. 수정을 할 때마다 곧바로 테스트를 해서 확인한다. 이 간격이 좁을 수록 오류가 발생했을 때 찾기 쉽다. iv. 테스트를 해서 문제가 없으면 깃 로컬에 커밋한다. 자잘한 변경들이 모여 의미 있는 단위로 뭉치면 그 때 푸시.b. 임시 변수를 질의 함수로 바꾸기(지역변수 제거하기, 변수 인라인) i. 지역변수에 할당하고 있는 그 값을 리턴하는 함..

1. 개념 a. 정수의 자리수를 이용하여 각 요소간 비교를 하지 않고 요소들을 정렬한다. b. 참고로 이때까지 공부했던 정렬들은 모두 비교 정렬이다. 비교 정렬의 최상의 케이스에서 시간복잡도는 O(n log n)이다. 기수정렬은 비교를 하지 않으므로 속도가 매우 빠르다(시간복잡도: O(log n) ) 2. 로직(getDigit) a. 자릿수 별로 숫자 알아내기(getDigit) i. 숫자를 받아서 문자열로 변환 후 각 인덱스 별로 버킷으로 구분하기. 문자열의 인덱스가 앞에서부터 시작하는 게 문제. =>음수 인덱스 사용해서 해결할 수는 있다. 또한 문자열을 다시 숫자로 바꿔줘야 한다. ii. 또는 10진수임을 활용해 10, 10^2, 10^3 등으로 나누어가면서 계산해서 구하는 방법이 있다.b. 가장 큰 ..