ホームページ ウェブフロントエンド jsチュートリアル JavaScriptのsortメソッドを使って並べ替える方法

JavaScriptのsortメソッドを使って並べ替える方法

Jul 16, 2021 pm 05:07 PM
javascript 配列のソート

JavaScript では、sort メソッドを使用して、配列要素を特定の条件に従って並べ替えます。パラメーターを渡さずに sort() メソッドを呼び出した場合、配列内の要素はアルファベット順にソートされ、関数パラメーターが指定された場合、配列内の要素は関数によって指定された順序に従ってソートされます。

JavaScriptのsortメソッドを使って並べ替える方法

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

sort() メソッドは、特定の条件に従って配列要素を並べ替えることができます。 sort() メソッドが引数なしで呼び出された場合、配列内の要素はアルファベット順に並べ替えられます。

var a = ["a","e","d","b","c"];  //定义数组
a.sort();  //按字母顺序对元素进行排序
console.log(a);  //返回数组[a,b,c,d,e]
ログイン後にコピー

sort() メソッドを使用する場合は、次の問題に注意する必要があります。

1) いわゆるアルファベット順は、実際には文字コード表の文字の順序に従って配置されており、各文字には文字表内で固有の番号が割り当てられています。

2) 要素が文字列でない場合、sort() メソッドは比較のために配列要素を文字列に変換しようとします。

3) sort() メソッドは、文字列の数に基づいて並べ替えるのではなく、要素の値に基づいてビットごとの比較を実行します。

var a = ["aba","baa","aab"];  定义数组
a.sort();  //按字母顺序对元素进行排序
console.log(a);  //返回数组[aab,aba,baa]
ログイン後にコピー

ソートする場合は、まず各要素の最初の文字を比較し、最初の文字が同じ場合は 2 番目の文字を比較し、以下同様に続きます。

4) いずれの場合も、配列内の未定義の要素は最後にソートされます。

5) sort() メソッドは、元の配列に対して並べ替え操作を実行し、新しい配列を作成しません。

sort() メソッドは、アルファベット順に並べ替えるだけでなく、他の順序に従って操作を実行することもできます。この場合、メソッドには 2 つの値を比較し、2 つの値の相対的な順序を表す数値を返す関数パラメータを指定する必要があります。 sort 関数には a と b の 2 つのパラメータが必要で、その戻り値は次のとおりです。

  • カスタム基準に従って a が b より小さい場合、並べ替えられた配列では a が b より前に表示される必要があり、0 より小さい値が返されます。

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

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

例 1

次の例では、配列内の各要素のサイズがソート関数に従って比較され、ソートされます。小から大へ 順番に並べ替えが行われます。

function f(a,b) {  //排序函数
    return (a - b);  //返回比较参数
}
var a = [3,1,2,4,5,7,6,8,0,9];  //定义数组
a.sort(f);  //根据数字大小由小到大进行排序
console.log(a);  //返回数组[0,1,2,3,4,5,6,4,7,8,9]
ログイン後にコピー

大きい順に実行した場合は戻り値を反転するだけです。コードは次のとおりです。

function f(a,b) {  //排序函数
    return -(a - b);  //取反并返回比较参数
}
var a = [3,1,2,4,5,7,6,8,0,9];  //定义数组
a.sort(f);  //根据数字大小由小到大进行排序
console.log(a);  //返回数组[9,8,7,6,5,4,3,2,1,0]
ログイン後にコピー

例 2

奇数プロパティと偶数プロパティに従って配列を配置します。

sort() は、主に関数の並べ替えと比較に使用するため、より柔軟に使用できます。たとえば、奇数と偶数に従って配列を並べ替える場合、シーケンス関数の 2 つのパラメーターが奇数か偶数かを判断し、並べ替え順序を決定するだけで済みます。

function f(a, b) {  //排序函数
    var a = a % 2;  //获取参数a的奇偶性
    var b = b % 2;  //获取参数b的奇偶性
    if (a == 0) return 1;  //如果参数a为偶数,则排在左边
    if (b == 0) return -1;  //如果参数b为偶数,则排在右边
}
var a = [3,1,2,4,5,7,6,8,0,9];  //定义数组
a.sort(f);  //根据数字大小由大到小进行排序
console.log(a);  //返回数组[3,1,5,7,9,0,8,6,4,2]
ログイン後にコピー

sort() メソッドは、ソート関数を呼び出すときに、各要素の値をソート関数に渡します。要素の値が偶数の場合、その位置は変更されません。要素の値が奇数の場合、パラメータ a と b の表示順序が交換され、それによって配列内のすべての要素の奇数偶数の並べ替えが実行されます。偶数を最初にソートし、奇数を後にソートする場合は、戻り値を取得するだけで済みます。ソート機能は以下の通りです。

function f(a, b) {
    var a = a % 2;
    var b = b % 2;
    if (a == 0) return -1;
    if (b == 0) return 1;
}
ログイン後にコピー

例 3

文字列を大文字と小文字を区別せずに並べ替えます。

通常の状況では、文字エンコード テーブル内の大文字と小文字の順序が異なり、大文字の方が小文字よりも大きいため、文字列の並べ替えでは大文字と小文字が区別されます。

var a = ["aB", "Ab", "Ba", "bA"];  //定义数组
a.sort();  //默认方法排序
console.log(a);  //返回数组["Ab", "Ba", "aB", "bA"]
ログイン後にコピー

大文字は常に左側に配置されますが、小文字が常に左側に配置されるようにしたい場合は、次のように設計できます:

function f(a ,b) {
    return (a < b);
}
var a = ["aB", "Ab", "Ba", "bA"];  //定义数组
a.sort();  //默认方法排序
console.log(a);  //返回数组["Ab", "Ba", "aB", "bA"]
ログイン後にコピー

文字の大きさを比較する場合、JavaScript文字エンコーディングのサイズに基づいて決定され、trueの場合は1を返し、falseの場合は-1を返します。

大文字と小文字を区別せず、大文字と小文字を同じ順序で配置する場合は、次のように設計できます。

function f(a, b) {
    var a = a.toLowerCase;
    var b = b.toLowerCase; 
    if (a < b) {
        return 1;
    }
    else {
        return -1;
    }
}
var a = ["aB", "Ab", "Ba", "bA"];  //定义数组
a.sort();  //默认方法排序
console.log(a);  //返回数组["aB", "Ab", "Ba", "bA"]
ログイン後にコピー

並べ替え順序を調整したい場合は、戻り値を反転するように設定するだけです。

例 4

浮動小数点数と整数を別々に表示します。

function f(a, b) {  //排序函数
    if (a > Math.floor(a)) return 1;  //如果a是浮点数,则调换位置
    if (b > Math.floor(b)) return -1;  //如果b是浮点数,则调换位置
}
var a = [3.5555, 1.23456, 3, 2.11111, 5, 7, 3];  //定义数组
a.sort(f);  //进行筛选
console.log(a);  //返回数组[3,5,7,3,2.11111,1.23456,3.55555]
ログイン後にコピー

ソート順を調整したい場合は、戻り値を反転するように設定するだけです。

[推奨学習: JavaScript 上級チュートリアル]

以上がJavaScriptのsortメソッドを使って並べ替える方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法 WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法 Dec 17, 2023 pm 02:54 PM

WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法 はじめに: 技術の継続的な発展により、音声認識技術は人工知能の分野の重要な部分になりました。 WebSocket と JavaScript をベースとしたオンライン音声認識システムは、低遅延、リアルタイム、クロスプラットフォームという特徴があり、広く使用されるソリューションとなっています。この記事では、WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法を紹介します。

WebSocket と JavaScript: リアルタイム監視システムを実装するための主要テクノロジー WebSocket と JavaScript: リアルタイム監視システムを実装するための主要テクノロジー Dec 17, 2023 pm 05:30 PM

WebSocketとJavaScript:リアルタイム監視システムを実現するためのキーテクノロジー はじめに: インターネット技術の急速な発展に伴い、リアルタイム監視システムは様々な分野で広く利用されています。リアルタイム監視を実現するための重要なテクノロジーの 1 つは、WebSocket と JavaScript の組み合わせです。この記事では、リアルタイム監視システムにおける WebSocket と JavaScript のアプリケーションを紹介し、コード例を示し、その実装原理を詳しく説明します。 1.WebSocketテクノロジー

JavaScript と WebSocket を使用してリアルタイムのオンライン注文システムを実装する方法 JavaScript と WebSocket を使用してリアルタイムのオンライン注文システムを実装する方法 Dec 17, 2023 pm 12:09 PM

JavaScript と WebSocket を使用してリアルタイム オンライン注文システムを実装する方法の紹介: インターネットの普及とテクノロジーの進歩に伴い、ますます多くのレストランがオンライン注文サービスを提供し始めています。リアルタイムのオンライン注文システムを実装するには、JavaScript と WebSocket テクノロジを使用できます。 WebSocket は、TCP プロトコルをベースとした全二重通信プロトコルで、クライアントとサーバー間のリアルタイム双方向通信を実現します。リアルタイムオンラインオーダーシステムにおいて、ユーザーが料理を選択して注文するとき

WebSocketとJavaScriptを使ったオンライン予約システムの実装方法 WebSocketとJavaScriptを使ったオンライン予約システムの実装方法 Dec 17, 2023 am 09:39 AM

WebSocket と JavaScript を使用してオンライン予約システムを実装する方法 今日のデジタル時代では、ますます多くの企業やサービスがオンライン予約機能を提供する必要があります。効率的かつリアルタイムのオンライン予約システムを実装することが重要です。この記事では、WebSocket と JavaScript を使用してオンライン予約システムを実装する方法と、具体的なコード例を紹介します。 1. WebSocket とは何ですか? WebSocket は、単一の TCP 接続における全二重方式です。

PHP でキー名を保持する高速配列ソート方法 PHP でキー名を保持する高速配列ソート方法 May 02, 2024 pm 03:06 PM

キー名を保持する PHP の高速配列ソート方法: ksort() 関数を使用してキーをソートします。ユーザー定義の比較関数を使用して並べ替えるには、uasort() 関数を使用します。実際のケース: ユーザー ID を保持しながら、ユーザー ID とスコアの配列をスコアごとに並べ替えるには、uasort() 関数とカスタム比較関数を使用できます。

JavaScript と WebSocket: 効率的なリアルタイム天気予報システムの構築 JavaScript と WebSocket: 効率的なリアルタイム天気予報システムの構築 Dec 17, 2023 pm 05:13 PM

JavaScript と WebSocket: 効率的なリアルタイム天気予報システムの構築 はじめに: 今日、天気予報の精度は日常生活と意思決定にとって非常に重要です。テクノロジーの発展に伴い、リアルタイムで気象データを取得することで、より正確で信頼性の高い天気予報を提供できるようになりました。この記事では、JavaScript と WebSocket テクノロジを使用して効率的なリアルタイム天気予報システムを構築する方法を学びます。この記事では、具体的なコード例を通じて実装プロセスを説明します。私たちは

簡単な JavaScript チュートリアル: HTTP ステータス コードを取得する方法 簡単な JavaScript チュートリアル: HTTP ステータス コードを取得する方法 Jan 05, 2024 pm 06:08 PM

JavaScript チュートリアル: HTTP ステータス コードを取得する方法、特定のコード例が必要です 序文: Web 開発では、サーバーとのデータ対話が頻繁に発生します。サーバーと通信するとき、多くの場合、返された HTTP ステータス コードを取得して操作が成功したかどうかを判断し、さまざまなステータス コードに基づいて対応する処理を実行する必要があります。この記事では、JavaScript を使用して HTTP ステータス コードを取得する方法を説明し、いくつかの実用的なコード例を示します。 XMLHttpRequestの使用

JS 配列のソート: sort() メソッドの動作原理とメカニズムの詳細な分析 JS 配列のソート: sort() メソッドの動作原理とメカニズムの詳細な分析 Dec 28, 2023 am 11:47 AM

JS 配列のソートを深く理解するには、sort() メソッドの原理とメカニズム、具体的なコード例が必要です はじめに: 配列のソートは、日常のフロントエンド開発作業で非常に一般的な操作の 1 つです。 JavaScript の配列ソート メソッド sort() は、最も一般的に使用される配列ソート メソッドの 1 つです。しかし、sort() メソッドの原理とメカニズムを本当に理解していますか?この記事では、JS 配列の並べ替えの原理とメカニズムを深く理解し、具体的なコード例を示します。 1.sort()メソッドの基本的な使い方

See all articles