JavaScript

 Computer >> コンピューター >  >> プログラミング >> JavaScript
  1. JavaScriptで順序番号を持つ値から正しくソートされた配列を作成する方法

    画像のパスと表示順序を示す番号がカンマで連結された文字列の配列を扱う場面は、Web開発ではよくあります。例えば、次のようなデータを想定してみましょう。 const images = [ photo1.jpg,0, photo2.jpg,2, photo3.jpg,1 ]; 各要素は「ファイルパス, 順序番号」の形式になっています。この場合、順序番号に従って並べ替えると、正しい順序は photo1 → photo3 → photo2 となります。 そこで必要な処理は、この文字列の配列を順序番号に基づいてソートし、最終的にはパスだけを抜き出した配列に変換することです。つまり

  2. JavaScriptで数値が2の累乗かどうかを判定する方法

    2の累乗判定関数とは正の整数を受け取り、その数が2の累乗であるかどうかに応じて真偽値(boolean)を返す関数、例えば isPowerOfTwo() を作成する必要があります。具体的には、次のような動作を想定します。console.log(isPowerOfTwo(3)); //false console.log(isPowerOfTwo(32)); //true console.log(isPowerOfTwo(2048)); //true console.log(isPowerOfTwo(256)); //true console.log(isPowerOfTwo(22)); //fal

  3. 【JavaScript】配列の空きインデックス(ホール)に値を挿入するpushAtEmpty()の実装方法

    配列の中の空きインデックスに値を挿入するには JavaScriptでは、次のように配列の中に「ホール」と呼ばれる空の要素(undefined)が含まれることがあります。 const arr = [43,534534,645,64,,645,64,,645,,645,,65,,645,,64]; 本記事では、指定した値を配列内の最初に見つかった空きインデックスに挿入する pushAtEmpty() メソッドを実装していきます。もし空きスペースがひとつも存在しない場合は、通常の push() と同じく配列の末尾へ値を追加する仕様とします。 実装コード まずはコード全体を見てみましょう。forルー

  4. JavaScriptで複数のブール値配列をOR演算子(||)でマージする方法

    問題の概要以下のような、ブール値(true / false)からなる2次元配列があったとします。const arr = [[true,false,false],[false,false,false],[false,false,true]];この配列に含まれる各サブ配列の対応する要素同士を、OR演算子(||)で結合して、1次元の配列にマージする関数を作成します。イメージとしては、各サブ配列の同じインデックス位置にある要素を縦方向に見ていき、「1つでも true があれば true」「すべて false なら false」となる配列を返す処理です。実装方法:Array.prototype.redu

  5. JavaScriptで1次元配列を2次元配列に分割する方法を解説

    JavaScriptでは、1次元配列を指定した行数のサブ配列に分割し、2次元配列として扱いたい場面があります。本記事では、第1引数に1次元配列、第2引数に分割したい行数nを受け取り、親配列の中にn個のサブ配列を作成して要素を振り分ける関数の実装方法を解説します。分割時のルール要素数が行数で割り切れない場合には注意が必要です。例えば、配列に9個の要素が含まれており、4つのサブ配列を作成したいとします。1サブ配列あたり2要素ずつ割り当てると5つのサブ配列が必要になり、3要素ずつ割り当てると3つのサブ配列で収まります。このようなケースでは、「最後のサブ配列を除き、各サブ配列にできるだけ均等な数の要素

  6. 【JavaScript】配列内で最初に重複する要素のインデックスを返す方法

    問題概要配列の中で、少なくとも2回以上出現する要素のうち、最初に現れたもののインデックスを返す関数を作成します。すべての要素が1回しか出現しない場合は、-1 を返します。この問題の条件は、定数空間(余分なメモリを追加で使用しないこと)で実装する必要があるという点です。つまり、Set や Map のような追加データ構造を使わずに解く必要があります。解決アプローチこの問題は、for ループで配列を先頭から順に走査し、Array.prototype.lastIndexOf() メソッドで重複をチェックすることで解決できます。lastIndexOf() は指定した要素が配列内で最後に現れるインデックス

  7. 【JavaScript】別の配列の内容に基づいて配列を並べ替える方法

    はじめにJavaScript開発では、ある配列の内容を基準にして別の配列を並べ替えたいケースがあります。例えば、「特定の要素を配列の先頭に移動させ、それ以外の要素は元の順序のまま維持したい」という要件はよく見られます。この記事では、基準となる sortOrder 配列に含まれる要素を元の配列の先頭に配置し、残りの要素は元の順序を保つソート関数の実装方法を解説します。問題の例次のように、元の配列と並べ替えの基準となる配列が与えられているとします。const originalArray = [Apple, Cat, Fan, Goat, Van, Zebra]; const sortOrder =

  8. JavaScriptで配列のキーに基づいてオブジェクトをフィルタリングする方法

    JavaScriptでは、オブジェクトから特定のキーを持つプロパティだけを抽出したい場面がよくあります。今回は、指定した配列の要素と一致するキーのみを残し、それ以外のプロパティを取り除く方法を解説します。 前提となるデータ まず、次のような配列とオブジェクトがあったとします。 const arr = [a, d, f]; const obj = { a: 5, b: 8, c: 4, d: 1, e: 9, f: 2, g: 7 }; 求められているのは、このオブジェクトと配列を引数として受け取り、配列に含まれていないキーのプロパテ

  9. JavaScriptで末尾の要素から逆算して配列Aから配列Bを求める正しいアルゴリズム

    次のようなバイナリ配列(配列A)について考えてみましょう。const arr = [1,0,1,1,1,1,0,1,1];この配列をsumRight()という関数に渡すと、次のような出力配列(配列B)が得られます。const output = [1,0,4,3,2,1,0,2,1];関数の仕組み配列arrの各要素は「0」または「1」のいずれかです。この関数は、配列arrの最後の要素から先頭に向かって後方へカウントしていきます。連続して「1」が現れるたびに出力側の値が増加し、1つ目の連続する「1」なら出力は「1」、2つ目なら「2」、3つ目なら「3」となります。一方、元の配列の要素が「0」だった場

  10. 配列内に同一の要素が3つ連続しているかどうかをJavaScriptで判定する方法

    本記事では、配列を引数として受け取り、配列内のどこかに同じ値を持つ3つの連続した要素が存在する場合には true を、存在しない場合には false を返すJavaScript関数 checkThree() を作成します。 実装コード 以下の例では、直前の要素とその連続回数を記録しながら配列を先頭から順に走査し、同じ値が3回連続した時点で true を返しています。 const arr = [g, z, z, v, b, b, b]; const checkThree = arr => { // 直前の要素と連続回数を保持するオブジェクト const prev = {

  11. JavaScriptで配列に値を挿入すべき最小のインデックスを求める方法(昇順・降順ソート対応)

    本記事では、配列(第1引数)を昇順または降順でソートした状態を想定し、指定した値(第2引数)を挿入すべき最小のインデックスを返す関数を作成します。戻り値は数値である必要があります。動作イメージ例として、getIndexToInsert() という関数を考えてみましょう。getIndexToInsert([1,2,3,4], 1.5, asc) は 1 を返します。1.5 は 1(インデックス0)より大きく、2(インデックス1)より小さいためです。同様に、次の例も見てみましょう。getIndexToInsert([20,3,5], 19, asc) は 2 を返します。配列を昇順にソートすると

  12. JavaScriptのsplice()で配列をその場で編集する:重複要素をn回以下に制限する方法

    配列 arr と数値 n を引数に受け取り、各要素が n 回を超えて繰り返されないよう調整した配列を返す関数を作成してみましょう。ポイントは、残したい要素のインデックス(並び順)を崩さないことです。ここでは、JavaScript の splice() メソッドを使って配列をその場で直接書き換える方法を解説します。 アプローチ まず、各要素の出現回数をハッシュマップ(プレーンなオブジェクト)で記録しながら、配列を先頭から順に走査します。走査中に、ある要素の出現回数が上限 n に達しているにもかかわらず再び現れた場合は、その場で splice() を呼び出して該当要素を削除します。これにより、

  13. JavaScriptで配列を同じ値ごとにグループ化してカウントする方法

    はじめに文字列や数値のリテラルを含む配列の中に、重複した値がいくつか存在するケースを考えてみましょう。const array = [day, night, afternoon, night, noon, night, noon, day, afternoon, day, night];ここで必要なのは、このような配列を受け取り、重複している要素をサブ配列の最初の要素としてグループ化し、元の配列における出現回数を2番目の要素として格納した新しい配列を返す関数 groupSimilar() を作成することです。上記の例の場合、期待される出力は以下のようになります。[ [ day, 3 ],

  14. JavaScriptで文字列からオブジェクトを生成する方法

    文字列からオブジェクトを生成するとはJavaScriptでは、文字列を引数として受け取り、その文字列に含まれるユニークな文字(重複しない文字)をキーとしたオブジェクトを生成する関数を作成できます。各キーに対応する値は、初期値として 0 を設定します。例えば、次のような入力があった場合を見てみましょう。// 入力文字列: const str = hello world!; // 期待される出力: const obj = {h: 0, e: 0, l: 0, o: 0, : 0, w: 0, r: 0, d: 0, !: 0};ポイントは、同じ文字が複数回登場しても、キーとしては1つだけ登録され

  15. JavaScriptでvalueとgapの2つのプロパティをもとに配列内の値をグループ化する方法

    グループ化の対象となるデータまず、次のような value(値)と gap(間隔)という2つのプロパティを持つオブジェクトの配列を用意しました。const arr = [    { value: 12, gap: 1 },    { value: 13, gap: 1 },    { value: 14, gap: 1 },    { value: 15, gap: 1 },    { value: 19, gap: 2 },    { value: 21, gap: 1 },

  16. JavaScriptで指定した数より大きい・小さい配列要素の個数を数える方法

    問題の概要次のような数値の配列があるとします。const array = [3.1, 1, 2.2, 5.1, 6, 7.3, 2.1, 9];ここで求めたいのは、指定した基準値よりも「小さい要素」と「大きい要素」がそれぞれ何個ずつ含まれているかを数える関数です。具体例たとえば基準値が 5.25 の場合、それより小さい要素は次の5つです。(3.1, 1, 2.2, 5.1, 2.1)逆に、基準値より大きい要素は次の3つになります。(6, 7.3, 9)注意: 要素の値が基準値とちょうど等しい場合は、「大きい側(以上)」としてカウントするルールとします。実装コードそれでは、実際に関数を実装してみ

  17. JavaScriptで配列を最大・最小交互に並べ替える方法

    はじめに本記事では、数値の配列を受け取り、要素を「最大値、最小値、2番目に大きい値、2番目に小さい値…」という順序で並べ替える関数 minMax() をJavaScriptで実装する方法を解説します。要件の整理まず、期待する動作を具体例で確認しましょう。// 入力配列:const input = [1, 2, 3, 4, 5, 6, 7];// 期待される出力:const output = [7, 1, 6, 2, 5, 3, 4];最大値の7が先頭に来て、その後は最小値の1、次に大きい6、次に小さい2というように、大きい値と小さい値が交互に配置されます。実装コードそれでは、この関数の完全なコ

  18. JavaScriptでネストされたオブジェクトの全プロパティ値が同一かどうかを再帰的に判定する方法

    問題の概要 ネストされた(入れ子構造の)オブジェクトを受け取り、すべてのキーの値が同一であるかどうかに応じて真偽値(boolean)を返す関数――たとえば isSame()――を作成することを考えてみましょう。 ここでいう「すべてのキー」とは、末端のキーのことを指します。あるキーの値としてさらにオブジェクトがネストされている場合は、その奥まで辿っていき、最終的な値をチェックする必要があります。 例として、次のようなオブジェクトを見てみます。 const obj = {     a: 1,     b: 1, &nb

  19. JavaScriptで配列の2要素間をn個の等間隔に分割する関数の実装方法

    はじめに本記事では、parseEqualInterval() という関数を実装します。この関数は、厳密に2つの要素からなる数値配列を第1引数に、数値 n を第2引数として受け取り、元の配列の2つの要素の間に n-1 個の等間隔な値を挿入することで、配列全体を n 個の等しい区間に分割します。例えば、以下のような動作になります。// 入力配列 const arr = [12, 48]; // 区間数が4の場合の出力 const output = [12, 21, 30, 39, 48];このように、12と48の間に3つの値(21、30、39)が挿入され、配列が4つの等間隔に分割されます。それでは

  20. JavaScriptでネストされたオブジェクトを再帰的にフラット化する方法

    JavaScriptでは、入れ子になった(ネストされた)オブジェクトを、ドット区切りのキーを持つフラットなオブジェクトへ変換したい場面があります。本記事では、再帰処理を使ってこの変換を実現する関数の作り方を解説します。やりたいことたとえば、次のような入力オブジェクトがあったとします。const input = { a: 0, b: {x: {y: 1, z: 2}}, c: 3 };このオブジェクトに対して関数を実行すると、出力は次のようになることが期待されます。const output = { a: 0, b.x.y: 1, b.x.z: 2,

Total 5937 -コンピューター  FirstPage PreviousPage NextPage LastPage CurrentPage:116/297  20-コンピューター/Page Goto:1 110 111 112 113 114 115 116 117 118 119 120 121 122