✍ 📁 🙈 🙉 🙊 : sort()

Sort() 排序

<div style="font-size: 20px ;">
JavaScript array.sort() 用來 陣列 元素排序，並回傳一個排序完成的新陣列，一般可以分為將 英文字母 或 單字排序 或 數字元素排列，sort 僅會將原本的陣列重新排序，不會另外產生一個新陣列，也就是說回傳的結果陣列就是原本的那個陣列。</div><br>

<div id="S1" ></div>
<table border="3" style="width:100%;font-size: 20px ; ">
<tbody>
<tr><td>
 ﹤script> <font  color="red">順序 分別為 a,b<font  color="black"><br />
    var A1= ["45", "76", "22", "14", "89", "78"];<br />
    A1.sort(function(<font  color="red">a,b<font  color="black">){<br />
  var x = a.toLowerCase();<br />
  var y = b.toLowerCase();<br />
    return a == b ? 0 : (a>b ? 1 : -1);}) <br />
document.write(A1);
<br />
﹤/script> 
</td><td>
<script>
var A1= ["45", "76", "22", "14", "89", "78"];
A1.sort(function(a,b){
  var x = a.toLowerCase();
  var y = b.toLowerCase();
    return a == b ? 0 : (a>b ? 1 : -1);}) 
document.write(A1);
</script>
</td></tr>

<tr><td>
 ﹤script> <font  color="red">逆序 分別為 b,a<font  color="black"><br />
    var A1= ["45", "76", "22", "14", "89", "78"];<br />
    A1.sort(function(<font  color="red">b,a<font  color="black">){<br />
  var x = a.toLowerCase();<br />
  var y = b.toLowerCase();<br />
    return a == b ? 0 : (a>b ? 1 : -1);}) <br />
document.write(A1);
<br />
﹤/script> 
</td><td>
<script>
var A1= ["45", "76", "22", "14", "89", "78"];
A1.sort(function(b,a){
  var x = a.toLowerCase();
  var y = b.toLowerCase();
    return a == b ? 0 : (a>b ? 1 : -1);}) 
document.write(A1);
</script>
</td></tr>

<div id="S1" ></div>
<table border="3" style="width:100%;font-size: 20px ; ">
<tbody>
<tr><td>
 ﹤script> <font  color="red">順序 分別為 a,b<font  color="black"><br />
    var A1= ["ss", "gg", "aa", "SS", "GG", "2","AA"];<br />
    A1.sort(function(<font  color="red">a,b<font  color="black">){<br />
  var x = a.toLowerCase();<br />
  var y = b.toLowerCase();<br />
    return a == b ? 0 : (a>b ? 1 : -1);}) <br />
document.write(A1);
<br />
﹤/script> 
</td><td>
<script>
var A1= ["ss", "gg", "aa", "SS", "GG", "2","AA"];
A1.sort(function(a,b){
  var x = a.toLowerCase();
  var y = b.toLowerCase();
    return a == b ? 0 : (a>b ? 1 : -1);}) 
document.write(A1);
</script>
</td></tr>

<tr><td>
 ﹤script> <font  color="red">逆序 分別為 b,a<font  color="black"><br />
    var A1= ["ss", "gg", "aa", "SS", "GG", "2","AA"];<br />
    A1.sort(function(<font  color="red">b,a<font  color="black">){<br />
  var x = a.toLowerCase();<br />
  var y = b.toLowerCase();<br />
    return a == b ? 0 : (a>b ? 1 : -1);}) <br />
document.write(A1);
<br />
﹤/script> 
</td><td>
<script>
var A1= ["ss", "gg", "aa", "SS", "GG", "2","AA"];
A1.sort(function(b,a){
  var x = a.toLowerCase();
  var y = b.toLowerCase();
    return a == b ? 0 : (a>b ? 1 : -1);}) 
document.write(A1);
</script>
</td></tr>

</tbody>
</table>

<div style="font-size: 20px ;">
<table style="font-size:20px;vertical-align:top;"><tbody><tr>
<td rowspan="8" style="vertical-align:top;">var Vehicles = [ </td>
<td>{Qty:12 , </td><td> Brand:"orange"</td><td> , price:3.8},</td></tr>
<td>{Qty:03 , </td><td> Brand:"pear"</td><td> , price:2.6},</td></tr>
<td>{Qty:05 , </td><td> Brand:"apple"</td><td> , price:7.2},</td></tr>
<td>{Qty:53 , </td><td> Brand:"banana"</td><td> , price:11.5},</td></tr>
<td>{Qty:12 , </td><td> Brand:"lemon"</td><td> , price:1.1},</td></tr>
<td>{Qty:53 , </td><td> Brand:"cherry"</td><td> , price:5.6},</td></tr>
<td>{Qty:47 , </td><td> Brand:"lychee"</td><td> , price:3.2} ];</td></tr>
</tbody></table>
<br>
<div id="DP1"></div>
<br>
<div id="DP2"></div>
<br>
<div id="DP3"></div>
</div>

var Tt ="<table  border='1' style='width:100%;font-size:20px;'>";
Tt+="<tr><td rowspan='8'>" ;
Tt+="<b><i>sort by Qty </b></i><br><br>" ;
Tt+="Vehicles = Vehicles.sort(function (a, b) { <br>" ;
Tt+= "return " ;
Tt+= "<font  color='red'>a.Qty > b.Qty<font  color='black'> ? 1 : -1; });" ;
Tt+="</td><th>Qty</th><th>Brand</th><th>price</th></tr>" ;
for (var i = 0, l = Vehicles.length; i < l; ++i) {
 Tt +=  "<tr><td bgcolor='red'>" + Vehicles[i].Qty;
 Tt +=  "</td><td>" +              Vehicles[i].Brand  ;
 Tt +=  "</td><td>" +              Vehicles[i].price ;
 Tt +=  "</td></tr></tablr>" }
DP1.innerHTML = Tt ;

//*******************  sort by Brand ***********************// 
Vehicles = Vehicles.sort(function (a, b) {
return a.Brand > b.Brand? 1 : -1; });

var Tt ="<table  border='1' style='width:100%;font-size:20px;'>";
Tt+="<tr><td rowspan='8'>" ;
Tt+="<b><i>sort by Brand </i><b><br><br>" ;
Tt+="Vehicles = Vehicles.sort(function (a, b) { <br>" ;
Tt+= "return " ;
Tt+= "<font  color='red'>a.Brand > b.Brand <font  color='black'> ? 1 : -1; });" ;
Tt+="</td><th>Qty</th><th>Brand</th><th>price</th></tr>" ;
for (var i = 0, l = Vehicles.length; i < l; ++i) {
 Tt +=  "<tr><td >"               + Vehicles[i].Qty;
 Tt +=  "</td><td bgcolor='red'>" + Vehicles[i].Brand  ;
 Tt +=  "</td><td>"               + Vehicles[i].price ;
 Tt +=  "</td></tr></tablr>" }
DP2.innerHTML = Tt ;

//*******************  sort by price***********************// 
Vehicles = Vehicles.sort(function (a, b) {
return a.price> b.price ? 1 : -1; });

var Tt ="<table  border='1' style='width:100%;font-size:20px;'>";
Tt+="<tr><td rowspan='8'>" ;
Tt+="<b><i>sort by price</i><b><br><br>" ;
Tt+="Vehicles = Vehicles.sort(function (a, b) { <br>" ;
Tt+= "return " ;
Tt+= "<font  color='red'>a.price > b.price<font  color='black'> ? 1 : -1; });" ;
Tt+="</td><th>Qty</th><th>Brand</th><th>price</th></tr>" ;
for (var i = 0, l = Vehicles.length; i < l; ++i) {
 Tt +=  "<tr><td >"               + Vehicles[i].Qty;
 Tt +=  "</td><td>"               + Vehicles[i].Brand  ;
 Tt +=  "</td><td bgcolor='red'>" + Vehicles[i].price ;
 Tt +=  "</td></tr></tablr>" }

DP3.innerHTML = Tt ;
</script>

<button type="button" onclick="Sv()" >sort by value</button>
<button type="button" onclick="St()" >sort by text</button>

function Sv() {
Vehicles = array .sort(function (a, b) {
return a.value> b.value? 1 : -1; });
JtoSel();
}

function St() {
Vehicles = array .sort(function (a,b) {
return a.text> b.text? 1 : -1; });
JtoSel();
}

function DPSel() {
var txt = '﹤select id="' + Sel.id + ' "><br>'  ;
for (var i = 0; i < Sel.options.length ; i++) {
txt += '﹤options value="' + Sel.options[i].value ;
txt += '" > ' + Sel.options[i].text + ' ﹤/options><br>' ;
}
txt += '﹤/select>'
DP.innerHTML  =  txt ;
}
DPSel();

</script>

#html 陣列排序 sort(), #script 陣列排序 sort(),

✍ 📁 🙈 🙉 🙊

html 測試上入下出

html 測試左右各一測試

html 測試單入單出

html 測試左入右出

class="ot"

尾部連結 hbbb(xx)

2020年4月2日星期四

sort()

Sort() 排序

沒有留言:

張貼留言

股票

搜尋此網誌

gold

小時鐘

gotop

html 測試 上入 下出

html 測試 左右 各一 測試

html 測試 單入 單出

html 測試 左入右出

class="ot"

尾部連結 hbbb(xx)

2020年4月2日 星期四

sort()

Sort() 排序

沒有留言:

張貼留言

股票

搜尋此網誌

gold

小時鐘

gotop

html 測試上入下出

html 測試左右各一測試

html 測試單入單出

html 測試左入右出

2020年4月2日星期四