오늘 배운 자료구조는 힙(Heap)이다. 개념 정리는 항해 99측 강의 자료를 기반으로 썼고, 추가적인 사항은 구글링을 통해 덧붙였다. 힙(Heap) 구현은 자바스크립트로 하기 위해서 유튜브를 참고했다. 강의에서는 파이썬으로 다루는데 결국에는 heap도 내장모듈이 있어 굉장히 편리해보였다. 백준에서 힙관련 알고리즘을 풀어봤는데 구현을 처음부터 해야함에 있어서 꼭 알고 있어야겠다는 생각이들었다. 반면 파이썬으로 푼 답을 보니 다섯줄정도였나..? 아무튼 내장모듈을 써서 코드가 짧았다. 값을 추출하는 poll()부분을 이해하는데 애를 먹었고 경우의 수 하나하나 노트에 그려보며 이해하는 과정을 거쳤다. 힙 (Heap) 힙은 데이터에서 최대값과 최솟값을 빠르게 찾기 위해 고안된 완전 이진트리(Complete Bi..
퀴즈를 만들며 이해했다고 생각한 순간 내일 또 새로울 것 같아 늦은 시각이지만 오늘 한 부분을 되짚어보았다. 확실히 글을 적으니 흐름을 이해하는데 더 도움이 된 것 같다. 특히 reducer를 만드는 부분에서 action을 발동시키는 부분이 헷갈렸는데 적어보고, 실행해보니 이해가 되었다. 아직 익숙하지는 않지만 이 부분은 많이 써보면 해결될 문제 같다. 내일 읽어 볼 자료 : 리덕스는 왜 필요할까? Redux 전역적으로 상태를 관리할 수 있는 라이브러리이다. 리듀서는 순수한 함수여야 한다. (리덕스 규칙) (몰라) 상태관리흐름도 아래는 기능별로 묶은 덕스(ducks) 구조를 따른 코드이다. 1. State 저장하고 있는 상태값("데이터") , 딕셔너리 형태 const ADD_LIST = "quiz/ADD..
라우팅이란? 사용자가 요청한 URL에 따라 해당 URL에 맞는 페이지를 보여주는 것. 리액트에서는 라우팅 관련 라이브러리가 많이 있지만 그중 리액트 라우터(React Router)에 대해 아주 간략히 다뤄보겠다. SPA(Single Page Application) 리액트는 SPA방식이다. - 기존 웹 페이지 처럼(MPA 방식) 여러 개의 페이지를 사용, 새로운 페이지를 로드하는 방식이 아니다. - 주소를 옮길 때 새로운 페이지를 로드하지 않고 하나의 페이지 안에서 필요한 데이터만 가져오는 형태를 가진다.(하나의 html으로 브라우저 주소창대로 다른 페이지를 보여줄 수 있다. ) React-Router는 이런 신규 페이지를 불러오지 않는 상황에서 각각의 url에 따라 선택된 데이터를 하나의 페이지에서 렌더..
React를 공부하면서 Hook이나 State, Redux가 헷갈려서 정리하고자 간략하게 쓴다. 공부한 코드 기반으로 정말 일부분만 후다닥 쓴 거라 아마 나만 알아볼 것 같다...! 1. React.useRef() React Hook 리액트에서 돔요소를 가져올 때 쓸 수 있다. ex) input 에서 text를 가져오고 싶을 때 리액트 요소에서 가져올 수 있다. const id_ref = React.useRef(null); 가져올 요소에 넣는다. 1. React.useState() React Hook 아래를 예시로 들면, count에는 state값이, setCount에는 count이라는 state값을 수정하는 함수가 된다. 괄호 안은 상태의 초기 값을 나타낸다. setCount()라는 함수를 호출하여 s..
프로그래머스 - 베스트앨범 지난 포스트에서는 여러 조건 별로 변수를 나누어서 풀었다면, 이번에는 프로그래머스에서 가장 좋아요를 많이 받은 풀이법에 대해 설명하고자 한다. 너무 깔끔하고, 배열 메서드중에서 몰랐던 기능도 알게되어 여러모로 유익했고 닮고싶은 풀이다. 이번 풀이 역시 주어진 테스트케이스에는 조건3. 장르 내에서 재생 횟수가 같은 노래 중에서는 고유 번호가 낮은 노래를 먼저 수록합니다. 를 확인할 수 없으므로 테스트케이스에 값을 하나 더 추가했다. 따라서 원하는 출력값은 [4, 1, 3, 5] 가 되겠다. const genres = ["classic", "pop", "classic", "classic", "pop", "classic"]; const plays = [500, 600, 150, 80..
프로그래머스 - 베스트 앨범 문제는 위 링크에서 볼 수 있다. 문제에 대한 해설보다는 기억하고 싶은 개념, 사고, 문법을 기록하는 글이다. 답안은 맨 아래에 표기해 두었다. 답안 풀이 이번 문제는 처음부터 끝까지 접근하고 푸는 방식을 적는 게 도움이 될 것 같아서 풀이를 해보려 한다. 이 풀이 말고 프로그래머스에서 best에 있는 풀이법도 가져왔는데, 그건 정말 신박해서 기억하고 싶었다. 그에 대한 풀이는 여기서 확인하면 된다. 참고로 주어진 테스트 케이스에는 조건 3. 장르 내에서 재생 횟수가 같은 노래 중에서는 고유 번호가 낮은 노래를 먼저 수록합니다. 를 확인할 수 없어서 테스트 케이스에 값을 하나 더 추가했다. 따라서 원하는 출력 값은 [4, 1, 3, 5]가 되겠다. const genres = ..
프로그래머스 - 위장 문제는 위 링크에서 볼 수 있다. 문제에 대한 해설보다는 기억하고 싶은 개념, 사고, 문법을 기록하는 글이다. 답안은 맨 아래에 표기해 두었다. 1. reduce() 메서드로 object형태 만들기 reduce()는 자신을 호출한 배열의 요소를 순화하면서 인수로 전달된 콜백함수를 반복 호출한다. 그리고 콜백함수의 반환값을 다음 순회 시에 콜백 함수의 첫 번째 인수로 전달하면서 콜백 함수를 호출하여 하나의 결과값을 만들어 반환한다. 해시 관련 문제는 key:value 형태로 변환하는 형식으로 풀어야하는 것 같다. 저번 풀이에도 reduce()를 이용했는데 이번에도 같은 방식으로 시작했다. 이 때 for문을 써도 되지만, reduce()를 쓰면 더 간편하게 object형태로 만들 수 있..
프로그래머스 - 완주하지 못한 선수 문제는 위 링크에서 볼 수 있다. 문제에 대한 해설보다는 기억하고 싶은 개념, 사고, 문법을 기록하는 글이다. 답안은 맨 아래에 표기해 두었다. 이 문제의 난이도는 쉬운편이었지만, 카테고리에 맞게 해시를 이용해 푸는 방법도 가져왔다. 프로그래머스 문제를 풀면 사람들이 어떻게 풀었는지 볼 수 있는데 진짜 천재들이 많은듯하다.. 답안 1. find() 메서드로 찾는다. find() 또한 ES6에 도입된 메서드이다. 자신을 호출한 배열의 요소를 순화하면서 인수로 전달된 콜백함수를 호출하여 반환값이 true인 첫 번째 요소를 반환한다. true인 요소가 존재하지 않는다면 undefined를 반환한다. let answer = participant.find((v, i) => v ..
- Total
- Today
- Yesterday
- 알고리즘자바스크립트
- cs50
- python
- 프로그래머스 베스트앨범 자바스크립트
- html
- css
- 모두를 위한 컴퓨터 과학
- 무한스크롤
- network
- 백준
- 자바스크립트 비동기 처리
- reactquery
- 자바스크립트
- 항해99
- 리액트
- 프로그래머스 자바스크립트
- React Query
- 실전프로젝트
- 타입스크립트
- 프로그래머스
- 모두를위한컴퓨터과학
- github
- React
- 네트워크
- GIT
- 자바스크립트알고리즘
- 리액트네이티브
- 자바스크립트 클로저
- 클로저
- javascript
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |