javascript 排序
There are tons of sorting algorithms available like bubble sort, merge sort, insertion sort etc. You must have implemented some of these in other programming languages like C or C++. But in this article, I will be demonstrating the Sorting methods inbuilt in JavaScript.
有大量的排序算法可用,例如冒泡排序,合并排序,插入排序等。您必須已經用其他編程語言(例如C或C ++)實現了其中一些。 但是在本文中,我將演示JavaScript內置的Sorting方法 。
This is way different from usual sorting algorithms you must have seen.
這與您必須看到的常規排序算法不同。
JavaScript code:
JavaScript代碼:
<html>
<head><title>COLA PRODUCTS.!!!</title></head>
<body>
<script>
document.write("<br>");
var products = [
{ name: "Grapefruit", calories: 170, color: "red", sold: 8200 },
{ name: "Orange", calories: 160, color: "orange", sold: 12101 },
{ name: "Cola", calories: 210, color: "caramel", sold: 25412 },
{ name: "Diet Cola", calories: 0, color: "caramel", sold: 43922 },
{ name: "Lemon", calories: 200, color: "clear", sold: 14983 },
{ name: "Raspberry", calories: 180, color: "pink", sold: 9427 },
{ name: "Root Beer", calories: 200, color: "caramel", sold: 9909 },
{ name: "Water", calories: 0, color: "clear", sold: 62123 }
];
function compareSold(colaA, colaB) {
if (colaA.sold > colaB.sold) {
return 1;
} else if (colaA.sold === colaB.sold) {
return 0;
} else {
return -1;
}
}
function compareName(colaA, colaB) {
if (colaA.name > colaB.name) {
return 1;
} else if (colaA.name === colaB.name) {
return 0;
} else {
return -1;
}
}
function compareCalories(colaA, colaB) {
if (colaA.calories > colaB.calories) {
return 1;
} else if (colaA.calories === colaB.calories) {
return 0;
} else {
return -1;
}
}
function compareColor(colaA, colaB) {
if (colaA.color > colaB.color) {
return 1;
} else if (colaA.color === colaB.color) {
return 0;
} else {
return -1;
}
}
function printProducts(products) {
for (var i = 0; i < products.length; i++) {
document.write(" Name: " + products[i].name + " "+
" Calories: " + products[i].calories +" "+
" Color: " + products[i].color + " "+
" Sold: " + products[i].sold);
document.write("<br>");
}
document.write("<br>");
}
products.sort(compareSold);
document.writeln("Products sorted by number of bottles sold:");
document.write("<br>");
printProducts(products);
products.sort(compareName);
document.write("Products sorted by name:");
document.write("<br>");
document.writeln();
printProducts(products);
products.sort(compareCalories);
document.write("Products sorted by calories:");
document.write("<br>");
printProducts(products);
products.sort(compareColor);
document.write("Products sorted by color:");
document.write("<br>");
printProducts(products);
</script>
</body>
</html>
Output
輸出量
Products sorted by number of bottles sold:
Name: Grapefruit Calories: 170 Color: red Sold: 8200
Name: Raspberry Calories: 180 Color: pink Sold: 9427
Name: Root Beer Calories: 200 Color: caramel Sold: 9909
Name: Orange Calories: 160 Color: orange Sold: 12101
Name: Lemon Calories: 200 Color: clear Sold: 14983
Name: Cola Calories: 210 Color: caramel Sold: 25412
Name: Diet Cola Calories: 0 Color: caramel Sold: 43922
Name: Water Calories: 0 Color: clear Sold: 62123
Products sorted by name:
Name: Cola Calories: 210 Color: caramel Sold: 25412
Name: Diet Cola Calories: 0 Color: caramel Sold: 43922
Name: Grapefruit Calories: 170 Color: red Sold: 8200
Name: Lemon Calories: 200 Color: clear Sold: 14983
Name: Orange Calories: 160 Color: orange Sold: 12101
Name: Raspberry Calories: 180 Color: pink Sold: 9427
Name: Root Beer Calories: 200 Color: caramel Sold: 9909
Name: Water Calories: 0 Color: clear Sold: 62123
Products sorted by calories:
Name: Diet Cola Calories: 0 Color: caramel Sold: 43922
Name: Water Calories: 0 Color: clear Sold: 62123
Name: Orange Calories: 160 Color: orange Sold: 12101
Name: Grapefruit Calories: 170 Color: red Sold: 8200
Name: Raspberry Calories: 180 Color: pink Sold: 9427
Name: Lemon Calories: 200 Color: clear Sold: 14983
Name: Root Beer Calories: 200 Color: caramel Sold: 9909
Name: Cola Calories: 210 Color: caramel Sold: 25412
Products sorted by color:
Name: Diet Cola Calories: 0 Color: caramel Sold: 43922
Name: Root Beer Calories: 200 Color: caramel Sold: 9909
Name: Cola Calories: 210 Color: caramel Sold: 25412
Name: Water Calories: 0 Color: clear Sold: 62123
Name: Lemon Calories: 200 Color: clear Sold: 14983
Name: Orange Calories: 160 Color: orange Sold: 12101
Name: Raspberry Calories: 180 Color: pink Sold: 9427
Name: Grapefruit Calories: 170 Color: red Sold: 8200
Don't be scared...
別害怕...
The code is quite easy to understand.
該代碼很容易理解。
First, an array of objects has been created. Each object having the same set of properties.
首先,已創建對象數組。 每個對象具有相同的屬性集。
Arrays in JS have an inbuilt sort method. This sort method takes another comparing function defined by coders as an argument.
JS中的數組具有內置的排序方法。 這種排序方法采用編碼器定義的另一個比較函數作為參數。
The major principle behind all this is that sort method needs a function to compare two elements of the array on which sort method is called. When that function is to be called and on which two elements of an array it is to be called that is decided by the sort method.
所有這些背后的主要原理是sort方法需要一個函數來比較調用sort方法的數組的兩個元素。 當要調用該函數以及要在數組的哪兩個元素上調用時,該函數由sort方法決定。
Here I have defined four functions that are used to compare two objects of an array at a time. Each function compares two objects on the different basis. Like function, compareName compares two objects on the basis of name property of objects.
在這里,我定義了四個函數,用于一次比較一個數組的兩個對象。 每個函數在不同的基礎上比較兩個對象。 像函數一樣,compareName根據對象的name屬性比較兩個對象。
If the name of the first object is lexicographically larger than the name of the second object then 1 is returned to sort method if they are equal 0 is returned and if the name of the first object is lexicographically smaller than the name of the second object then -1 is returned to sort method.
如果第一個對象的名稱在字典上大于第二個對象的名稱,則將1返回到sort方法,如果它們相等,則返回0,并且如果第一個對象的名稱在字典上小于第二個對象的名稱,則-1返回排序方法。
Other three functions compareSold, compareCaloriescompareColor work In exactly same manner.
其他三個函數compareSold , compareCaloriescompareColor以完全相同的方式工作。
Printproducts is a simple function used to print the input array.
Printproducts是用于打印輸入數組的簡單函數。
Document.write is like console.log which is used to display text on corresponding HTML page.
Document.write類似于console.log ,用于在相應HTML頁面上顯示文本。
I hope I have made everything very clear and precise.
我希望我已經使所有內容都非常清楚和準確了。
Try to make your own compare functions and use the inbuilt sort method on different arrays.
嘗試制作自己的比較函數,并在不同的數組上使用內置的sort方法。
翻譯自: https://www.includehelp.com/code-snippets/sorting-methods-in-javascript.aspx
javascript 排序