JSでオブジェクトプロパティによるjsonオブジェクト配列のソートを実装する手順の詳細な説明-jsチュートリアル-php.cn

JSでオブジェクトプロパティによるjsonオブジェクト配列のソートを実装する手順の詳細な説明

php中世界最好的语言

リリース： 2018-05-23 10:06:56

オリジナル

2871 人が閲覧しました

今回は、JS がオブジェクトプロパティによる json オブジェクト配列の並べ替えを実装するための手順について詳しく説明します。見てみましょう。実際の作業では、バックグラウンドで返された配列に json データが i 個あり、json 内の特定の項目に従って配列を並べ替える必要がある、というような問題がよく発生します。

たとえば、返されるデータ構造は次のようになります:

{
  result:[
   {id:1,name:'中国银行'},
   {id:3,name:'北京银行'},
   {id:2,name:'河北银行'},
   {id:10,name:'保定银行'},
   {id:7,name:'涞水银行'}
  ]
}

ログイン後にコピー

次に、ビジネスニーズに応じて ID のサイズに従って並べ替え、ID の小さい JSON の順序で配列の順序を並べ替える必要があります。 IDが大きいjson

jsに追加並べ替え方法:

こちら

JavaScriptを使用

sort()メソッド、最初にsort方法を説明します構文: arrayObject.sort(sortby)<code>sort() 方法，首先解释下这个sort的方法

语法：arrayObject.sort(sortby)

sortby：可选，规定排序顺序。必须是函数。

如果调用该方法时没有使用参数，将按字母顺序对数组中的元素进行排序，说得更精确点，是按照字符编码的顺序进行排序。要实现这一点，首先应把数组的元素都转换成字符串（如有必要），以便进行比较。

如果想按照其他标准进行排序，就需要提供比较函数，该函数要比较两个值，然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b，其返回值如下：

若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。
若 a 等于 b，则返回 0。
若 a 大于 b，则返回一个大于 0 的值。

下面开始使用sort(sortby)

sortby: オプションで、並べ替え順序を指定します。関数である必要があります。

このメソッドがパラメータなしで呼び出された場合、配列内の要素はアルファベット順、より正確には文字エンコード順に並べ替えられます。これを実現するには、まず配列の要素を比較のために文字列

(必要に応じて) に変換します。

他の基準で並べ替えたい場合は、2 つの値を比較し、2 つの値の相対的な順序を示す数値を返す比較関数を提供する必要があります。比較関数には 2 つのパラメーター a と b が必要で、その戻り値は次のとおりです:

a が b より小さい場合、a はソートされた配列内で b より前に表示され、0 より小さい値を返します。

a が b に等しい場合、0 を返します。

a が b より大きい場合、0 より大きい値を返します。

sort(sortby) を使用してこの並べ替えを実行し、コンソールに出力してみましょう:

function sortId(a,b){
  return a.id-b.id
}
result.sort(sortId);
console.log(result);

ログイン後にコピー

完全なテストサンプルコード:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>www.jb51.net json数组排序</title>
</head>
<body>
<script>
var result = [
   {id:1,name:'中国银行'},
   {id:3,name:'北京银行'},
   {id:2,name:'河北银行'},
   {id:10,name:'保定银行'},
   {id:7,name:'涞水银行'}
  ]
function sortId(a,b){
  return a.id-b.id
}
result.sort(sortId);
console.log(result);
</script>
</body>
</html>

ログイン後にコピー

次に、コンソールを確認して、並べ替えが成功したことを確認してください:

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

🎜推奨読書: 🎜🎜🎜 vue コンポーネントを npm に公開する手順の分析🎜🎜🎜🎜🎜 Vue マルチレベルコンポーネントのprovide/injectの使用方法の詳細な説明🎜🎜🎜

以上がJSでオブジェクトプロパティによるjsonオブジェクト配列のソートを実装する手順の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。