導入
データ中心の情報システムでは、表形式のデータを表示する一般的な方法です。データのソートは重要な機能です。ソートは、単一のフィールドでソートに分割し、複数のフィールドの異なるソート方向によってソートすることができます。単一フィールドのソートは非常に限られており、データの懸念の変更に対するユーザーのニーズを満たすことができません。マルチフィールドソートは、この欠陥をよりよく補うことができます。
マルチフィールドソート、実装方法は、バックエンドの実装と大規模なレベルからのフロントエンドの実装に分けることができます。
バックエンドソート
バックエンドの実装ソートは、データベースレベルまたはアプリケーションレベルで実装できます。
データベースレベルでマルチフィールドソーティングを実装するのは非常に簡単です。 SQLソートコマンド「Order by」を使用するだけです-Field1 ASC、Field2 DESC、Field3 ASCによる注文 - ....
アプリケーションレベルは、PHP、Java Web、ASP.NETなどのWebアプリケーションレイヤー（C/Sアーキテクチャはここでは説明されていません）を指します。アプリケーションレベルの実装は、PHP、Java、.NET（C＃/VB）などのバックエンドサービス言語を使用してデータをソートすることです。 C＃のLINQにはコレクションタイプに組み込み操作が組み込まれているため、Multi-Attribute Sortingをサポートしているため、asp.net C＃を採用すると、linqを使用することで簡単にこの目標を達成できます。他の言語に同様のサポートが組み込まれていない場合、ソートアルゴリズムに従って実装されます。これは一般的であり、プログラミング言語とは関係ありません。
フロントエンドのソート
JavaScriptでは、配列にはソートメソッド「ソート」があります。配列が単純な配列（配列要素はシンプルなタイプ（文字列、値、ブール値）である場合、この方法を使用してソート目的を簡単に達成できます。ただし、配列要素が名前/値ペアのオブジェクトなどの非シンプルタイプであり、指定された属性に従って異なるソート方向にソートする場合、「ソート」メソッドへの単純な呼び出しはこれを達成できません。
幸いなことに、「ソート」メソッドは、目的のソートメソッドを実装できるカスタムソートインターフェイスを留保します。
配列の「ソート」方法がどのように見えるか見てみましょう。
関数プロトタイプをソートします
//配列の要素を所定の位置に並べ替えて、この配列を返します。 //デフォルトでは、文字列のUnicodeコードポイントでソートします。 array.prototype.sort（[comparefunction]：number）; //番号：-1 | 0 | 1。//典型的な比較関数（ソートされた昇順）。 function comparefunction（item1、item2）{if（item1> item2）{return 1; //降順でソートされた場合、-1を返します。 } else if（item1 === item2）{return 0;} else {return -1; //降順でソートされた場合、1。}}を返します。注：CompareFunctionが指定されていない場合、要素は文字列の文字に変換され、Unicodeビット順序でソートされます。たとえば、「チェリー」は「バナナ」の前に配置されます。数字を並べ替えると、最初に文字列に変換されるため、9は80の前に表示され、「80」は「9」より先にあります。
•CompareFunction（A、B）が0未満の場合、AはBの前に配置されます。
•CompareFunction（a、b）が0に等しい場合、aおよびb
相対的な位置は変わらないままです。注：ECMaScript規格はこの動作を保証するものではなく、すべてのブラウザがそれを順守するわけではありません（たとえば、2003年のMozilla
2019年以前のバージョン）;
•CompareFunction（A、B）が0より大きい場合、BはAの前に配置されます。
•CompartFunction（A、B）は常に同じ比較結果を同じ入力に返す必要があります。そうしないと、ソートされた結果が不確かになります。
注：上記のルールで得られたソート結果は、昇順です。降順の結果を取得する場合は、比較結果が0より大きい場合、結果を0未満に返します。比較結果が0未満の場合、結果を0以上に返すことができます。
マルチアトリブソートを実装するために、重要なのは、関数の実装を比較することです。上記のルールによれば、異なる方向の複数の属性の順序付けが実装され、2つの比較項目間のサイズの関係はまだ返されます。
では、多くの属性オブジェクトのサイズ関係を決定する方法は？これは2つのステップで実行できます。
最初のステップは、並べ替え属性と方向に従って2つの並べ替え項目を比較することで得られた結果を記録することです。
var proporders = {"prop1"： "asc"、 "prop2"： "desc"、 "prop3"： "asc"}; function cmp（item1、item2、proporders）{var cps = []; //各ソート属性の比較結果を記録するために使用される-1 | 0 | 1。 var isasc = true; //方向を並べ替えます。 for（var p in proporders）{isasc = proporders [p] === "asc"; if（item1 [p]> item2 [p]）{cps.push（isasc？1：-1）; break; //ループから飛び出すことができます。ここでは、項目1が「item2より大きい」と既に知っているからです。 } else if（item1 [p] === item2 [p]）{cps.push（0）;} else {cps.push（isasc？-1：1）; break; //ループからジャンプすることができます。アイテム1 "'ite" item2よりも少ない。 }} /*...*/}2番目のステップは、各ソート属性の比較結果に基づいて、2つの比較用語の最終サイズの関係を包括的に判断することです。
/ * ... */for（var j = 0; j <cps.length; j ++）{if（cps [j] === 1 || cps [j] === -1）{return cps [j];}} return 0;上記のアイデアを使用すると、比較関数全体を簡単に実装できます。比較関数の完全なJavaScriptコードは次のとおりです。
比較関数
関数SORTBYPROPS（item1、item2）{"sprict"; var props = []; for（var _i = 2; _i <arguments.length; _i ++）{props [_i -2] = arguments [_i];} var cps = []; //ソート属性の比較の結果を保存します。 //ソート属性が指定されていない場合は、すべての属性の昇順で並べ替えます。 var asc = true; if（props.length <1）{for（var p in item1）{if（item1 [p]> item2 [p]）{cps.push（1）; break; //より大きい場合、ループが発生します。 } else if（item1 [p] === item2 [p]）{cps.push（0）;} else {cps.push（-1）; break; //それが少ない場合、ループは飛び出します。 }}} else {for（var i = 0; i <props.length; i ++）{var prop = props [i]; for（var o in prop）{asc = prop [o] === "asc"; if（item1 [o]> item2 [o]）{cps.push（asc？1：-1）; break; //より大きい場合、ループが発生します。 } else if（item1 [o] === item2 [o]）{cps.push（0）;} else {cps.push（asc？-1：1）; break; //それが少ない場合、ループは飛び出します。 }}}} for（var j = 0; j <cps.length; j ++）{if（cps [j] === 1 || cps [j] === -1）{return cps [j];}} return 0; }テストケース
// --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- Proporders）;}）; console.log（items）;} function testasc（）{{"name"： "asc"、 "value"： "asc"}）;} function testdesc（）{{"name"： "desc"、 "value"： "desc"}）; "desc"}）;} function testdescasc（）{test（{"name"： "desc"、 "value"： "asc"}）;} typescript code/****並べ替え方向。 */type direct = "asc" | "desc";/****ソート属性。 ** ** @interface ipropertyorder*/interface ipropertyorder {[name：string]：direct;}/**** simple name/valueオブジェクト。 ** ** @interface isimpleObject*/interface isimpleObject {[name：string]：string |番号| boolean;}/****指定された属性と並べ替え方向（ソート属性と並べ替え方向に従って、2つの項目を順番に比較し、ソート位置を表す値を返す）に従って、シンプル名/値オブジェクトをソートします。 ** ** @template tシンプルな名前/値オブジェクト。 ** @param {t} item1ソート比較項目1。 ** @returnsアイテム1がアイテム2より大きい場合は、アイテム1がアイテム2に等しい場合は1を返します。 */function sortbyprops <t extends isimpleobject>（item1：t、item2：t、... props：ipropertyorder []）{"sprict"; var cps：array <number> = []; //ソート属性の比較の結果を保存します。 //ソート属性が指定されていない場合は、すべての属性の昇順で並べ替えます。 var asc = true; if（props.length <1）{for（var p in item1）{if（item1 [p]> item2 [p]）{cps.push（1）; break; //より大きい場合、ループが発生します。 } else if（item1 [p] === item2 [p]）{cps.push（0）;} else {cps.push（-1）; break; //それが少ない場合、ループは飛び出します。 }}} else {//指定された属性と持ち上げ方向によって並べ替えます。 for（var i = 0; i <props.length; i ++）{var prop = props [i]; for（var o in prop）{asc = prop [o] === "asc"; if（item1 [o]> item2 [o]）{cps.push（asc？1：-1）; break; //より大きい場合、ループが発生します。 } else if（item1 [o] === item2 [o]）{cps.push（0）;} else {cps.push（asc？-1：1）; break; //それが少ない場合、ループは飛び出します。 }}}} for（var j = 0; j <cps.length; j ++）{if（cps [j] === 1 || cps [j] === -1）{return cps [j];}} return 0; }シナリオと制限を使用します
JavaScriptを使用してフロントエンドにマルチアトリブソートを実装すると、サーバー側への要求が低下し、サーバー側のコンピューティング圧力が低下しますが、ローカルデータのみをソートする必要がある状況にのみ適しています。データセット全体を複数の属性でソートする必要がある場合、最終的にサーバー側のデータベースレベルで実行されます。
上記は、JavaScriptオブジェクトアレイが指定された属性と、編集者が紹介した並べ替え方向によってどのようにソートされるかについての完全な説明です。彼らがあなたに役立つことを願っています。ご質問がある場合は、メッセージを残してください。編集者は時間内に返信します。 wulin.comのウェブサイトへのご支援ありがとうございます！