JS

[JS] select에서 선택한 값 가져오기

코드 빨강색 노랑색 초록색 const changeValue = (target) => { // 선택한 option의 value 값 console.log(target.value); // option의 text 값 console.log(target.options[target.selectedIndex].text); } 코드 설명 See the Pen select 선택한 값 by bolgang13 (@bolgang13) on CodePen. select 요소에서 value 키워드로 접근, value 값을 가져올 수 있습니다. 선택한 text 값은 해당 select 요소에서 현재 선택한 option의 인덱스 값으로 가져올 수 있고, 해당 값에서 option 목록을 지정해 해당 text 값을 가져올 수 있습니다.

[JS] 백준 1009번 분산처리

출처 백준 온라인 저지 https://www.acmicpc.net/problem/1009 1009번: 분산처리 입력의 첫 줄에는 테스트 케이스의 개수 T가 주어진다. 그 다음 줄부터 각각의 테스트 케이스에 대해 정수 a와 b가 주어진다. (1 ≤ a < 100, 1 ≤ b < 1,000,000) www.acmicpc.net 문제 재용이는 최신 컴퓨터 10대를 가지고 있다. 어느 날 재용이는 많은 데이터를 처리해야 될 일이 생겨서 각 컴퓨터에 1번부터 10번까지의 번호를 부여하고, 10대의 컴퓨터가 다음과 같은 방법으로 데이터들을 처리하기로 하였다. 1번 데이터는 1번 컴퓨터, 2번 데이터는 2번 컴퓨터, 3번 데이터는 3번 컴퓨터,... , 10번 데이터는 10번 컴퓨터, 11번 데이터는 1번 컴퓨터, ..

[JS] 이진 탐색(이분 탐색)

이진 탐색 알고리즘(Binary Search Algorithm)은 이미 정렬되어 있는 배열에서 탐색 범위를 두 부분 리스트로 나눠 절반씩 좁혀가 필요한 부분에서만 탐색하도록 제한하여 원하는 값을 찾는 알고리즘입니다. 예를 들어 1부터 10까지의 배열에서 3을 찾는다면 찾는 배열의 중간인 5를 기준으로 대소를 비교하고 3은 5보다 작기 때문에 두 부분 나눈 리스트에서 5 이상은 탐색범위에서 제외시키고 5 이하의 부분에서 다시 탐색하게 되는 방식입니다. 이진 탐색은 정렬되어 있는 배열이 필요로 하며 각 left, right, mid의 변수가 필요하게 됩니다. left은 왼쪽의 끝 인덱스를 뜻하며 right는 오른쪽의 끝 인덱스를 뜻하고 left와 right의 사이는 탐색범위가 됩니다. 변수명은 (low, h..

[JS] 백준 1920번 수 찾기

출처 백준 온라인 저지 https://www.acmicpc.net/problem/1920 1920번: 수 찾기 첫째 줄에 자연수 N(1 ≤ N ≤ 100,000)이 주어진다. 다음 줄에는 N개의 정수 A[1], A[2], …, A[N]이 주어진다. 다음 줄에는 M(1 ≤ M ≤ 100,000)이 주어진다. 다음 줄에는 M개의 수들이 주어지는데, 이 수들 www.acmicpc.net 문제 N개의 정수 A [1], A [2], …, A [N]이 주어져 있을 때, 이 안에 X라는 정수가 존재하는지 알아내는 프로그램을 작성하시오. 첫째 줄에 자연수 N(1 ≤ N ≤ 100,000)이 주어진다. 다음 줄에는 N개의 정수 A [1], A [2], …, A [N]이 주어진다. 다음 줄에는 M(1 ≤ M ≤ 100,0..

[JS] 배열 특정 값 포함 여부, 중복체크 (includes, indexOf, some, every)

includes const array = [1, 2, 3, 4, 5]; array.includes(6); // false array.includes(3); // true array.includes(3, 3); // false includes 메서드는 배열이 특정 요소의 포함 여부를 판별합니다. 첫 인자값에는 탐색할 요소를 보내며 두번째 인자값에는 탐색을 시작할 위치를 보냅니다. (기본 값 0) indexOf const array = [1, 2, 3, 4, 5]; array.indexOf(6); // -1 array.indexOf(3); // 2 array.indexOf(3, 3); // -1 indexOf 메서드는 배열에서 특정 요소를 찾을 수 있는 첫 번째 인덱스를 반환하고 존재하지 않으면 -1을 반환..

[JS] textarea 줄바꿈 갯수

코드 const rowsCount = (target) => { // 개수 console.log( target.value.split("\n").length - 1 ); } Enter를 입력 시 줄바꿈 되는 개행(\n)을 기준으로 잘라 개수를 셀 수 있습니다.

[JS] 프로그래머스 예산

출처 https://programmers.co.kr/learn/courses/30/lessons/12982 코딩테스트 연습 - 예산 S사에서는 각 부서에 필요한 물품을 지원해 주기 위해 부서별로 물품을 구매하는데 필요한 금액을 조사했습니다. 그러나, 전체 예산이 정해져 있기 때문에 모든 부서의 물품을 구매해 줄 수는 programmers.co.kr 문제 S사에서는 각 부서에 필요한 물품을 지원해 주기 위해 부서별로 물품을 구매하는데 필요한 금액을 조사했습니다. 그러나, 전체 예산이 정해져 있기 때문에 모든 부서의 물품을 구매해 줄 수는 없습니다. 그래서 최대한 많은 부서의 물품을 구매해 줄 수 있도록 하려고 합니다. 물품을 구매해 줄 때는 각 부서가 신청한 금액만큼을 모두 지원해 줘야 합니다. 예를 들어..

[JS] 다중 배열 하나의 배열로 묶기 (flat)

flat 메서드 const newArr = arr.flat([depth]) flat 메서드는 모든 배열 요소를 지정한 깊이까지 이어 붙인 새로운 배열을 생성하는 메서드입니다. 빈 요소가 있으면 무시하며 depth에 따라 합치는 정도를 정할 수도 있습니다. (기본은 1입니다.) [1, 2, [3, 4]].flat(); // [1, 2, 3, 4] [1, 2, [3, 4, [5, 6]]].flat(); // [1, 2, 3, 4, [5, 6]] [1, 2, [3, 4, [5, 6]]].flat(2); // [1, 2, 3, 4, 5, 6] [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]].flat(Infinity); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] 어디서 ..

[JS] 팝업창 가운데에 위치시키기

코드 const width = 600; const height = 600; let left = (document.body.offsetWidth / 2) - (width / 2); let tops = (document.body.offsetHeight / 2) - (height / 2); left += window.screenLeft; const popup = window.open('/', 'popup', `width=${width}, height=${height}, left=${left}, top=${tops}`); 코드 설명 해당 코드는 screen.width을 사용하지 않습니다. 그 이유는 듀얼 모니터 때문입니다. screen.width을 사용 시 메인 모니터를 기준 값이기에 서브 모니터에서 페이지를 ..

[JS] 전화번호 자동 하이픈(-) 정규식

첫 번째 코드 const phone = '01012345678'; phone.replace(/^(\d{2,3})(\d{3,4})(\d{4})$/, `$1-$2-$3`); // '010-1234-5678' 00-000-0000 또는 000-0000-0000 전화번호를 (2, 3) - (3, 4) - (4) 자리에 숫자 그룹을 지어 묶어줍니다. replace() 메서드로 각 그룹($1, $2, $3)을 순서대로 배치하고 사이에 하이픈을 추가시켜 하이픈이 추가된 전화번호를 완성시켜 줍니다. const phone = "010-12345678"; phone .replace(/[^0-9]/g, '') // 숫자를 제외한 모든 문자 제거 .replace(/^(\d{2,3})(\d{3,4})(\d{4})$/, `$1-..

[JS] 백준 2920번 음계

출처 백준 온라인 저지 https://www.acmicpc.net/problem/2920 2920번: 음계 다장조는 c d e f g a b C, 총 8개 음으로 이루어져있다. 이 문제에서 8개 음은 다음과 같이 숫자로 바꾸어 표현한다. c는 1로, d는 2로, ..., C를 8로 바꾼다. 1부터 8까지 차례대로 연주한다면 ascending, 8 www.acmicpc.net 문제 다장조는 c d e f g a b C, 총 8개 음으로 이루어져 있다. 이 문제에서 8개 음은 다음과 같이 숫자로 바꾸어 표현한다. c는 1로, d는 2로,..., C를 8로 바꾼다. 1부터 8까지 차례대로 연주한다면 ascending, 8부터 1까지 차례대로 연주한다면 descending, 둘 다 아니라면 mixed이다. 연주..

[JS] 아주 큰 숫자 한계 처리

문제점 자바스크립트의 기본 자료형의 수는 한계점이 존재합니다. Number.MAX_SAFE_INTEGER의 값보다 큰 값은 정확하지 않을 때가 많습니다. 해결방법 BigInt 타입의 값을 만들어 계산하는 방법으로 해결할 수 있습니다. 숫자 뒤에 BigInt을 호출하거나 n을 붙여 값을 만들 수 있습니다. 이를 사용하여 기본 자료형의 수로 연산하여 나온 Infinify의 한계를 넘을 수 있습니다. 하지만 주의해야 할 점은 BigInt형의 값은 BigInt형의 값만으로 연산할 수 있으며 기본 숫자형의 값으로는 연산할 수 없습니다. 그 후 toString 메서드를 이용하여 맨뒤에 붙어있는 n을 제거한 문자열로 바꿀 수 있습니다. 참고사이트 https://developer.mozilla.org/ko/docs/W..