문제 개요 숫자 하나를 인수로 받아 해당 숫자가 피보나치 수(Fibonacci number), 즉 피보나치 수열에 속하는 값인지 판별하는 자바스크립트 함수를 작성해 보겠습니다. 함수는 입력값이 피보나치 수이면 true, 그렇지 않으면 false를 반환해야 합니다. 피보나치 수열이란? 피보나치 수열은 첫 두 항이 0과 1이고, 세 번째 항부터는 바로 앞의 두 항을 더한 값이 되는 수열입니다. 0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, ... 구현 코드 const num = 2584; const

다음과 같은 숫자 배열이 있다고 가정해 보겠습니다. const arr = [14, 54, 23, 14, 24, 33, 44, 54, 77, 87, 77, 14]; 우리가 작성해야 할 것은 이 배열에서 딱 한 번만 등장하는 요소들만 골라내어 그 합계를 반환하는 자바스크립트 함수입니다. 문제 이해하기 위 배열에서 14, 54, 77은 각각 두 번씩 등장하는 중복 요소입니다. 반면 23, 24, 33, 44, 87은 한 번만 등장하므로, 이 값들의 합이 최종 결과가 됩니다. 예상 출력 결과 211 방법 1: indexOf()와 lastI

이번 글에서는 길이가 N(양수인 짝수)인 숫자 배열을 입력받아, 이를 각각 N/2개의 요소를 가진 두 개의 하위 배열(왼쪽과 오른쪽)로 나눈 뒤, 각 하위 배열의 곱을 계산하고 그 결과를 더하는 JavaScript 함수를 작성해 보겠습니다.문제 예시예를 들어 입력 배열이 다음과 같다고 가정해 봅시다.const arr = [1, 2, 3, 4, 5, 6]배열을 앞부분 [1, 2, 3]과 뒷부분 [4, 5, 6]으로 나누면, 각 부분의 곱은 다음과 같습니다.(1*2*3) + (4*5*6) = 6 + 120 = 126따라서 최종 출력값은

문제 정의숫자로 이루어진 배열을 입력받아, 모든 인접한 두 요소의 합 중에서 가장 작은 값을 가지는 쌍을 하위 배열 형태로 반환하는 JavaScript 함수를 작성해야 합니다. 단, 배열의 길이가 2보다 작으면 false를 반환해야 합니다.예시입력 배열이 다음과 같다고 가정해 보겠습니다.const arr = [41, 44, -12, 13, -23, 1, 5, -4, 2, 2];여기서 쌍 [-23, 1]의 합은 -22로, 배열 내 모든 인접 요소 쌍 중 가장 작은 값입니다. 따라서 함수는 [-23, 1]을 반환해야 합니다.구현 코드c

문제 개요이번 글에서는 String.prototype 객체에 추가할 removeStr() 함수를 작성해 보겠습니다. 이 함수는 다음 세 가지 인자를 받습니다.str: 대상이 되는 원본 문자열char(subStr): 제거하고자 하는 문자 또는 부분 문자열n(num): 몇 번째로 등장하는 항목을 제거할지 지정하는 숫자즉, 이 함수는 문자열에서 n번째로 나타나는 특정 문자(또는 부분 문자열)를 찾아 제거한 새로운 문자열을 반환해야 합니다. 만약 해당 문자가 존재하지 않거나 n번째 등장 횟수가 없다면 -1을 반환하도록 처리합니다.구현 코드

onclick()으로 함수 호출하기 웹 페이지에서 버튼 클릭 같은 사용자 동작에 반응하려면 이벤트 처리가 필수입니다. HTML의 onclick 속성을 사용하면 버튼을 클릭했을 때 원하는 JavaScript 함수를 아주 간단하게 호출할 수 있습니다. 기본 문법 버튼 요소에 onclick 속성을 추가하고, 클릭 시 실행할 함수 이름을 지정하면 됩니다. <button onclick="displayingMessageOnButtonClick()">Press Me</button> 위 버튼을 클릭하면 d

문자열을 다루다 보면 첫 번째 슬래시(/) 앞부분만 다른 값으로 바꿔야 하는 경우가 있습니다. 이 글에서는 JavaScript의 replace() 메서드와 정규 표현식을 활용해 첫 번째 슬래시 앞의 문자열을 손쉽게 교체하는 방법을 알아보겠습니다.예제 문자열 준비먼저 슬래시가 포함된 다음과 같은 문자열이 있다고 가정해 보겠습니다.var queryStringValue = welcome/name/john/age/32;여기서 목표는 첫 번째 슬래시 앞에 있는 welcome 부분을 index로 교체하는 것입니다.정규 표현식으로 해결하기첫 번

웹 개발에서 RGB 색상 값을 16진수(HEX) 색상 코드로 변환해야 하는 경우가 자주 있습니다. 이번 글에서는 RGB 색상을 입력받아 해당하는 16진수 표현을 반환하는 JavaScript 함수를 작성하는 방법을 알아보겠습니다.요구 사항작성할 함수는 빨강(Red), 초록(Green), 파랑(Blue) 세 가지 색상 값을 담고 있는 객체를 인자로 받습니다. 그리고 이를 #RRGGBB 형식의 16진수 문자열로 변환하여 반환해야 합니다.예시rgbToHex(0, 128, 192)은 #0080C0을 반환해야 합니다.구현 코드다음은 비트 연산

웹 개발을 하다 보면 16진수(Hexadecimal) 색상 코드를 RGB 값으로 변환해야 하는 경우가 자주 발생합니다. 예를 들어 CSS에서는 #0080C0처럼 표현된 색상을 캔버스(Canvas) API나 SVG 조작 시에는 RGB 숫자 형태로 다뤄야 할 수 있습니다.이번 글에서는 16진수 색상 문자열을 입력받아 빨강(Red), 초록(Green), 파랑(Blue) 값을 담은 객체를 반환하는 JavaScript 함수를 작성하는 방법을 알아보겠습니다.요구 사항 정리함수는 다음과 같이 동작해야 합니다.hexToRgb(#0080C0) →

JavaScript로 2차원 배열의 전치(Transpose) 구현하기이번 글에서는 2차원 배열을 인자로 받아 그 전치(transpose) 배열을 반환하는 JavaScript 함수를 작성해 보겠습니다.여기서 전치란 행렬의 행과 열을 서로 맞바꾸는 연산을 의미합니다. 즉, 원본 배열의 각 행은 결과 배열에서 열로 변환되고, 각 열은 행으로 변환됩니다.방법 1: Array.prototype.forEach() 사용forEach() 메서드를 이중으로 사용하여 바깥 배열과 내부 배열을 순회하면서, 각 요소의 위치를 행과 열 기준으로 뒤바꿔 새

문제 상황다음과 같이 객체로 구성된 배열이 있다고 가정해 보겠습니다.const arr = [ {a:1, b:apples}, {a:3, b:apples}, {a:4, b:apples}, {a:1, b:bananas}, {a:3, b:bananas}, {a:5, b:bananas}, {a:6, b:bananas}, {a:3, b:oranges}, {a:5, b:oranges}, {a:6, b:oranges}, {a:10, b:oranges} ];여기서 요구되

이번 튜토리얼에서는 첫 번째 인자로 숫자 배열을, 두 번째 인자로 목표 숫자 하나를 받는 JavaScript 함수를 작성하는 방법을 알아보겠습니다.이 함수는 원본 배열에서 서로 다른 두 숫자를 선택하여, 그 합이 두 번째 인자로 전달된 숫자에 가장 가까운 쌍을 배열 형태로 반환해야 합니다.문제 예시배열 [1, 2, 3, 4, 5, 6, 7]과 목표 숫자 14가 주어졌을 때, 두 수의 합이 14에 가장 가까운(정확히 14가 되는) 쌍은 6과 7입니다. 따라서 함수는 [6, 7]을 반환해야 합니다.구현 코드const arr = [1,

하이픈으로 구분된 문자열을 camelCase로 변환하기JavaScript 개발을 하다 보면 this-is-an-example처럼 단어가 하이픈(-)으로 구분된 문자열을 만나는 경우가 많습니다. 예를 들어 CSS 클래스명이나 URL 슬러그를 처리할 때 자주 볼 수 있는 형식입니다. 이번 글에서는 이런 하이픈 문자열을 받아서 camelCase 형태로 변환하는 JavaScript 함수를 작성해 보겠습니다.문제 정의다음과 같은 문자열이 있다고 가정해 보겠습니다.const str = this-is-an-example;이 문자열을 입력받아 각

문제 소개최소 한 쌍 이상의 중복된 숫자를 포함하는 숫자 배열을 입력으로 받아, 배열 안에 존재하는 모든 중복 숫자 쌍 사이의 거리(인덱스 차이)를 구하는 JavaScript 함수를 작성해야 합니다.여기서 거리란 같은 숫자가 등장하는 인덱스 위치 간의 차이를 의미합니다. 숫자가 세 번 이상 등장하는 경우에는 인접한 등장 위치들 사이의 거리를 계산한 뒤, 그중 가장 작은 값을 결과로 삼는 방식이 효율적입니다.해결 전략이 문제는 다음과 같은 단계로 해결할 수 있습니다.인덱스 매핑: 배열을 순회하면서 각 숫자가 등장한 인덱스들을 객체에

음이 아닌 정수가 하나 주어졌을 때, 해당 숫자의 각 자릿수를 독립적인 요소로 분리한 뒤 역순으로 담은 배열을 반환하는 함수를 작성해야 하는 문제입니다.예시입력값과 기대되는 출력 결과는 다음과 같습니다.348597 => 올바른 결과는 [7, 9, 5, 8, 4, 3] 입니다.해결 코드const num = 348597; const reverseArrify = num => { const numArr = String(num).split(); const reversed = []; for(let i = num

JavaScript에서 날짜와 시간을 다룰 때 Day.js는 가볍고 직관적으로 사용할 수 있는 인기 라이브러리입니다. 이 글에서는 Day.js의 diff() 메서드를 활용해 두 시간 사이의 차이를 계산하는 방법을 예제와 함께 살펴보겠습니다.시간 데이터 준비하기먼저 다음과 같은 시작 시간과 종료 시간 데이터가 있다고 가정해 보겠습니다.var startHour = dayjs().hour(10) var endHour = dayjs().hour(22)dayjs()는 현재 시각을 기준으로 Day.js 객체를 생성하며, hour() 메서드는

Object.values()와 reduce()로 객체 배열 병합하기 자바스크립트에서 객체 컬렉션을 병합하고 중복된 데이터를 하나로 통합하는 가장 효과적인 방법은 Object.values()와 reduce()를 함께 활용하는 것입니다. 이 두 메서드를 조합하면 동일한 키(예: 학생 ID)를 가진 객체들을 자동으로 그룹화하고, 숫자 값을 누적하여 깔끔하게 정리할 수 있습니다. 다음과 같은 학생 정보 객체 배열이 있다고 가정해 보겠습니다. 여기에는 studentId가 10인 John 학생의 데이터가 두 번 중복되어 있습니다. var de

JavaScript에서는 문자열 변수를 객체의 키로 활용할 수 있습니다. 이때 핵심은 대괄호([]) 표기법, 즉 계산된 속성명(Computed Property Name) 문법을 사용하는 것입니다.기본 개념예를 들어 다음과 같은 문자열이 있다고 가정해 보겠습니다.const keyName = username;이 문자열을 객체의 키로 설정하려면 객체를 정의할 때 대괄호([]) 안에 문자열 변수를 넣어주면 됩니다.const stringToObject = { [keyName]: David Miller };대괄호 안에 변수를 사용하면 Ja

다음과 같은 문자열이 있다고 가정해 보겠습니다.var stringValue="453.000.00.00.0000";위 문자열처럼 점(.)과 0이 섞여 있는 값을 그대로 parseInt()에 넘기면 원하는 결과를 얻을 수 없습니다. 따라서 먼저 replace() 메서드와 정규식을 사용해 모든 점을 제거한 뒤, parseInt()로 숫자로 변환해야 합니다.var numberValue = parseInt(stringValue.replace(/\./gm, ));여기서 정규식 /\./gm은 문자열 전체에서 마침표(.)를 찾아

JavaScript에는 문자열 내 특정 단어의 모든 등장 위치를 한 번에 교체하는 내장 함수가 없습니다. 따라서 원하는 기능을 구현하려면 직접 사용자 정의 함수를 만들어야 합니다.기본 아이디어가장 간단한 방법은 split()과 join() 메서드를 조합하는 것입니다. 문장을 교체하고 싶은 단어를 기준으로 잘라낸 뒤, 새로운 단어로 다시 연결하면 됩니다.예를 들어, 다음과 같은 문자열이 있다고 가정해 보겠습니다.var sentence = Yes, My Name is John Smith. I live in US. Yes, My Favo