JavaScriptによるJSON変数の並び替え(ランキング順)

Question

JSON変数をJavaScriptで扱うのが初めてで、どうしても分からないことがあったので質問させていただきました。

const userData = {
  "a": 23,
  "b": 31,
  "c": 4
}
var sortData;
// (並び替え処理)
console.log(sortData)

上のようなのスクリプトがあったとして、

1位 bさん 31p
2位 aさん 23p
3位 cさん 4p

のような結果を求めたいです。
// (並び替え処理) にはどういった処理を書けばいいのでしょうか？よろしくお願いします。

Answer 1

こんにちは

一例としまして、以下のような感じかなと思います。

const userData = {
  "a": 23,
  "b": 31,
  "c": 4
};

const sortData = Object.entries(userData)
                       .sort(([k1, v1],[k2, v2]) => v2 - v1)
                       .map(([k,v], i) => `${i+1}位 ${k}さん ${v}p`);

sortData.forEach(str => { console.log(str); });

• **動作確認用CodePen: ** https://codepen.io/jun68ykt/pen/eYYBqEv?editors=0012

以下、上記で使っているメソッドの説明です。

• MDN: Object.entries
• MDN: Array.prototype.sort()
• MDN: Array.prototype.map()
• MDN: Array.prototype.forEach()

以上、参考になれば幸いです。

Comments

[退会済みユーザー]

こちらも詳しい説明ありがとうございました。
私はまだ未熟者ですが、何とか学んでいけたらいいなと思います(^^;)

[jun68ykt]

どういたしまして。
今回使ったメソッドを、いっぺんに覚えようとすると大変なので、頭に入りやすいものから一個ずつ確実にモノにしていかれるとよいかと思います。

Answer 2

const userData = {
  "a": 23,
  "b": 31,
  "c": 4
}
//var res=Object.entries(userData).sort((x,y)=>-x[1]+y[1]).map((x,y)=>[y+1].concat(x));
var res=Object.entries(userData)
         .sort((x,y)=>-x[1]+y[1])
         .map((x,y)=>[(y+1).toString()+"位",x[0]+"さん",x[1].toString()+"p"]);
console.log(res);

一部調整しました。
上記ソースを3段階に分割すると以下

解説

var res=Object.entries(userData); // [["a",23],["b",31],["c",4]]を抽出
res=res.sort((x,y)=>-x[1]+y[1]); // ソートして[["b",31],["a",23],["c",4]]にする
res=res.map((x,y)=>[(y+1).toString()+"位",x[0]+"さん",x[1].toString()+"p"]);//各要素に単位や敬称をつける

rankをオブジェクトにする

const userData = {
  "a": 23,
  "b": 31,
  "c": 4
}
const userRank = Object
                  .entries(userData)
                  .sort((x,y)=>-x[1]+y[1])
                  .map((x,y)=>[x[0],y+1])
                  .reduce((x,y)=>(x[y[0]]=y[1],x),{});
console.log(userRank);

同順あり

const userData = {
  "a": 23,
  "b": 31,
  "c": 4,
  "d": 23,
}
const userRank = Object.entries(userData)
                  .map((x,y)=>[x[0],Object.entries(userData).filter(z=>z[1]>x[1]).length+1])
                  .reduce((x,y)=>(x[y[0]]=y[1],x),{});
console.log(userRank);

配列から

やってることは対して変わりません
（一応同順あり版で）

const userData = {
"a": [0, 0, 0, 23, 0],
"b": [0, 0, 0, 31, 0],
"c": [0, 0, 0, 4, 0],
"d": [0, 0, 0, 23, 0],
}
const userRank = Object.entries(userData)
                  .map((x,y)=>[x[0],Object.entries(userData).filter(z=>z[1][3]>x[1][3]).length+1])
                  .reduce((x,y)=>(x[y[0]]=y[1],x),{});
console.log(userRank);

Comments

[退会済みユーザー]

ありがとうございます。もしよろしければ、そのスクリプトの意味を教えてくれますか？

[yambejp]

解説つけておきました

[退会済みユーザー]

すいません。そのresをJSONとして結果を出したいのですがどうすればいいでしょうか？
何度も何度も質問して申し訳ございません。

[yambejp]

> resをJSONとして結果を出したい

具体的にどういったデータになっていればいいのでしょうか？
console.log(JSON.stringify(res));
ではダメですか？

[退会済みユーザー]

{
"a": 2,
"b": 1,
"c": 3
}
↑のような感じです。ランキングの順位を求めたいです。すいません(^^;)

[yambejp]

ランクをオブジェクトで返すsampleを上げておきました

[退会済みユーザー]

>>yambejp様
本当にありがとうございました。わがままな私を聞いてくれて...(^^;)
実行結果も正常でした。本当に本当にありがとうございました。

[yambejp]

ちなみに同順位とか考慮していませんので必要があればまた
別途質問ください
（1位、2位、2位、4位みたいなやつ）

[退会済みユーザー]

あ、じゃ可能であればできますかね？すいません(^^;)

[yambejp]

回答忘れてました。
同順あり追記しときました

[退会済みユーザー]

本当にありがとうございます(^^;)

[退会済みユーザー]

すいません。友人がゲームデータの追加提案をして、JSONのランキングおよびその他データを配列変数で扱うことになってしまいました(^^;)
const userData = {
"a": [0, 0, 0, 23, 0],
"b": [0, 0, 0, 31, 0],
"c": [0, 0, 0, 4, 0],
"d": [0, 0, 0, 22, 0],
}
他のデータの詳細はプログラムとして分かりずらいので 0 とします。
この時、4番目([3])を基準にランキングをしたいのでyambejp様のスクリプトを一部編集(ただ単に[3]を追加しただけ)しましたが、私の理解度の無さから希望通りの結果には返りませんでした。
どうすればよろしいでしょうか。いい加減自分の力で解決したいので、本当に本当にこの質問で最後にします。申し訳ございませんm(__)m

[yambejp]

「配列から」を追記しておきました

[退会済みユーザー]

本当にありがとうございました！