싹도 트지 않은 씨앗 개발자

인쇄(ctrl + p) HTML 페이지의 background-color 속성이 인쇄 미리보기에 적용되지 않는 현상을 확인하였습니다. 아래는 전체 문서를 검게 칠하여 극단적으로 표현한 예시입니다. 인쇄 미리보기 시 배경색이 전부 사라져 모든 글씨가 보입니다. print-color-adjust 미디어 쿼리를 이용하여 print에 해당할 때, print-color-adjust 속성을 exact로 지정합니다. @media print { body { print-color-adjust: exact; -webkit-print-color-adjust: exact; } } print-color-adjust는 economy와 exact 둘 중 하나를 지정해야 합니다. 기본값은 economy이며, user agent에 의해..

case마다 반드시 break를 사용할 것 if - else if - else문 대신 switch - case문을 사용해 보려다가 당했습니다. break를 사용하지 않았기 때문입니다. switch - case 각각의 문자열이 아래와 같이 대응된다고 해봅시다. U: up → y 좌표를 1 증가시킴 D: down → y 좌표를 1 감소시킴 L: left → x 좌표를 1 감소시킴 R: right → x 좌표를 1 증가시킴 간단하게 코드로 나타내 보면 아래와 같습니다. const string = "UDLR"; let x = 0; let y = 0; for (let chr of string){ switch (chr) { case 'U': y++; case 'D': y--; case 'L': x--; case '..

우연한 계기로 canvas를 활용하여 그리드에 흰색 혹은 검은색을 칠하는 간단한 작업을 수행하였는데, 얼마 전 신기하게 봤던 노이즈 효과를 도전해 봐도 좋을 것 같습니다. 당장 코드가 급하신 분들은 이 글이 아니라 이쪽의 출처로 html5 canvas noise generation ... codepen.io 로직 생각한 로직은 다음과 같습니다. canvas 생성 렌더링 함수 정의 width * height 크기의 배열 생성 및 값 할당 배열의 값에 따라 픽셀 단위로 칠하기(fillRect 활용) 렌더링 함수 반복 호출 옵션은 다음과 같습니다. window 크기 변경 시 canvas 크기도 조절되는 로직(resize) 구현 주요 로직 1. canvas 생성 html에 canvas 태그 추가 js로 canv..

문제: https://school.programmers.co.kr/learn/courses/30/lessons/258709 풀이(이진 탐색): [프로그래머스] 주사위 굴리기 - 2024 카카오 겨울 인턴십 카카오 공식 문제해설은 이진 탐색을 사용하는 것보다 시간복잡도 측면에서 더 효율적인 방법이 있음을 시사하였고, 답을 구하는 방법으로는 누적합, 투포인터, 이진 탐색 등을 언급하였습니다. 그래서 저는 이진 탐색을 활용했던 부분을 누적합으로 대체하여 시간복잡도를 개선해 보고자 합니다. 리팩토링 시뮬레이션 결과 우선 시뮬레이션 결과를 저장하는 방식을 바꿔 봅시다. 누적합을 활용하려면 우선 결과를 구간으로 나타내야 할 필요가 있습니다. 시뮬레이션 결과의 범위 주사위 N개를 던졌을 때 얻을 수 있는 최대 숫자는..

https://school.programmers.co.kr/learn/courses/30/lessons/258709 이번에는 주사위 굴리기 문제입니다. 주사위를 던져 나올 수 있는 경우의 수를 전부 고려해야 하는 완전탐색 문제입니다. 주사위 굴리기 2 이상 10 이하인 짝수 N개의 주사위를 절반씩 나누어 가져 주사위를 던집니다. 각 주사위의 눈은 1 이상 100 이하입니다. 승부는 주사위를 던져 나온 눈의 합계의 비교를 통해 이루어집니다. A는 승률이 최대가 되는 주사위 조합을 알고 싶습니다. 단계 요약 N개의 주사위 중 N/2개를 선택하는 모든 조합을 구합니다. 단계 1에서 만들어진 조합에 대하여 다음의 과정을 반복합니다. 조합별로 주사위를 굴렸을 때 얻을 수 있는 결과를 저장합니다. A로 시뮬레이션한..

https://school.programmers.co.kr/learn/courses/30/lessons/258705# 2024 KAKAO WINTER INTERNSHIP 문제였던 다이나믹 프로그래밍 문제입니다. 실전에서는 해결하지 못하였으나 프로그래머스에 올라와 있길래 다시 도전하였습니다. 산 모양 타일링 정삼각형을 2n + 1개 이어 붙여 밑변의 길이가 n + 1, 윗변의 길이가 n인 사다리꼴을 만듭니다. 윗변과 변을 공유하는 n개의 삼각형 각각은 머리(top)가 붙어 있을 수도 있고, 없을 수도 있습니다. 머리가 있는지 없는지 여부는 tops 배열을 통해 주어집니다. 산 없는 산 모양 타일링 우선 tops의 값이 전부 0이라고 생각하고, 2n + 1개의 삼각형으로 이루어진 사다리꼴을 채우는 경우의 수..

요약 command output.txt 명령어 뒤에 파일명을 붙이면 프로그램 수행중에 출력되는 내용들을 기록합니다. 터미널이 제공하는 리다이렉션 기능이라고 합니다. node.js 입력 받기(linux) BOJ에 코드를 제출할 때에 fs 모듈의 readFileSync를 사용한다면 아래와 같은 형식으로 작성하여 제출하게 됩니다. const input = require('fs').readFileSync('/dev/stdin').toString().trim(); console.log(input); 저는 주로 로컬 환경보다 JDoodle이라는 온라인 IDE를 활용해 코드를 작성했었는데, 그 이유는 로컬 환경에서 테스트케이스를..

new Date('2024-1-1') !== new Date('2024-01-01')Date의 날짜 파싱MDN 문서는 Date 생성자를 이용한 날짜 파싱이 일관적이지 않고 브라우저별로 동작이 상이하므로 사용하지 않을 것을 권장하고 있습니다. 위의 예시는 일관적이지 않은 파싱의 한 예시입니다.비교 연산의 왼쪽 식은 우리나라의 시간대를 기준으로 2024년 1월 1일 0시가 됩니다. 우리나라 시간대는 그리니치 표준시(GMT)보다 9시간이 빠르므로 실제 반환되는 타임스탬프는 2023년 12월 31일 15시입니다.new Date('2024-1-1').toISOString(); // 2023-12-31T15:00:00.000Znode.js 환경에서 'YYYY'를 고정한 채로 1월 1일 ~ 12월 31일까지 확인하였..

요약 한 번에 여러 단계를 연속적으로 인덱싱하는 부분에 대하여 단계적으로 접근할 수 있도록 변경합니다. type Obj = { a: number, b?: number[] } const arr: Obj[] = [{a: 1, b: [1]}, {a: 2}, {a: 3}]; // before for (let i = 0; i < arr.length; i++){ if (arr[i].b !== undefined){ arr[i].b ; // undefined일 수 있다는 경고 출력 } } // after for (let i = 0; i < arr.length; i++){ const obj = arr[i]; if (obj.b !== undefined){ obj.b; // 경고 미출력 } } 타입스크립트 플레이그라운드 위..

화살표 함수 대신 function 키워드 쓰세요 Set.prototype.toggle Set에 함수의 인자로써 주어진 데이터가 없다면 데이터를 추가하고, 데이터가 이미 있다면 데이터를 삭제하는 toggle 메서드를 추가해 봅시다. 방법 다음의 과정을 거치면 Set.prototype.add, Set.prototype.remove와 같은 Set 자료형의 다른 메서드처럼 우리가 만든 toggle 함수를 호출할 수 있습니다. 1. 함수를 정의한다. 2. Set.prototype의 하위에 1에서 정의된 함수를 할당한다. 함수 정의 및 할당 // 함정 Set.prototype.toggle = (item) => { if (this.has(item)){ this.delete(item); } else { this.add..