분류 전체보기 84

[이코테] 그리디 문제 : 숫자 카드 게임

문제 숫자 카드 게임은 여러 개의 숫자 카드 중에서 가장 높은 숫자가 쓰인 카드 한 장을 뽑는 게임이다. 단, 게임의 룰을 지키며 카드를 뽑아야 하고 룰은 다음과 같다. 1. 숫자가 쓰인 카드들이 N x M 형태로 놓여 있다. 이때 N은 행의 개수를 의미하며, M은 열의 개수를 의미한다. 2. 먼저 뽑고자 하는 카드가 포함되어 있는 행을 선택한다. 3. 그다음 선택된 행에 포함된 카드들 중 가장 숫자가 낮은 카드를 뽑아야 한다. 4. 따라서 처음에 카드를 골라낼 행을 선택할 때, 이후에 해당 행에서 가장 숫자가 낮은 카드를 뽑을 것을 고려하여 최종적으로 가장 높은 숫자의 카드를 뽑을 수 있도록 전락을 세워야 한다. 예를 들어 3 x 3 형태로 카드들이 다음과 같이 놓여 있다고 가정하자. 여기서 카드를 골..

코딩 테스트 2023.07.04

[이코테] 그리디 문제 : 큰 수의 법칙

문제 큰 수의 법칙은 일반적으로 통계 분야에서 다루어지는 내용이지만 동빈이는 본인만의 방식으로 다르게 사용하고 있다. 동빈이의 큰 수의 법칙은 다양한 수로 이루어진 배열이 있을 때 주어진 수들을 M번 더하여 가장 큰 수를 만드는 법칙이다. 단, 배열의 특정한 인텍스(번호 )에 해당하는 수가 연속해서 K번을 초과하여 더해질 수 없는 것이 이 법칙의 특징이다. 예를 들어 순서대로 2, 4, 5, 4, 6으로 이루어진 배열이 있을 때 M이 8이고, K가 3이라고 가정하자. 이 경우 특정한 인덱스의 수가 연속해서 세 번까지만 더해질 수 있으므로 큰 수의 법칙에 따른 결과는 6+6+6+5+6+6+6+5인 46이 된다. 단, 서로 다른 인텍스에 해당하는 수가 같은 경우에도 서로 다른 것으로 간주한다. 예를 들어 순..

코딩 테스트 2023.07.04

[이코테] 그리디(greedy)

코딩테스트 공부 해보자 해보자 한 게 언젠데 그걸 계속 미루고 지금가지 와버렸네.. 아우 이제 진짜 열심히 해보자 파이팅! 일단 이코테 교재에 있는 알고리즘을 다 정리하고 교재에 있는 문제들 풀어야겠다. 그 이후엔 하루에 풀 문제 개수를 정해놓고 백준 문제들을 풀어야겠다. 파이팅! 03 그리디 ->오늘 마스터하자! 04 구현 05 DFS/BFS 06 정렬 07 이진 탐색 08 다이나믹 프로그래밍 09 최단 경로 10 그래프 이론 그리디(Greedy)는 현재 상황에서 지금 당장 좋은 것만 고르는 알고리즘이다. 이 알고리즘은 매 순간 가장 좋아 보이는 것을 선택한다. 현재의 선택이 나중에 미칠 영향에 대해서는 고려하지 않는다. 그리디 알고리즘은 사전에 외우고 있지 않아도 풀 수 있을 가능성이 높은 문제 유형..

코딩 테스트 2023.07.04

[바닐라 JS로 크롬 앱 만들기] quotes : random

quotes.js 파일을 만들고, html에서 import해준다. quotes.js에서는 다음과 같이 명언들을 나열해준다. quotes라는 배열을 만들고 그 안에 요소들을 넣는다. html에서 명언을 표시할 곳을 만들자. quote라는 아이디를 가진 div를 만들고, 그 안에 span을 2개 만들어서 하나는 quote, 다른 하나는 author가 보이도록 만들자. quotes.js에서는 span 하나하나를 quote, author 변수로 저장해준다. randomness(무작위성) 명언이 10개가 있다고 가정했을 때 10개 명언 중 하나를 랜덤으로 가져오도록 만들어야 한다. 배열의 인덱스는 0부터 시작하기 때문에 0부터 9까지의 숫자를 랜덤으로 접근하는 것이 필요하다. Math module를 사용한다. m..

[바닐라 JS로 크롬 앱 만들기] padStart / padEnd

저번에 해결하지 못한 문제1을 해결해보자. 숫자가 깔끔하게 보이지 않는다. 해결해보자! string이 적어도 최소한 2개여야 한다. 1인 경우 01로 바꿔줘야하지만, 11인 경우 그냥 11을 쓴다. padStart 앞의 string이 2개가 아니라면 앞부분에 0을 추가해줘~ 라는 뜻이다. 12의 경우 이미 길이가 2이기 때문에 문자를 추가하지 않는다. padStart는 앞에 문자를 추가하는 것이다. 반대로 뒤에 문자를 추가하는 함수인 padEnd도 있다. padStart는 string에 적용할 수 있는 함수이기 때문에 Date().getHours()를 string으로 바꿔줘야 한다. String으로 덮으면 문자로 바꿀 수 있다. 이렇게 코드를 짜면 const clock = document.querySel..

[바닐라 JS로 크롬 앱 만들기] clock - setInterval / setTimeout

이제 새로운 js 파일을 만든다 clock.js 코드가 하는 일에 따라서 파일을 나눠서 작성한다. greeting.js는 username을 입력받아서 화면에 표시하는 것이다. 그 일은 모두 끝났고 이제는 clock과 관련된 다른 일을 할 것이기 때문에 새로운 파일을 만들어줬다. 그리고 파일의 경로도 수정했다. js 폴더 안에 자바스크립트 파일을 위치시켰고, css 폴더 안에 css 파일을 위치시켰다. 파일 경로는 다음과 같다. http에서 import하는 파일의 경로도 수정해줘야 한다. 이제 새 파일 clock.js에 코드를 작성해보자! html파일에서 h2를 만들고 거기에 default text로 00:00:00를 표시하게 만들었다. interval과 timeout interval: 정해진 시간마다 특..

[바닐라 JS로 크롬 앱 만들기] Loading Username

local storage에 username이 존재하는지 확인하고, 만약 존재한다면 form을 표시하지 않고 바로 h1 요소가 표시되도록 하자. addEventListener를 하기 전에 localStorage를 확인해야 한다. localStorage에 username라는 key에 해당하는 것이 있을 때 1과 같이 key 값에 해당하는 value를 출력해준다. 그 key, value를 지운 후에 해당 명령어를 다시 실행하면 2와 같이 null을 보여준다. 이 null인지 아닌지를 코드에서 판별해서 null인 경우 우리가 이제껏 했던 걸 계속 하면 되고, null이 아닌 경우(무언가 있는 경우) 바로 h1 요소를 화면에 보여주게 하자. 여기서 잠깐, 'username'이라는 문자도 많이 사용하기 때문에 변수..

[바닐라 JS로 크롬 앱 만들기] Saving Username

저번에 만든 것의 문제는 username을 기억할 수 없다는 것이다. 페이지에 들어올 때마다 로그인해줘야 한다. 이걸 영구적(?)으로 기억하려면 어떻게 해야 할까? 이 작업도 많이 사용되기 때문에 API가 존재한다. : localStorage localStorage가 브라우저에 뭔가를 저장할 수 있게 해준다. 개발자 창에서 localStorage를 확인할 수 있다. 위에 창에서 Application을 선택하면 Local Storage가 보인다. Storage의 아래에 위치하는 다른 것들로도 정보를 저장할 수 있다. 그 중에서 Local Storage가 다루기 가장 쉽기 때문에 이걸 사용해보자. 아직은 Local Storage가 비어있는 상태이다. localStorage는 다양한 함수를 제공한다. setI..

[바닐라 JS로 크롬 앱 만들기] display

사용자가 username을 입력하고 클릭을 누르면 form 자체가 없어지도록 만들고 싶다. 이걸 구현하기 위한 두 가지 방법이 있다. 1. HTML 요소 자체 없애기. -> 이건 뭔가 단점이 많을 것 같은 느낌이 든다.. 2. CSS로 없애기(없어진 것처럼 보이게 하기) .hidden { display: none; } const loginForm = document.querySelector('#login-form'); const loginInput = document.querySelector('#login-form input'); function onLoginSubmit(event) { event.preventDefault(); //새로고침 막기 const username = loginInput.valu..

[바닐라 JS로 크롬 앱 만들기] link, preventDefault

링크 href=... 라인을 추가해서 링크를 만들어주자. Go to courses preventDefault 저번 포스팅에서 form의 기본 동작이 submit이라는 걸 알게 되었다. 이걸 preventDafault로 막았다. 링크의 기본 동작은 다른 페이지로 바뀌는 것이다. 이것도 마찬가지로 막아보자. const loginForm = document.querySelector('#login-form'); const loginInput = document.querySelector('#login-form input'); const link = document.querySelector('a'); function onLoginSubmit(event) { event.preventDefault(); //새로고침 막..