-
JavaScriptで垂直区間の集合から指定サイズ以上の独立した交差部分を検出する方法
問題の概要 ここでは、y1 と y2 の2つの座標で定義される「垂直方向の区間」の集合を扱います。y1 は各区間の始点、y2 は終点を表します。 座標系の原点は画面の左上にあるため、常に y2 > y1 という関係が成り立ちます。 具体的なデータ例は以下の通りです。 const regions = [ [10, 100], [50, 120], [60, 180], [140, 220] ]; やりたいこと このような区間の配列を第1引数として受け取り、数値を第2引数として受け取る JavaScript の関数を作成します。目的は、第2引数で指定したサイズ
-
JavaScriptで整数の配列を正しくソートする方法
問題の概要 数値の配列を受け取り、その配列を昇順または降順のいずれかで「その場で(in place)」ソートするJavaScript関数を作成する必要があります。 ここで注意すべき点は、JavaScriptのArray.prototype.sort()メソッドを引数なしで呼び出すと、要素が文字列として比較されるという仕様があることです。そのため、数値の配列に対して単純にsort()を使うと、期待した大小関係ではなく辞書順(文字コード順)に並べ替えられてしまい、誤った結果になります。 これを回避するには、sort()メソッドに比較関数を渡す必要があります。 比較関数の仕組み 比較関数は2つの引
-
JavaScriptでネストされたオブジェクトのキーが存在するかどうかを確認する方法
JavaScriptでは、深くネストされたオブジェクトのプロパティにアクセスする際、途中の階層が存在するかどうかを事前に確認したいケースがよくあります。この記事では、任意の数のキーを受け取り、そのネストされたパスがオブジェクト内に存在するかどうかを判定する関数の実装方法を解説します。前提となるオブジェクトの例まず、次のようなオブジェクトへの参照があるとします。let test = {};このオブジェクトには、後から次のようにネストされたオブジェクトが設定される可能性があります。test = {level1: {level2: {level3: level3}}};要件ここで求められるのは、第一
-
JavaScriptで配列要素の出現回数をカウントし、2次元配列として取得する方法
リテラル値(数値や文字列など)からなる配列を受け取り、それぞれの要素が出現する回数を数えて、その結果をもとに新しい2次元配列を作成するJavaScript関数が必要になる場面は少なくありません。 例えば、次のような入力配列が与えられたとします。 const arr = [5, 5, 5, 2, 2, 2, 2, 2, 9, 4]; この場合、期待される出力は以下のとおりです。各サブ配列は「要素の値」と「その出現回数」のペアを表しています。 const output = [ [5, 3], [2, 5], [9, 1], [4, 1] ]; コード例 この処理を実現するコードは以
-
ネストされた配列のデータをJavaScriptオブジェクトに変換する方法
課題 まず、次のように「配列の中に配列が入った」ネストされたデータ構造があると仮定しましょう。 const arr = [ [ [dog, Harry], [age, 2] ], [ [dog, Roger], [age, 5] ] ]; ここで求められているのは、このようなネストされた配列を受け取り、その内容をもとにオブジェクトの配列を作成するJavaScript関数を実装することです。 上記の配列に対して関数を実行した場合、期待される出力は以下のとおりです。 const output = [ { dog: Harry,
-
【JavaScript】フラットな配列から階層ツリー構造を構築する方法
JavaScriptで複雑なJSONファイルを処理し、階層構造(ツリー)を持つデータへ変換したい場面はよくあります。例えば、ツリー形式のUIを構築したり、カテゴリの親子関係を表現したりするケースです。本記事では、フラットなJSON配列を親子関係をもつツリー構造へ変換する方法を解説します。 元データの構造 今回扱うJSON配列の各要素は、次のプロパティを持っています。 id:ノードを一意に識別するID parentId:親ノードのID(ツリーのルートの場合は「0」) level:ツリー内における階層の深さ 入力データはすでに「整列済み」であるものとします。つまり、ある要素より上には必ずその親
-
JavaScriptで親子関係を持つ配列をレベル別にツリー構造へ変換する方法
親子関係を持つ配列をツリー構造へ変換する 同一の配列の中に1対多の親子関係を持つデータを扱う場面は少なくありません。たとえば組織図のようなデータでは、階層が「レベル(level)」によって定義され、各要素の親は必ず自分より1段上のレベルに存在し、parentIdプロパティで参照されます。 本記事では、このようなフラットな配列から多階層のツリー構造(ネストされた配列)を生成する方法を解説します。最上位レベルの要素がメイン(ルート)となり、その子要素はchildrenというサブ配列として格納されます。 入力データの例 入力配列が次のように与えられたとします。 const arr = [ {
-
JavaScriptでJSON配列を通常のJSONオブジェクトに変換する方法
はじめにAPIのレスポンスなどでは、「key」と「value」のペアを持つオブジェクトが配列として格納された、深くネストしたJSONデータによく遭遇します。例えば、次のような配列です。const arr = [{ "key": "name", "value": "john" }, { "key": "number", "value": "123
-
JavaScriptで配列をグループ化し、ユニークなユーザー数をカウントして新しい配列を作成する方法
JavaScriptでオブジェクトの配列を扱う際、特定のプロパティを基準にデータをグループ化し、それぞれのグループ内のユニークな要素をカウントしたい場面はよくあります。本記事では、そのような処理を実現する関数の実装方法を解説します。問題の概要まず、次のようなオブジェクトの配列があると仮定しましょう。const arr = [ { region: Africa, fruit: Orange, user: Gary }, { region: Africa, fruit: Apple, user: Steve }, { region: Europe, fruit: Orang
-
JavaScriptで配列内の重複要素を合計して新しい配列を作成する方法
今回は、数値の配列を受け取るJavaScript関数を作成します。この配列には、同じ値が繰り返し含まれている(重複している)場合があります。作成する関数の役割は、重複している要素をすべて合計し、その結果からなる新しい配列を返すことです。実装の考え方この問題は、次の2つのステップで解決できます。1. オブジェクト(マップ)を用意し、各要素が出現した回数を記録する2. 各要素について「値 × 出現回数」を計算し、新しい配列に格納するコード例実際のコードは以下のとおりです。const arr = [20, 20, 20, 10, 10, 5, 1]; const sumIdentical = (ar
-
JavaScriptで配列内の最長の文字列を検索する方法
JavaScriptでは、文字列の配列を受け取り、その中から最も長い文字列を検索して返す関数を作成することができます。この処理を実装する上で重要なのは、元の配列の中身を一切変更しないことです。本記事では、reduce()メソッドを活用して、シンプルかつ効率的に最長文字列を取得する方法を紹介します。実装コード以下のコードをご覧ください。const arr = [aaaa, aa, aa, aaaaa, acc, aaaaaaaa]; const findLargest = (arr = []) => { if(!arr?.length){ &
-
JavaScriptで数値を合計が一致する4つの乱数に分割する方法
要件JavaScriptで、第1引数に合計値となる数値、第2引数に各要素の上限となる最大値を受け取る関数を作成することを考えます。この関数は4つの乱数を生成し、その合計が第1引数で渡された数値とちょうど一致し、かつ4つのうちどの数値も第2引数で指定された最大値を超えないようにする必要があります。例たとえば、関数に渡す引数が次のような場合を想定してみましょう。const n = 10;const max = 4;このとき、出力としてconst output = [3, 2, 3, 2];は有効な組み合わせです。3 + 2 + 3 + 2 = 10 となり、各要素は最大値の4を超えていません。なお
-
【JavaScript】複数の配列からダッシュ区切りのデカルト積を生成する方法
はじめに JavaScriptでは、任意の個数の配列を受け取り、それぞれの配列から要素を1つずつ選んだすべての組み合わせ(デカルト積)を求めたいケースがあります。本記事では、組み合わせた要素をダッシュ(−)で連結した文字列の配列として返す関数の実装方法を解説します。 デカルト積とは デカルト積(直積)とは、複数の集合から要素を1つずつ取り出して作られる、すべての順序付き組み合わせのことです。例えば [a, b] と [1, 2] のデカルト積は、「a-1」「a-2」「b-1」「b-2」の4通りになります。配列が3つになれば、それぞれの要素数を掛けた数だけ組み合わせが生まれます。
-
【JavaScript】配列内に数値(整数)が含まれているかどうかを判定する方法
はじめに本記事では、配列の中に数値型(number)の要素が含まれているかどうかを判定するJavaScript関数の実装方法を解説します。今回求められている仕様は以下のとおりです。関数は要素の配列を受け取る配列内に number 型の要素が1つでも存在するかをチェックする存在すれば true、存在しなければ false を返す実装例const arr = ["123", "", "21345", "90"];const findInteger = (arr = []) => { cons
-
【JavaScript】ネストされた配列のキーと値のペアをオブジェクトの配列に変換する方法
JavaScriptでは、APIのレスポンスや設定ファイルなどで「キーと値のペアが配列として入れ子になったデータ」を目にすることがあります。この記事では、そのようなネストされた配列を、扱いやすいオブジェクトの配列へ変換する方法を解説します。 変換前のデータ構造 たとえば、次のような「配列の中に配列があり、さらにその中にも配列が存在する」データを想定します。 const arr = [ [ [firstName, Joe], [lastName, Blow], [age, 42], [role, clerk],
-
JavaScriptで複数のプロパティを基準にオブジェクトの配列をソートする方法
はじめに JavaScriptでは、配列のsort()メソッドに比較関数を渡すことで、複数の条件を組み合わせた柔軟な並べ替えが可能です。本記事では、dnf(完走なし)やisCut(カット)といったフラグを持つオブジェクトの配列を、優先順位に従ってソートする実践的なテクニックを紹介します。 サンプルデータ 次のような、id・score・isCut・dnfの4つのプロパティを持つオブジェクトの配列を用意します。 const arr = [ { id: 1, score: 1, isCut: false, dnf: false }, { id: 2, score: 2, isCut
-
JavaScriptで文字列内のアルファベットの数を数える方法
```html 今回は、文字列を受け取り、その中に含まれるアルファベット(大文字・小文字問わず)の数を数えるJavaScript関数を作成します。 例えば、入力文字列が次のような場合を考えてみましょう。 const str = this is a string!; この場合の出力は次のようになります。 13 スペースや記号(!)はアルファベットではないためカウント対象外となり、純粋な英字だけが数えられます。 実装コード const str = this is a string!; // 文字がアルファベットかどうかを判定する関数 const isAlpha = char =&g
-
JavaScriptで配列内の最頻値を求める方法|出現回数が同じ場合は先に現れた値を返す
この記事では、リテラル値の配列を受け取り、最も出現回数の多い値を返すJavaScript関数の作成方法を解説します。出現回数が同じ値が複数存在する場合は、その中で配列内に最初に現れた値を返すのがポイントです。 要件の確認 まず、次のような配列が与えられたケースを見てみましょう。 const arr = [25, 50, a, a, b, c] この場合、a は2回出現しており他の値より多いため、戻り値は a となります。 const arr = [75, 100, a, b, b, a] 一方こちらの例では、a と b の出現回数がどちらも2回で同数です。このような場合、配列内で先に登場してい
-
JavaScriptで配列内の部分文字列とスーパー文字列の組み合わせをすべて検索する方法
本記事では、文字列の配列を引数として受け取り、その配列内に存在するすべての「部分文字列」と「スーパー文字列(より長い側の文字列)」の組み合わせを検出し、該当する要素だけをまとめた配列を返すJavaScript関数の作成方法を解説します。問題の概要たとえば、次のような配列が与えられたとします。const arr = [abc, abcd, abcde, xyz];この場合、期待される出力は次のとおりです。const output = [abc, abcd, abcde];これは、「abc」と「abcd」がいずれも「abcde」の部分文字列となっているためです。一方、「xyz」は他のどの文字列とも
-
JavaScriptで部分文字列を抽出し、辞書式順序にソートした配列を返す方法
問題の概要今回は、2つの配列 arr1 と arr2 を引数として受け取るJavaScript関数を作成します。この関数の要件は以下の通りです。arr1 の文字列のうち、arr2 のいずれかの文字列に「部分文字列」として含まれているものだけを抽出する抽出した文字列を辞書式順序(レキシコグラフィカル順序)でソートするソート済みの新しい配列として返す実装コード実際のコードは次のように記述できます。const lexicographicalSort = (arr1 = [], arr2 = []) => { let i, j; &nb