JavaScript로 문자열을 다루다 보면, 해당 문자열이 물음표(?), 마침표(.), 쉼표(,) 같은 구두점(punctuation)으로 시작하는지 확인해야 하는 경우가 있습니다. 이럴 때 정규 표현식(Regular Expression)을 활용하면 간단하게 처리할 수 있습니다.예제 상황예를 들어 아래와 같은 두 개의 문자열이 있다고 가정해 보겠습니다. 두 번째 문장은 물음표(?) 즉, 구두점으로 시작합니다.var sentence1 = My Name is John Smith. var sentence2 = ? My Name is Joh
JavaScript에서 객체 내부의 모든 값을 null로 설정하려면, 먼저 객체의 모든 키(key)를 가져온 뒤 각 키에 해당하는 값을 null로 할당해야 합니다. 이 작업은 for 반복문이나 forEach() 메서드를 활용하여 간단하게 처리할 수 있습니다.Object.keys()와 forEach()를 활용한 방법가장 널리 사용되는 방식은 Object.keys()로 객체의 키 목록을 추출하고, forEach()로 각 키를 순회하며 값을 null로 바꾸는 것입니다.다음은 이름이 records인 배열 객체의 모든 값을 null로 설정하
SVG의 <text> 요소에 담긴 텍스트 값을 JavaScript 변수로 추출하려면 textContent 속성을 사용하면 됩니다.먼저 getElementById() 메서드로 해당 요소를 선택한 뒤, 다음과 같이 textContent 속성으로 내부 텍스트를 가져올 수 있습니다.document.getElementById(yourTextIdValue).textContent전체 예제 코드아래는 완성된 HTML 예제입니다. SVG <text> 요소의 값을 자바스크립트 변수에 담아 콘솔에 출력하는 코드입니다.<!DO
배열이나 문자열로 변환하지 않고 숫자를 입력받아 그 숫자를 뒤집어 반환하는 JavaScript 함수를 작성해야 합니다.즉, 내장된 reverse() 메서드나 Array, String 객체에 의존하지 않고 순수한 수학적 연산만으로 문제를 해결해야 합니다. 가장 효율적인 접근 방식은 재귀(recursion)와 나머지 연산자(%)를 활용하는 것입니다. 숫자의 마지막 자릿수를 하나씩 추출해 결과값에 누적하고, 남은 숫자로 재귀 호출을 반복하다가 숫자가 0이 되면 누적된 결과를 반환합니다. 예제 const num = 234567; const
문제 소개다음과 같이 여러 개의 하위 배열을 포함하는 2차원 배열이 있다고 가정해 보겠습니다.const arr = [ [foo, bar, hey, oi], [foo, bar, hey], [foo, bar, anything], [bar, anything] ];이 배열을 입력받아, 모든 하위 배열에 공통으로 나타나는 문자열만 모아 하나의 배열로 반환하는 JavaScript 함수를 작성해야 합니다.해결 방법: reduce()와 filter() 조합이 문제는 Array.prototype.reduce() 메서드를
다음과 같은 리터럴 값으로 이루어진 배열이 있다고 가정해 보겠습니다.const arr = [, 20191219, 20191220, 20191221, 20191222, 20191223, 20191224, 20191225];여기서 필요한 것은 이 배열과 숫자 n을 인수로 받아 처리하는 JavaScript 함수입니다. 해당 요소가 n자리 이상이라면 새로운 요소에는 마지막 n자리만 남기고, 그렇지 않다면 원래 값을 그대로 유지해야 합니다.구현 예제const arr = [, 20191219, 20191220, 20191221, 2019122
실무에서는 서로 다른 구조의 두 배열을 하나의 기준 값으로 연결해야 하는 경우가 자주 발생합니다. 이번 글에서는 공통 속성값(POSITION)을 기준으로 한 배열의 데이터를 다른 배열에 병합하는 방법을 알아보겠습니다.문제 상황다음과 같이 두 개의 배열이 있다고 가정해 보겠습니다.let arr1 = [ { LEVEL: 4, POSITION: RGM }, { LEVEL: 5, POSITION: GM }, { LEVEL: 5, POSITION: GMH } ] let arr2 = [ { EMAIL: test1@stc.com
다음과 같은 객체 배열이 있다고 가정해 보겠습니다.let data = [ {id:1, Name: Abe, RowNumber: 1 }, {id:2, Name: Bob, RowNumber: 2 }, {id:3, Name: Clair, RowNumber: 3 }, {id:4, Name: Don, RowNumber: 3.0 }, {id:5, Name: Edna, RowNumber: 3.1 }, {id:6, Name: Frank, RowNumber: 3.2 }, {id:7, Name: Gab
JavaScript에서 두 개의 숫자 배열을 인자로 받아, 첫 번째 배열의 모든 요소가 두 번째 배열 안에 존재하는지 확인하는 함수를 작성해야 하는 경우가 있습니다. 이 글에서는 map()과 indexOf()를 활용해 이 문제를 간단하게 해결하는 방법을 알아보겠습니다.예제 데이터먼저 아래와 같이 두 개의 배열이 있다고 가정해 보겠습니다.const arr1 = [34, 78, 89]; const arr2 = [78, 67, 34, 99, 56, 89];여기서 목표는 arr1의 값 34, 78, 89가 모두 arr2에 포함되어 있는지
문제 이해하기숫자 배열을 입력받아, 원본 배열에서 인접한 두 요소씩 짝지어 더한 값들을 새로운 배열로 반환하는 JavaScript 함수를 작성해야 합니다.예를 들어 입력 배열이 다음과 같다면 −const arrayOne = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];출력 결과는 다음과 같아야 합니다 −const newArrayOne = [1, 5, 9, 13, 17];즉, 0+1=1, 2+3=5, 4+5=9처럼 두 칸씩 건너뛰며 연속된 요소들의 합을 구하는 것입니다.해결 방법이 문제는 반복문에서 인
이번 문제의 요구 사항은 간단합니다. 숫자를 입력받아 그 숫자가 몇 자리인지 반환하는 자바스크립트 함수를 작성하는 것입니다.문제 이해하기예를 들어 다음과 같은 결과가 나와야 합니다.4567의 자릿수는 4423467의 자릿수는 6457의 자릿수는 3재귀 함수로 해결하기가장 우아한 방법 중 하나는 재귀(Recursion)를 활용하는 것입니다. 숫자를 10으로 나눈 몫을 다시 함수에 전달하고, 호출될 때마다 카운트를 1씩 증가시키면 됩니다. 숫자가 0이 되면 지금까지 쌓인 카운트가 곧 자릿수입니다.코드 예제const num = 23534
JavaScript에서 map() 메서드를 사용할 때 현재 순회 중인 요소뿐만 아니라 바로 이전 요소에도 접근해야 하는 경우가 종종 있습니다. 예를 들어 각 항목과 그 앞에 위치한 항목을 함께 비교하거나, 이전 값을 기반으로 새로운 속성을 추가하고 싶을 때가 그렇습니다.다행히 map() 콜백 함수는 두 번째 인자로 인덱스(index)를 제공하기 때문에, 원본 배열에 인덱스로 접근하면 이전 요소를 손쉽게 가져올 수 있습니다.예제 데이터 준비먼저 다음과 같은 과목 정보 배열이 있다고 가정해 보겠습니다.var details = [
JavaScript에서 드롭다운(select) 요소에 포함된 옵션(option)의 개수를 확인해야 하는 경우가 종종 있습니다. 예를 들어, 아래와 같은 드롭다운이 있다고 가정해 보겠습니다.<select id=lengthListOfOptionDemo> <option>John</option> <option>Mike</option> <option>Sam</option> <option>David</option> <
문제 소개숫자 배열에 0과 1, 그리고 그 외의 다른 숫자들이 섞여 있다고 가정해 보겠습니다. 이때 자바스크립트 함수를 작성하여 배열 안의 모든 1은 맨 앞으로, 모든 0은 맨 뒤로 이동시켜야 하며, 나머지 숫자들은 원래 순서를 유지한 채 중간에 위치해야 합니다.해결 코드아래 예제를 통해 이 문제를 해결하는 함수를 살펴보겠습니다. { const copy = arr.slice(); for(let i = 0; i < copy.length; i++){ if(copy[i] === 0){ c
JavaScript의 문자열 메서드 중 하나인 toLowerCase()는 문자열 내 모든 대문자를 소문자로 변환해 줍니다. 이번 글에서는 이 기본 메서드를 직접 덮어쓰기(override)하면서 동일한 기능을 수행하는 사용자 정의 함수를 만들어 보겠습니다.구현 원리핵심 아이디어는 아스키(ASCII) 코드 값을 활용하는 것입니다. 영어 대문자 A~Z는 아스키 코드 65~90에 해당하고, 소문자 a~z는 97~122에 해당합니다. 즉, 대문자와 소문자 사이에는 항상 32만큼의 차이가 존재합니다. 따라서 각 문자의 아스키 코드를 확인한 뒤
문제 개요 양수와 음수가 섞여 있는 숫자 배열을 입력받아, 원래 배열 안에 합이 0이 되는 연속된 부분 배열(subarray)이 존재하는지 판별하는 JavaScript 함수를 작성해야 합니다. 조건을 만족하면 true, 만족하지 않으면 false를 반환하면 됩니다. 접근 방식: 누적 합(Prefix Sum) 활용 핵심 아이디어는 간단합니다. 배열을 처음부터 끝까지 순회하면서 각 지점까지의 누적 합을 계산하고, 그 값을 Map 객체에 기록합니다. 순회 도중 다음 두 가지 상황 중 하나라도 발생하면 합이 0인 부분 배열이 반드시 존재합
문제 소개이번 글에서는 문자열과 숫자 n을 두 개의 인수로 받는 JavaScript 함수를 작성해 보겠습니다. 여기서 n은 문자열의 길이를 정확히 나누어떨어지게 하는 값이어야 하며, 함수는 각각 동일한 길이를 가진 n개의 문자열로 이루어진 배열을 반환해야 합니다.예를 들면 다음과 같습니다.문자열이 helloo이고 숫자가 3이라면출력 결과는 다음과 같습니다:[ho, eo, ll]여기서 각 부분 문자열은 정확히 (문자열 길이 ÷ n)개의 문자를 포함합니다. 또한 각 부분 문자열은 원본 문자열의 앞쪽 문자와 뒤쪽 문자를 번갈아 가며 하나
문제 정의 여러 학생의 과목별 시험 점수가 아래와 같이 배열 안에 중첩된 형태(배열의 배열)로 저장되어 있습니다. 각 내부 배열은 [과목명, 학생 이름, 점수] 순서로 구성됩니다. const arr = [ [Math, John, 100], [Math, Jake, 89], [Math, Amy, 93], [Science, Jake, 89], [Science, John, 89], [Science, Amy, 83], [English, John, 82], [English, Amy, 8
반복되는 문자를 포함하는 문자열을 입력받아, 같은 문자들이 서로 정확히 n칸씩 떨어지도록 재배열한 새 문자열을 반환하는 JavaScript 함수를 작성해야 합니다. 이때 n은 문자열 길이보다 작은 값이어야 합니다.문제 예시입력 문자열: "accessories" n = 3 반환값: "secrsecisao"참고: 조건을 만족하는 결과 문자열은 여러 가지가 존재할 수 있습니다. 순서는 중요하지 않으며, 로직상 요구 사항을 충족하기만 하면 그 출력은 올바른 것으로 간주됩니다.접근 방식1. 문자별 빈도수
JavaScript 개발을 하다 보면 두 객체를 비교하여 한쪽에만 존재하는 데이터를 추출해야 하는 경우가 자주 발생합니다. 폼 입력값의 변경 사항을 감지하거나, API 응답 데이터 간의 차이를 확인할 때 특히 유용합니다.이번 글에서는 두 개의 객체(중첩된 객체도 처리 가능)를 인자로 받아, 첫 번째 객체에는 있지만 두 번째 객체에는 없는 키만으로 새로운 객체를 생성해 반환하는 함수를 만들어 보겠습니다.구현 코드 { if(!second.hasOwnProperty(val)){ acc[val] = fi