Hazellog

summer/winter coding(2019) 문제 https://programmers.co.kr/learn/courses/30/lessons/62050 코딩테스트 연습 - 지형 이동 [[1, 4, 8, 10], [5, 5, 5, 5], [10, 10, 10, 10], [10, 10, 10, 20]] 3 15 [[10, 11, 10, 11], [2, 21, 20, 10], [1, 20, 21, 11], [2, 1, 2, 1]] 1 18 programmers.co.kr N x N 크기인 정사각 격자 형태의 지형이 있습니다. 각 격자 칸은 1 x 1 크기이며, 숫자가 하나씩 적혀있습니다. 격자 칸에 적힌 숫자는 그 칸의 높이를 나타냅니다. 이 지형의 아무 칸에서나 출발해 모든 칸을 방문하는 탐험을 떠나려 ..

summer/winter coding(2019) 문제 문제 코딩테스트 연습 코딩테스트 연습 기초부터 차근차근, 직접 코드를 작성해 보세요. programmers.co.kr 가로 길이가 W cm, 세로 길이가 H cm 인 직사각형 종이가 있고, 종이는 1cm X 1cm 의 격자칸이 있다. 종이를 왼쪽 위 꼭지점에서 오른쪽 아래 꼭지점으로 대각선을 그을 때, 종이에 남아있는 정사각형의 개수를 구하는 문제이다. 제한사항 W, H : 1억 이하의 자연수 해결 방법 대각선에 대한 기울기와 접점으로 일차함수 식을 구해서 문제를 해결했다. 위의 그림과 같이, 왼쪽 아래를 기준으로 좌표를 정하고 대각선의 식을 구했다. 대각선을 지나는 사각형의 개수를 전체 개수에서 빼는 방법으로 식을 작성했다. 대각선을 지나는 것을 확..

React 와 Typescript를 사용하여 프로그램을 작성하는 과정에서 발생한 오류이다. 문제 상황 아래 코드와 같이 function component 내에서 useEffect 를 사용하고, 해당 훅 내에서 socket 통신을 하는 상태이다. function testFunc() { useEffect(()=>{ socket.on("test", ()=>{ console.log("test!"); }); }); return ( testFunc ); } 해당 코드에서 socket 통신을 하는 경우, 소켓을 듣는 횟수가 중복해서 발생했다. //1회 test! //2회 test! test! //3회 test! test! test! socket.emit(”test”) 는 동일하게 한 번만 실행했음에도 socket.o..

문제 페이지를 새로고침하는 경우, 모든 변수와 상태 값이 초기화되는 문제가 있었다. 결론적으로 useState와 useContext를 정확하게 이해하지 않아 발생한 오류였다. useState 는 변수 값을 상태 값으로 저장하여 상태 값이 변경되었을 경우, 해당 상태 값을 사용하는 컴포넌트만 부분적으로 리렌더링된다. 전체 페이지를 리렌더링 하지 않고, 부분 리렌더링으로 부하를 줄일 수 있다. useContext는 useState의 사용이 많거나 변수를 전역으로 선언하여 사용하는 경우에 사용에 용이하다. useState 값을 context 내에 저장하여 관리할 수 있다. 다만, 두 Hook 모두 값이 변하지 않는 것이 아니다. 리렌더링 되는 경우에는 기존의 값을 기준으로 변화된 컴포넌트들만 바뀌어 렌더링되어..

react와 vite를 사용하여 프런트엔드 코드를 구현했다. 문제 node.js 에서 사용하듯이 아래와 같은 코드로 작성했다. require("dotenv").config(); console.log(process.env.KEY); 위의 코드의 출력 결과는 undefined ! 또는 아래의 오류가 발생한다. ReferenceError: process is not defined 우선, VITE에서는 process를 사용하지 않는다. 그럼 자동으로 파일을 읽어오는 건가? 했지만, dotenv 파일을 자동으로 읽어오지 않는다. 해결 방법 우선 env 파일의 경로를 설정한다. 기본적으로 root로 설정되어 있다. //vite.config.ts export default defineConfig({ plugins: ..

상속(inheritance) 상속은 기존의 클래스에 기능을 추가하거나 재정의하여 새로운 클래스를 정의하는 것을 의미한다. 상속을 이용하여 기존에 정의한 클래스의 필드와 메서드를 물려받고, 새로운 클래스를 생성할 수 있다. 구현된 클래스보다 구체적인 기능을 가진 클래스를 구현해야 할 때, 기존의 클래스를 상속하여 구현한다. 기존의 클래스를 부모 클래스(parent class)나 상위 클래스(super class) 또는 기초 클래스(basic class)라고 한다. 상속받은 클래스를 자식 클래스(child class)나 하위 클래스(sub class) 또는 파생 클래스(derived class)라고 한다. 하위 클래스 생성 과정 하위 클래스를 생성하면 상위 클래스가 먼저 생성된다. 상위 클래스가 먼저 호출되..

history.push 로 페이지 이동시 렌더링이 되지 않는 문제가 확인했다. 새로운 게임 방을 만들어 입장하고, 방을 바로 나왔을 때, 게임방에 아무도 없기에 방이 삭제된다. exit 버튼으로 “/game” 경로로 이동할 때, history.push("/game"); 위의 코드를 사용하여 이동했다. 해당 페이지로 이동했을 때, 게임방이 남아있는 것을 확인할 수 있지만, 새로고침을 하고 나면 방이 없어지는 것을 알 수 있다. 따라서, 해당 페이지에서 새로고침이 되지 않는 문제가 있다는 것을 알 수 있었다. 1. window.location.reload() 사용하기 window.location.reload(); “hitory.push” 함수를 실행한 후, 위의 코드를 실행하여 새로고침을 하는 방법이 있다...

배열 동일한 자료형의 순화적 자료구조 인덱스 연산자 []를 이용하여 참조할 수 있다. 배열의 인덱스는 0부터 시작한다. 배열의 선언과 초기화 int[] arr1 = new int[10]; int arr2[] = new int[10]; 배열은 선언과 동시에 자료형에 따라 초기화된다. 정수는 0, 실수는 0.0, 객체는 null int[] num = new int[] {10, 11, 12}; int[] num = {1, 2, 3}; int[] idx; idx = new int[] {1, 2, 3}; 선언과 초기화를 따로 하는 경우, new int[] 를 생략할 수 없다. 배열 사용하기 배열의 길이와 요소의 개수는 동일하지 않다. 배열을 선언하면 개수만큼 메모리가 할당되지만, 데이터가 없는 경우도 있다. 배열..

정적 변수 여러 인스턴스에서 공통으로 사용하는 변수 항상 값이 변하지 않는 경우에 사용한다. 즉, 같은 데이터 영역을 사용한다. 정적 변수는 프로그램이 메모리에 있는 동안 계속 그 영역을 차지하므로 큰 메모리를 할당하는 것은 좋지 않다. 예제 여러 인스턴스가 공유하는 기준 값이 필요한 경우 학생의 학번, 회사원의 사번 카드 번호 정적 변수 선언과 사용 static int serialNumber; ex) Student.serialNumber = 100; 프로그램이 메모리에 로딩될 때, 메모리를 할당하여 사용한다. 인스턴스 생성과 관계없이 사용할 수 있으므로 클래스 이름으로 직접 참조할 수 있다. 정적 메서드 정적 변수를 private으로 선언하고, getter/setter를 구현하여 사용할 수 있다. 정적..

자바는 대표적인 객체지향 언어이다. 객체와 객체 지향 프로그램에 대해 공부해보자!! 객체(Object) 물리적으로 존재하거나 추상적으로 생각할 수 있는 것 중 자신의 속성을 가지고 있고 다른 것과 식별 가능한 것을 말한다. 객체는 속성과 동작으로 구성되어 있고, 속성을 필드(field), 동작을 메소드(method)라고 한다. 사람을 예로 들자면, 사람이 객체가 되고, 사람의 이름, 나이와 같은 값 필드, 사람이 움직이거나 달리는 등의 동작이 메소드가 된다. 클래스(Class) 클래스는 객체를 정의하는 설계도이다. 설계도 내에 값을 저장하여 객체를 만들 수 있다. 인스턴스(Instance) : 클래스로부터 객체를 만드는 과정을 클래스의 인스턴스화라고 한다. 클래스는 필드, 메소드, 생성자로 구성되어 있다..