資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝設計
法學如何使用 JavaScript 對數字陣列進行排序？
在本文中，我們將學習在 JavaScript 中對數字陣列進行排序的方法。陣列排序是指按特定順序排列陣列元素，可以是升序或遞增順序，也可以是降序或遞減順序。
在 JavaScript 中，我們可以透過兩種方式對數字陣列進行特定順序的排序：
使用迴圈遍歷陣列
使用 JavaScript 中提供的 sort() 方法
讓我們詳細討論以上兩種方法，並對數字值陣列進行排序。
使用迴圈遍歷陣列
這是對陣列進行排序的一種簡單、容易和最基本的方法。我們甚至可以使用此方法對任何語言中的數字陣列進行排序。在此方法中，我們使用兩個不同的迴圈，並將每個元素相互比較以對陣列進行排序。此方法的時間複雜度為 **O(N^2)**，額外空間複雜度為 **O(1)**，其中 **N** 為陣列的大小。
語法
以下語法將向您展示如何使用巢狀迴圈按遞增順序對陣列進行排序：
for(var i=0; i<n; i++){
for(var j=i+1; j<n; j++){
// statements inside the loops
}
}
現在讓我們瞭解此方法的實際實現，並透過 JavaScript 程式碼示例對數字值陣列進行排序。
步驟
**步驟 1** - 在第一步中，我們將新增一個數字型別的輸入元素到文件中，並獲取使用者輸入的數字，將其作為元素推入陣列。
**步驟 2** - 在此步驟中，我們將在文件中新增兩個按鈕元素以執行不同的任務。第一個按鈕將插入或將輸入的值推入陣列，而第二個按鈕將透過比較其數值來對陣列元素進行排序。
**步驟 3** - 在下一步中，我們將定義一個 JavaScript 函式，並將其作為值分配給上一步中新增的第一個按鈕的 onclick 事件，以便將元素插入到陣列中。
**步驟 4** - 在第四步中，我們將定義另一個 JavaScript 函式，該函式將使用巢狀迴圈透過相互比較來對陣列元素進行排序，並將其作為值分配給第二步中新增的第二個按鈕的 onclick 事件。
示例
下面的示例將解釋如何使用兩個巢狀迴圈按升序對數字陣列進行排序：
<!DOCTYPE html>
<html>
<body>
<h2>Sort Numeric Array using JavaScript</h2>
<p>Enter elements of the array in numeric form:</p>
<input type = "number" id = "inp1" placeholder = "Number Value"><br><br>
<p id = "prev"> The initial order of the elements stored in the array is:</p>
<button id = "add" onclick = "setValues()"> Push element to the array</button>
<button id = "btn" onclick = "sortElement()"> click to sort the array</button>
<p id = "result"> </p>
<script>
var result = document.getElementById("result");
var prev = document.getElementById("prev");
var myArr = [];
function setValues() {
var inp1 = document.getElementById("inp1");
var val1 = inp1.value;
var num = Number(val1);
myArr.push(num)
inp1.value = " ";
}
function sortElement() {
var n = myArr.length;
if (n == 0) {
result.innerHTML = " <b> The array is empty, Please push the elements in the array and then try to sort. </b> "
} else {
prev.innerHTML += " <b> [ " + myArr + " ] </b> ";
for (var i = 0; i < n; i++) {
for (var j = i + 1; j < n; j++) {
if (myArr[j] < myArr[i]) {
// swap the numbers
var a = myArr[i];
myArr[i] = myArr[j];
myArr[j] = a;
}
}
}
result.innerHTML = " The array is sorted in the increasing order and the sorted order is: <b> [ " + myArr + " ]. </b> ";
}
}
</script>
</body>
</html>
在此示例中，我們看到了如何使用兩個巢狀迴圈遍歷並比較每個元素，並將它們按特定順序排列，從而對數字值陣列進行排序。
使用 sort() 方法
sort() 方法是 JavaScript 提供的一種用於對陣列元素進行排序的方法。它將陣列的所有值視為字串，然後進行比較以進行排序。
sort() 方法的問題
將陣列元素視為字串的 sort() 方法的特性限制了其用途。因為，當存在一個包含零且大於所有其他元素的元素時，由於字串的考慮，sort 方法會將該元素視為最小元素。例如，如果陣列包含 **10** 和 **7** 作為元素。因此，根據數學運算，10>7，但 sort 方法會根據 10<7（字串比較）進行相反順序的排序，並將 10 放在 7 之前。
Array : [ 7, 5, 10, 12 ]; Order given by sort() method : [ 10, 12, 5, 7 ] Correct order will be : [ 5, 7, 10, 12 ]
**解決方案** - 以上問題的解決方案是使用比較器函式，並將其傳遞到 sort() 方法的括號內，以指定我們想要排序元素的順序。比較器函式將返回三個值：
**負數** - 如果返回負值，則表示第一個引數小於第二個引數，因此它將在排序順序中排在前面。
**零** - 零值表示兩個引數相同，並且它們的位置不會改變。
**正數** - 正值表示第一個引數大於第二個引數，因此第二個引數將在排序順序中排在前面。
語法
以下語法將讓您知道如何使用 sort() 方法對陣列進行排序：
array_name.sort( comparator_function );
讓我們透過在 JavaScript 程式碼示例中進行實際實現來了解它：
演算法
前一個示例和此示例的演算法幾乎相同。您只需要使用帶有比較器函式的 **sort()** 方法對陣列進行排序即可。
示例
下面的示例將解釋如何使用帶有比較器函式的 sort() 方法對陣列元素進行排序：
<!DOCTYPE html>
<html>
<body>
<h2>Sort Numeric Array using JavaScript</h2>
<p>Enter elements of the array in numeric form:</p>
<input type = "number" id = "inp1" placeholder = "Number Value"><br><br>
<p id = "prev">The initial order of the elements stored in the array is:</p>
<button id = "add" onclick = "setValues()">Push element to the array</button>
<button id = "btn" onclick = "sortElement()">click to sort the array</button>
<p id = "result"> </p>
<script>
var result = document.getElementById("result");
var prev = document.getElementById("prev");
var myArr = [];
function setValues() {
var inp1 = document.getElementById("inp1");
var val1 = inp1.value;
var num = Number(val1);
myArr.push(num)
inp1.value = " ";
}
function sortElement() {
function cmp(a, b) {
return a - b;
}
var n = myArr.length;
if (n == 0) {
result.innerHTML = " <b> The array is empty, Please push the elements in the array and then try to sort. </b> "
}
else {
prev.innerHTML += " <b> [ " + myArr + " ] </b> ";
myArr.sort(cmp);
result.innerHTML = " The array is sorted in the increasing order and the sorted order is: <b> [ " + myArr + " ]. </b> ";
}
}
</script>
</body>
</html>
在上面的示例中，我們使用了帶有比較器函式的 sort() 方法按遞增或升序對陣列元素進行排序。
**注意** - 如果您交換比較器函式和迴圈方法中我們比較的值，則陣列元素將按相反順序排序，即降序或遞減順序。
結論
在本文中，我們學習了兩種不同的對數字陣列元素進行排序的方法。我們還討論了使用 sort() 方法對陣列進行排序時出現的問題以及該問題的解決方案，並透過程式碼示例來了解每種方法的實際實現。
664 次瀏覽
