JavaScript

はじめにJavaScriptの開発では、複数の配列を組み合わせて1つのオブジェクト（JSON形式のデータ）にまとめたいケースがよくあります。例えば、料理名の配列と、それぞれの料理に対応する食材リストの配列がある場合、これらをキーと値のペアを持つオブジェクトに変換すると、データの管理や操作が格段に行いやすくなります。本記事では、2つの配列を受け取り、それらを対応付けて新しいオブジェクトを生成するJavaScript関数の実装方法を解説します。前提となるデータ以下のような2つの配列を想定します。const meals = [breakfast, lunch, dinner]; const ingr

はじめに 次のようなオブジェクトの配列があると仮定しましょう。 const arr = [{ title: Hey, foo: 2, bar: 3 }, { title: Sup, foo: 3, bar: 4 }, { title: Remove, foo: 3, bar: 4 }]; ここで求められているのは、第一引数に上記のようなオブジェクトの配列を、第二引数に文字列リテラルの配列を受け取るJavaScript関数を作成することです。 この関数は、各オブジェクトのtitleプロパティが、第二引数の文字列のいずれかに部分的また

JavaScriptで、元のシーケンスの要素の順序を保ったまま(安定な状態で)、指定した値のグループをシーケンスから削除する方法が全部で何通りあるかを求める関数を作成します。ここでのルールは、削除対象の各値について、元のシーケンスから1つのインスタンスだけを削除するというものです。 問題の例 例として、次のシーケンス配列があるとします。 const arr = [1, 2, 1, 3, 1, 4, 4]; 削除したい配列は以下の通りです。 const arr2 = [1, 4, 4]; 要素の順序を崩すことなく削除を実行できる方法は、次の3通りあります。 1 --> [2, 1, 3,

JavaScriptでは、リテラル（数値や文字列など）を含む配列を受け取り、その中で最も多く登場する要素（最頻値）と、それが何回繰り返されているかを出力する関数を書くことができます。実装の考え方この処理は、配列の reduce() メソッドを使うことで効率的に実装できます。各要素の出現回数をオブジェクトに記録しながら走査し、同時に最大出現回数を持つ要素を追跡します。同じ出現回数の要素が複数ある場合は、それらすべてを配列に格納して返すようにしています。コード例実際のコードは以下のとおりです。 count[acc[0]]) { return [val]; }

問題の概要 JavaScriptでは、「月-年」(MM-YYYY) 形式の日付文字列を格納した配列を、古い日付から新しい日付へと並べ替えたいケースがあります。たとえば、次のような配列を考えてみましょう。 const arr = ["1-2016", "7-2015", "7-2016", "3-2016", "8-2016", "2-2016", "6-2016", "8-2015", "5-2016", &quo

はじめにJavaScriptでは、複数の配列を受け取り、それらの要素をすべて組み合わせた結果（直積）を生成したい場面がよくあります。例えば、次のような2つの配列があるとします。const arr1 = [a, b, c]; const arr2 = [d, e, f];この2つの配列から作れるすべての組み合わせを求めたい場合、期待される出力は以下のようになります。const output = [ad, ae, af, bd, be, bf, cd, ce, cf];この記事では、可変長引数を使うことで、任意の数の配列に対応できる汎用的な関数を実装する方法を解説します。再帰を使った実装方法ポイン

本記事では、文字列や数値といったリテラル値の配列を複数含む多次元配列を受け取り、すべてのサブ配列に共通して存在する要素だけを抜き出した「交差（積集合）」の配列を返すJavaScript関数の作り方を解説します。要件の確認まずは、次のような2つのサブ配列を持つ多次元配列を例に考えてみましょう。const arr = [ [garden, canons, philips, universal], [universal, ola, uber, bangalore] ];この場合、両方のサブ配列に共通して存在する要素は universal の1つだけです。つまり、作成する関数は次の結果

フロントエンド開発では、APIなどから取得した複数の配列を、共通のキーを基準に1つのデータ構造へまとめたい場面がよくあります。本記事では、JavaScriptを使って「質問の回答情報」と「選択肢情報」という2つの異なるオブジェクト配列を、ユーザーごとにグループ化してマージする方法を解説します。 マージ対象となる2つの配列 まず、ある人々が回答した質問に関する情報を含む、2つの異なるオブジェクト配列を用意します。 arr1： 各ユーザーの個人ID・質問番号・回答値を持つ配列 arr2： 質問番号・選択肢ID・選択値（色）を持つ配列 const arr1 = [ { PersonalID:

はじめに本記事では、リテラル値（数値や文字列など）を含む配列を受け取り、その中から「ちょうど2回」出現している要素だけを取り出し、新しい配列として返すJavaScript関数の実装方法を解説します。アプローチのポイント実装は大きく2つのステップに分けられます。指定した値が配列内に何回出現するかをカウントするヘルパー関数を用意する。元の配列の各要素に対して出現回数をチェックし、回数が2回であれば結果配列へ追加する。なお、同じ値がすでに結果配列に入っている場合は再度追加しないよう includes() による重複チェックを行うことで、出力の重複を防いでいます。サンプルコード実際のコードは以下の通り

はじめにJavaScript開発では、2つのオブジェクト配列を特定のキー(ここではid)に基づいて1つにまとめたい場面がよくあります。例えば、一方の配列にはユーザーのIDと名前が含まれ、もう一方の配列にはユーザーのIDと住所が含まれているようなケースです。本記事では、これら2つの配列を結合して、各ユーザーの情報をすべて含む新しい配列を作成する方法を解説します。サンプルデータ今回扱う配列は以下の通りです。const arr1 = [ {id:123,name:name 1}, {id:456,name:name 2} ]; const arr2 = [ {id:123,a

配列の重複を削除して1つだけ残す JavaScriptでは、数値や文字列などのリテラル値を格納した配列から、重複する要素を取り除いて各値を1つだけ残したい場面がよくあります。ここでは、配列を受け取って重複した値を削除する関数の実装方法を解説します。 紹介する方法では、配列を先頭から順に走査しながら、同じ値が後ろにも存在するかどうかをlastIndexOf()で判定します。後ろに同じ値が存在する場合は現在の要素を削除し、存在しない場合のみ次の要素へ進みます。その結果、各値のインスタンスが1つだけ残った配列が得られます。 サンプルコード { for(let i = 0; i < arr.le

はじめに JavaScriptでは、フラットなキーと値のペアで構成されたオブジェクトを、意味のあるまとまりごとのオブジェクト配列へ変換したいケースがよくあります。例えば「Person1_Age」「Person2_Height」のように、複数人分のデータが1つのオブジェクトに混在している場合、人物ごとにデータを分割して整理しておくと、後続の処理が格段に行いやすくなります。 問題の概要 次のような、複数人分の年齢・身長・体重のデータを持つオブジェクトを考えてみましょう。 const obj = {   Person1_Age: 22,   Person1_H

問題の概要 ストップウォッチの開始時刻（startTime）と停止時刻（stopTime）をペアで保持する、次のようなオブジェクトの配列が与えられたとします。 const arr = [     { startTime: 1234, stopTime: 2345 },     { startTime: 3452, stopTime: 9304 },     { startTime: 2345, stopTime: 7432 },     

JavaScriptでは、2つの配列を受け取り、1つ目の配列から2つ目の配列に含まれていない要素だけを抽出した新しい配列を返す関数が必要になる場面がよくあります。これはいわゆる「差集合」の計算であり、データの絞り込みや比較処理で非常に役立ちます。この処理を実現するには、Array.prototype.filter() メソッドを使って1つ目の配列を走査し、各要素が2つ目の配列に存在するかどうかを Array.prototype.includes() メソッド（または indexOf()）で判定するのが最もシンプルで読みやすいアプローチです。実装例実際のコードは以下のようになります。 {

本記事では、第一引数に数値の配列、第二引数に整数 n を受け取る JavaScript 関数の作成方法を解説します。この関数の目的は、配列をソートせずに、n 個以上の連続した数値(例： 4, 5, 6 のような差が 1 の連番)が配列内に存在するかどうかを判定することです。問題の概要たとえば、次のような入力が与えられたとします。const arr = [0, 4, 6, 5, 9, 8, 9, 12];const n = 3;この場合、配列には 4、5、6 という 3 つの連続する数値が存在するため、関数は true を返す必要があります。実装コード以下がそのコードです。const arr =

JavaScriptでAPIのレスポンスなどを扱っていると、ネスト（入れ子）されたJSONオブジェクトから特定のキーに対応する値を取り出したい場面がよくあります。この記事では、そのようなネストされたJSONから目的の値を取得する関数の実装方法を解説します。前提となるデータ構造まず、次のようなネストされたJSONオブジェクトを例として考えます。const obj = { prop: [ { key: FOO, value: Foo is wonderfull, foo is great }, { key: BAR, va

はじめに ログインシステムを構築する際、ユーザーを一意に識別するために固有のユーザーID（userID）を割り当てるのが一般的です。しかし、連番などの単純な数値IDは推測されやすいため、セキュリティ上の観点から何らかの形で難読化したいケースがあります。 そこで本記事では、数値とアルファベット文字列を相互に変換する、次の2つの関数を実装していきます。 encode() … 数値を26種類のアルファベットによる表記に変換する decode() … 変換された文字列を元の数値に復元する なお、実際のセキュリティ対策ではSHA-256のようなハッシュアルゴリズムが使われることが多いですが、これらは

はじめにJavaScriptでは、ユーザーごとに整理されたデータを、日付を基準とした構造へ組み替えたいケースがよくあります。本記事では、ユーザー名をキーとするオブジェクトを受け取り、同じ日付を持つエントリ同士をグループ化した新しいオブジェクトを生成する関数の実装方法を解説します。例として、次のようなユーザーデータを想定します。外側のキーはユーザー名、内側のキーは「年-月」形式の日付で、それぞれの値はその月の数値データです。const obj = { Mary: { 2016-1: 2, 2016-5: 1, 2016-3: 1 }

問題の概要 次のようなJSONオブジェクトがあると仮定しましょう。 const obj = { name: sam, age: 24, isMarried: false }; 一見すると普通のオブジェクトですが、よく見ると age プロパティ（本来はNumber型）と isMarried プロパティ（本来はBoolean型）の値が、誤って文字列（String型）になってしまっています。 APIレスポンスの処理やCSVデータの取り込みなどでは、このような型の不整合は頻繁に発生します。そこで本記事では、このようなオブジェクトを受け取り、文字列化された数値・真偽値を正しいデータ型へ自動的

ここでは、次のように文字列の配列とオブジェクトの配列が1つずつある状況を想定します。 const arr1 = [ 1956888670, 2109171907, 298845084 ]; const arr2 = [ { KEY: 1262875245, VALUE: Vijay Kumar Verma }, { KEY: 1956888670, VALUE: Sivakesava Nallam }, { KEY: 2109171907, VALUE: udm analyst }, { KEY: 298845084, VALUE: Mukesh Nagora