Vue에서 컴포넌트를 작성한다면 Options API와 Compotision API중 하나를 선택하게 된다. 각 스타일별 특징과 장단점은 다음과 같다. Options API data, methods, mounted 같은 객체를 사용하여 컴포넌트의 로직을 정의하는 방식이다. 옵션으로 정의된 속성은 컴포넌트 인스턴스를 가리키는 함수 내부의 this에 노출된다. 숫자 세기: {{ count }} Composition API Vue3에서 추가된 함수 기반의 API로, 컴포넌트 로직을 유연하게 구성할 수 있도록 하여 코드의 재사용성을 높인다. React를 주로 사용해왔다면 조금은 더 익숙할 스타일이다. import 해서 가져온 API 함수들을 사용하여 컴포넌트의 로직을 정의하는데, SFC(Single File C..
문제 풀이 과정 첫 번째 입력 예시인 5 RRULD 5 2 4 3 2 를 기준으로 답인 3이 나오기까지의 과정을 그려보자면 위와 같다. 시작점 (0, 0)에는 1점이 있고, 방향 커맨드를 따라 빈 곳에 블럭을 놓다가 이미 채워진 공간이 있으면 해당 블럭이 놓여지기 직전 시점으로 '뒤로 감기'를 하듯 쌓았었던 블럭을 제거해야한다. 즉, N 번째 블럭을 쌓기 위해 M 번째 블럭을 제거해야한다면 M에서 ~ N-1 번째 블럭을 없애야 하므로 다음과 같은 접근으로 풀었다. 1. LRUD 키워드를 바탕으로 이동할 방향의 정보가 담긴 dirDict 객체를 생성한다. 2. queue에 첫 번째 블록인 [0, 0, 1]을 넣는다. queue에는 현재 쌓인 블록들의 정보를 [x좌표, y좌표, score] 배열들로 저장할 ..
문제 계단 오르기 게임은 계단 아래 시작점부터 계단 꼭대기에 위치한 도착점까지 가는 게임이다. 과 같이 각각의 계단에는 일정한 점수가 쓰여 있는데 계단을 밟으면 그 계단에 쓰여 있는 점수를 얻게 된다. 예를 들어 와 같이 시작점에서부터 첫 번째, 두 번째, 네 번째, 여섯 번째 계단을 밟아 도착점에 도달하면 총 점수는 10 + 20 + 25 + 20 = 75점이 된다. 계단 오르는 데는 다음과 같은 규칙이 있다. 계단은 한 번에 한 계단씩 또는 두 계단씩 오를 수 있다. 즉, 한 계단을 밟으면서 이어서 다음 계단이나, 다음 다음 계단으로 오를 수 있다. 연속된 세 개의 계단을 모두 밟아서는 안 된다. 단, 시작점은 계단에 포함되지 않는다. 마지막 도착 계단은 반드시 밟아야 한다. 따라서 첫 번째 계단을 ..
padStart() String.prototype.padStart() 메서드는 현재 문자열 String.prototype의 시작을 다른 문자열로 채워, 주어진 길이를 만족하는 새로운 문자열을 반환한다. 첫 번째 인자는 주어진 길이, 두 번째 인자는 채울 문자열이다. 채워넣기는 대상 문자열의 왼쪽부터 적용된다. const word = 'Tissue'; const newWord = word.padStart(10, 'C'); // 새로운 문자열을 반환하므로 - console.log(word); // "Tissue" - 원본은 유지된다 console.log(newWord); // "CCCCTissue" 두 번째 인자의 문자열의 길이가 2 이상일 때엔, 패턴처럼 반복되다가 첫 번째 인자로 주어진 정수와 일치하는 ..
문제 위의 그림과 같이 삼각형이 나선 모양으로 놓여져 있다. 첫 삼각형은 정삼각형으로 변의 길이는 1이다. 그 다음에는 다음과 같은 과정으로 정삼각형을 계속 추가한다. 나선에서 가장 긴 변의 길이를 k라 했을 때, 그 변에 길이가 k인 정삼각형을 추가한다. 파도반 수열 P(N)은 나선에 있는 정삼각형의 변의 길이이다. P(1)부터 P(10)까지 첫 10개 숫자는 1, 1, 1, 2, 2, 3, 4, 5, 7, 9이다. N이 주어졌을 때, P(N)을 구하는 프로그램을 작성하시오. 풀이 과정 다이나믹 프로그래밍 입문 문제인 백준의 피보나치 함수 문제와 유사하다. 규칙을 찾아 점화식을 작성하면 끝 ... 인데, 어딘가 요상한 규칙으로 풀었다 -.- 제출 코드 const readline = require("re..
String.prototype.substring()은 시작 인덱스로 부터 종료 인덱스 전 까지 문자열의 부분 문자열을 반환하는 메서드이다. const word = 'Algorithm'; console.log(word.substring(3, 5)); // or console.log(word.substring(2)); // gorithm console.log(word.substring(-1)); // Algorithm 파이썬에서의 슬라이싱 방법인 str[n:m]과 비슷해보이지만, [-1]과 같은 음수 인덱스를 넣으면 substring(0))으로 처리되어 전체 문자열을 반환하게 된다. 만약 음수 인덱스로 문자열을 슬라이싱하고 싶다면 .slice()를 사용하자. const word = 'Algorithm' co..
문제 네 개의 명령어 D, S, L, R 을 이용하는 간단한 계산기가 있다. 이 계산기에는 레지스터가 하나 있는데, 이 레지스터에는 0 이상 10,000 미만의 십진수를 저장할 수 있다. 각 명령어는 이 레지스터에 저장된 n을 다음과 같이 변환한다. n의 네 자릿수를 d1, d2, d3, d4라고 하자(즉 n = ((d1 × 10 + d2) × 10 + d3) × 10 + d4라고 하자) D: D 는 n을 두 배로 바꾼다. 결과 값이 9999 보다 큰 경우에는 10000 으로 나눈 나머지를 취한다. 그 결과 값(2n mod 10000)을 레지스터에 저장한다. S: S 는 n에서 1 을 뺀 결과 n-1을 레지스터에 저장한다. n이 0 이라면 9999 가 대신 레지스터에 저장된다. L: L 은 n의 각 자릿..
JavaScript에서 let varA = 0, varB = 0, varC = 0; 또는 let varA = varB = varC = 0;과 같이 작성하면 세 개의 변수를 라인 하나로 동시에 초기화할 수 있다. 이를 연쇄 할당(chain assignment)라 부른다. let varA, varB, varC = 0;은 varA와 varB는 undefined로, varC만 0으로 초기화된다. ⚠️ 주의 ⚠️ 숫자, 문자열, 불리언을 연쇄 할당하는 것은 괜찮지만 객체, 배열과 같은 참조 타입을 할당할 때엔 모든 변수가 동일한 객체나 배열을 참조하게 되어, 한 변수에 대한 변경이 다른 모든 변수에 영향을 미칠수도 있으므로 유의해야 한다.
문제 폴리오미노란 크기가 1×1인 정사각형을 여러 개 이어서 붙인 도형이며, 다음과 같은 조건을 만족해야 한다. 정사각형은 서로 겹치면 안 된다. 도형은 모두 연결되어 있어야 한다. 정사각형의 변끼리 연결되어 있어야 한다. 즉, 꼭짓점과 꼭짓점만 맞닿아 있으면 안 된다. 정사각형 4개를 이어 붙인 폴리오미노는 테트로미노라고 하며, 다음과 같은 5가지가 있다. 아름이는 크기가 N×M인 종이 위에 테트로미노 하나를 놓으려고 한다. 종이는 1×1 크기의 칸으로 나누어져 있으며, 각각의 칸에는 정수가 하나 쓰여 있다. 테트로미노 하나를 적절히 놓아서 테트로미노가 놓인 칸에 쓰여 있는 수들의 합을 최대로 하는 프로그램을 작성하시오. 테트로미노는 반드시 한 정사각형이 정확히 하나의 칸을 포함하도록 놓아야 하며, 회..