본문 바로가기

Javascript90

[백준JS] 10812. 바구니 순서 바꾸기 안녕하세요. 박기린 입니다. 백준 10812번 바구니 순서 바꾸기 문제를 풀어봅시다. 문제 링크 https://www.acmicpc.net/problem/10812 문제 해석 N개의 바구니가 있습니다. 원활한 설명을 위해, N이 7이라고 가정을 합니다. 각 바구니에는 순서에 맞는 숫자가 담겨 있습니다. 입력으로는 [i, j, k]가 들어옵니다. i부터 j까지의 바구니에, k번째 숫자부터 다시 담습니다. i < k < j 인 조건으로 값이 주어집니다. [ i = 2, j = 5, k = 7 ] 이라고 가정을 합니다. 두 번째부터 일곱 번째까지의 바구니에, k 번째 바구니에 들어있던 숫자부터 차례대로 담습니다. j 번째 바구니의 숫자까지 담았다면, i 번째 바구니의 숫자부터 차례대로 담아줍니다. [i, j,.. 2023. 3. 18.
[백준JS] 10809. 알파벳 찾기 안녕하세요. 박기린 입니다. 백준 10809번 알파벳 찾기 문제를 풀어봅시다. 문제 링크 https://www.acmicpc.net/problem/10809 문제 해석 1. 모든 입력은 소문자 알파벳으로만 구성됩니다. 2. a부터 z까지 알파벳 리스트를 만듭니다. 3. 입력받은 string의 알파벳을 분해한 후, 등장하는 순서를 알파벳 리스트에 적어줍니다. 4. 입력받은 string에 포함되지 않은 알파벳은 -1을 적습니다. 5. 중복되는 알파벳이 있으면, 첫 번째 이후로 등장하는 중복 요소는 전부 무시합니다. 정답 코드 const fs = require("fs"); const input = fs.readFileSync("/dev/stdin").toString().trim().split(""); cons.. 2023. 3. 17.
[백준JS] 1152. 단어의 개수 (반례 설명 포함) 안녕하세요. 박기린 입니다. 백준 1152번 단어의 개수 문제를 풀어봅시다. 문제 링크 https://www.acmicpc.net/problem/1152 문제 해석 / 반례 영어 단어와 공백으로 이루어진 한 문장을 입력받으면, 그 문장에 단어가 몇 개가 있는 지를 출력해주면 되는 쉬운 문제입니다. 다만, 중간에 함정 반례를 피하지 못해 오답이 뜨는 경우가 있습니다. 그 반례는 바로 입력이 공백 (" ")으로만 주어지는 경우입니다. 정답 코드 const fs = require("fs"); const input = fs.readFileSync("/dev/stdin").toString().trim().split(" "); if (input.length === 1 && input[0] === "") { resu.. 2023. 3. 15.
[백준JS] 11654. 자바스크립트 아스키 코드 출력하기 (ASCII) 안녕하세요. 박기린 입니다. 백준 11654번 아스키 코드 문제를 풀어봅시다. 문제 링크 https://www.acmicpc.net/problem/11654 문제 해석 알파벳 소문자, 대문자, 숫자 0~9 중 하나가 주어집니다. 즉, 길이가 1인 String이 주어지는데, 이것을 아스키 코드로 변환하여 출력하면 됩니다. 문제 자체는 매우 간단한데, 아스키 코드를 변환하는 방법을 모를 수 있습니다. String의 내장함수 charCodeAt()을 사용하면 됩니다. 정답 코드 const fs = require("fs"); const input = fs.readFileSync("/dev/stdin").toString().trim(); console.log(input.charCodeAt()); 정답 코드 풀이 .. 2023. 3. 14.
[백준JS] 10810. 골 넣기 안녕하세요. 박기린 입니다. 백준 10810 - 골 넣기 문제를 풀어봅시다. 문제 링크 https://www.acmicpc.net/problem/10810 문제 해석 N개의 바구니가 있습니다. 원활한 설명을 위해, N이 6이라고 가정을 합니다. 각 바구니에는 0이 담겨 있습니다. 입력으로는 [i, j, k]가 들어옵니다. i부터 j까지의 바구니에, k 숫자를 담습니다. [ i = 1, j = 3, k = 3 ] 이라고 가정을 합니다. 첫 번째부터 세 번째까지의 바구니 안에 [k = 3]을 담아줍니다. [i, j, k]가 총 M번이 주어지는데, 모두 실행을 한 뒤에 결과값을 출력하는 게 10810 - 공 넣기 문제 입니다. 정답 코드 const fs = require("fs"); const [NnM, .... 2023. 3. 11.
[React] 10. useRef(), ref에 대해 알아보기 안녕하세요. 박기린 입니다. 이번엔 리액트 훅 - useRef()에 대해 알아보겠습니다. ref ref는 DOM 요소에 직접 접근해서 작업을 하기 위해 존재합니다. ref가 필요한 이유 (ref vs state) 에 state가 연결되어 있으면, 무언가를 입력할 때마다 state가 바뀝니다. 리액트의 state는 값이 변하면, 그때마다 매번 컴포넌트들이 재렌더링됩니다. 만약 블로그에 긴 글을 쓰는 경우, 수 천자의 분량을 써내려가는 동안 매번 컴포넌트가 재렌더링된다면 굉장히 비효율적일 것입니다. ref는 state와 다르게, HTML DOM에 접근해서 DOM 안에 적힌 값을 알아갑니다. 의 값이 얼마나 변하든 상관없이, ref를 접근한 그 시점을 기준으로 안에 적힌 값만을 취합니다. 블로그에 계속 글을 .. 2023. 3. 6.
[백준JS] 15552. 빠른 A+B 안녕하세요. 박기린 입니다. 백준 15552번 문제를 풀어봅시다. 문제 링크 https://www.acmicpc.net/problem/15552 문제 해석 해당 알고리즘이 요구하는 계산은 매우 간단합니다. 첫 번째 줄의 5는 테스트 케이스의 개수를 뜻하기 때문에 무시하고, 두 번째 줄부터 나오는 두 숫자를 더해준 후 출력하면 됩니다. 다만, 한 가지 중요한 조건이 붙습니다. 이 문제는 시간제한이 빡빡합니다. 풀이 자체는 맞게 하더라도, 시간 초과로 문제를 틀릴 수 있습니다. 백준 사이트에 적힌 문제에는 시간 초과 문제를 해결할 힌트를 제공해주고 있지만, NodeJS에 대한 힌트는 없습니다. 그러면 NodeJS에서는 어떻게 해야 할까요? 정답 코드 const fs = require("fs"); const .. 2023. 2. 24.
[React] 8. <form /> 태그 다루기 안녕하세요. 박기린 입니다. 제출하기 {... 들} Add Expense 1. 컴포넌트가 존재하고, 2. 안에 컴포넌트가 있으며, 3. 의 type이 'submit'일 경우, 4. 의 onSubmit prop을 이용해서 양식을 제출합니다. onSubmit을 이용하면, 홈페이지의 지정된 버튼을 누르는 것 뿐만 아니라, submit 기능에 관하여 브라우저가 내장하고 있는 기능도 사용할 수 있습니다. 그러니 컴포넌트를 사용할 경우에는 onSubmit prop을 꼭 이용합시다. onSubmit const submitHandler = (event) => { event.preventDefault(); const expenseDate = { title: enteredTitle, amount: enteredAmount.. 2023. 2. 23.
[React] 7. 여러 개의 state를 다루기 안녕하세요. 박기린 입니다. 여러 State 생성하기 const [enteredTitle, setEnteredTitle] = useState(""); const [enteredAmount, setEnteredAmount] = useState(""); const [enteredDate, setEnteredDate] = useState(""); const [counter, setCounter] = useState(1); 한 파일(컴포넌트) 안에 위처럼 여러 개의 state를 설정할 수 있습니다. const titleChangeHandler = (event) => { setEnteredTitle(event.target.value); }; const amountChangeHandler = (event) => {.. 2023. 2. 20.