質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

3回答

7495閲覧

JavaScript の sort メソッドについて

退会済みユーザー

退会済みユーザー

総合スコア0

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

3グッド

3クリップ

投稿2017/09/25 09:06

編集2017/09/25 09:09

現在、JavaScript本格入門という書籍を読みながら勉強しています。
sort メソッドについて教えてください。
書籍には sort メソッドの説明している箇所に下記のコードがあります。

javascript

1var ary = [5, 25, 10]; 2 3// ① 結果:[10, 25, 5](文字列としてソート) 4console.log(ary.sort()); 5 6// ② 結果:[5, 10, 25](数値としてソート) 7console.log(ary.sort(function(x, y) { 8 return x - y; 9}));

書籍には下記のように説明があります。

sortメソッドは、デフォルトで配列を文字列として辞書順にソートします。このルールを変更するには、引数として、以下のような関数を定義します。

・引数は2つ(比較する配列要素)
・第1引数が第2引数より小さい場合は負数、大きい場合は正数を返す

①に関しては引数を省略しているので、1から順番に並び替えが行われたのかと思います。

②の記述について理解できません。

記述例は、sortメソッドの第一引数に無名関数を記述して、無名関数の仮引数に xy と記述しているかと思います。

第1引数が第2引数より小さい場合は負数、大きい場合は正数を返す

上記の説明の箇所があてはまるのかと思いますが、どのような意味かわかりません。
仮引数に入る xy の値を比較しているのでしょうか?
xy にはどの値がどのような順番で入るのでしょうか?
負数、正数を返すとありますが、これもわかりません。
仮に 525 の値を比較した場合でも、負数はどこにもないかと思います。
負数、正数を返すとはどのような意味なのでしょうか?

もう一つありまして、関数内で記述している return x - y についてもどのような意味なのかわかりません。
戻り値を返しているということはわかりますが、x - y とするだけでなぜ数値としてソートされるのでしょうか?

digitalhimiko, ina-taka, exdesign👍を押しています

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答3

0

ベストアンサー

そこまでわかっているのなら自力で解決できるとおもいますよ。
試しにconsole.logを以下のように埋め込んでみて観測してみたらどうでしょうか?

var ary = [5, 25, 10]; // ② 結果:[5, 10, 25](数値としてソート) console.log(ary.sort(function(x, y) { console.log(`x= ${x}, y=${y} result = ${x-y}`); return x - y; }));

投稿2017/09/25 09:12

m0a

総合スコア708

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2017/09/25 10:12 編集

あっ、2つの要素を比較して正か負かで並び替えを行っているということですかね? ```javascript var ary = [25, 15, 5]; console.log(ary.sort(function(x, y) { console.log(ary); console.log(`x= ${x}, y=${y} result = ${x-y}`); return x - y; })); ``` console.log(ary) を追加してみて、Chromeのデベロッパーツールで確認すると下記のようになりました。 ```javascript (3) [25, 15, 5] x= 25, y=15 result = 10 (3) [15, 25, 5] x= 25, y=5 result = 20 (3) [15, 25, 25] x= 15, y=5 result = 10 (3) [5, 15, 25] ``` 2つの値を比較して正負によって要素を移動しているのかと思います。 並び替えをしているのはわかりますが、途中で [15, 25, 25] になるのはなぜでしょうか? 5 という要素はどこにいったのでしょうか? あと、2つの値を比較して並び替えをしているので、これがバブルソートという手法ですか?
guest

0

どのようなソートアルゴリズムを使っているかは、ブラウザによりますが仮にchromeだとしたら
ソートの該当コードは以下となります。

https://github.com/v8/v8/blob/master/src/js/array.js#L766

function QuickSort(a, from, to) { var third_index = 0; while (true) { // Insertion sort is faster for short arrays. if (to - from <= 10) { InsertionSort(a, from, to); return; } if (to - from > 1000) { third_index = GetThirdIndex(a, from, to); } else { third_index = from + ((to - from) >> 1); } // Find a pivot as the median of first, last and middle element. var v0 = a[from]; var v1 = a[to - 1]; var v2 = a[third_index]; var c01 = comparefn(v0, v1); if (c01 > 0) { // v1 < v0, so swap them. var tmp = v0; v0 = v1; v1 = tmp; } // v0 <= v1. var c02 = comparefn(v0, v2); if (c02 >= 0) { // v2 <= v0 <= v1. var tmp = v0; v0 = v2;

ただこのコードを見てもらうとわかりますがconsole.logを埋め込んだ関数は上記コードの場合
comparefnになります。
comparefnの中でarrayの内容をログ出力すると、ソート処理の途中でログ出力することになるため

[15, 25, 25]のような中途半端な出力になるわけです。
ちなみに要素数が10以下だと挿入ソート。10より大きければクイックソートを使っているみたいですね。
(chrome、V8エンジンの場合)

大抵の言語では、2つの要素を比較する関数を用意すると
上手くソートしてくれるAPIが提供されています。ですので正直ソートアルゴリズムが何かを気にしなくても何の問題もなく使えます。

投稿2017/09/25 13:47

編集2017/09/25 13:49
m0a

総合スコア708

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2017/09/25 13:55

おお!わざわざ、該当コードまでありがとうございます。 なるほど、ソートアルゴリズムは、描画しているブラウザによるんですね。 お陰様で理解できました。 ありがとうございますm(__)m
guest

0

参考情報

  • 意外と簡単にできる、JavaScriptでオブジェクトの配列を並べ替える方法

https://www.webprofessional.jp/sort-an-array-of-objects-in-javascript/

  • Array.prototype.sort()

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/sort

投稿2017/09/25 19:30

katoy

総合スコア22324

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2017/09/26 00:50

参考サイトありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問