JavaScript的對象數組排序返回隨機結果

Question

我想獲得一個簡單的排序工作的對象數組，但它似乎是返回完全隨機的結果。請看看這個普拉克（在FF或Chrome）

http://plnkr.co/edit/TqoyUJV4nzvC4hAkVRkz?p=preview

var data; 
    var asc; 

    function init(){ 
     data = [{username:"leonhaas"},{username:"0johnson"},{username:"leonlang"},{username:"0lechner"},{username:"0koller"},{username:"leonwinkler"},{username:"0schmidt"},{username:"0mueller"},{username:"0schmid"},{username:"lillyfuchs"},{username:"alexandragruber"},{username:"alexanderlechner"},{username:"alexanderpichler"},{username:"alexandraeder"},{username:"lillyreiter"},{username:"alibauer"},{username:"alexandrahall"},{username:"alexandrajohnson"},{username:"alexandrataylor"},{username:"alexandrawilliams"},{username:"lilywinkler"},{username:"alinabauer"},{username:"aliceegger"},{username:"alicesteiner"},{username:"alicewallner"},{username:"aliegger"},{username:"alifuchs"},{username:"linajohnson"},{username:"amarwhite"},{username:"alinaleitner"},{username:"alinaschmidt"},{username:"alinawood"},{username:"alischneider"}]; 
     outputData(data); 
     asc = true; 
    } 

    function sortIt() 
    { 
     a = data.username; 
     b = data.username; 
     if(asc){ 
      data.sort(function(a,b) 
      { 
       return 1; 
      }); 
     } else { 
      data.sort(function(a,b) 
      { 
       return -1; 
      }); 
     } 

     outputData(data); 
    } 

    function outputData(data){ 
     var output = ""; 
     data.forEach(function (item){ 
      output += item.username +"<br>"; 
     }); 

     var x=document.getElementById("demo"); 
     x.innerHTML=output; 
    } 

Answer 1

在你的排序功能，你要比較的數據對象用戶名：

function sortIt() 
{ 
    if(asc){ 
     data.sort(function(a,b) 
     { 
      return a.username.localeCompare(b.username); 
     }); 
    } else { 
     data.sort(function(a,b) 
     { 
      return b.username.localeCompare(a.username); 
     }); 
    } 

    outputData(data); 
} 

Answer 2

您應該返回從排序功能基礎上，條件的值，而不只是1或-1。像這樣...

// Inside your script.js. Line #14 
if(asc){ 
    data.sort(function(a,b) 
    { 
     return a>b ? 1 : -1; 
    }); 
} else { 
    data.sort(function(a,b) 
    { 
     return a>b ?-1 : 1; 
    }); 
} 

Answer 3

一對夫婦的事情，你不排序的數組，你需要返回0如果值相同，則取決於升序/降序排序，然後是-1（或1）。
除此之外，您在sortIt函數中分配了var a和var b，這足夠了，但這些不是您在sort回調中使用的值。因爲回調的參數是相同的名稱，所以它們掩蓋了較高範圍的a和b變量。

所有的事情考慮，排序回調應該是這樣的：

data.sort(function(a,b) 
{ 
    return a.username === b.username ? 0 : a.username >b.username ? 1 : -1; 
}); 

所有的事情考慮，你的代碼可以與很多工作要做：你使用全局變量所有的地方，你的sortIt函數將在每次調用中重新聲明排序回調函數，您在HTML中綁定事件處理程序（最好在JS中管理JS偵聽器，排序 - 單一響應性原則），調用可能受益於實際相關調用上下文等的函數... look into IIFE's to create closures作爲開始，並且書籤MDN

Answer 4

function sortIt() 
    { 
     a = data.username; 
     b = data.username; 
     if(asc){ 
      data.sort(function(a,b) 
      { 
       if(a.username.localeCompare(b.username) > 0) 
       return 1; 
       else 
       return -1; 
      }); 
     } else { 
      data.sort(function(a,b) 
      { 
       if(b.username.localeCompare(a.username) > 0) 
       return 1; 
       else 
       return -1; 
      }); 
     } 

     outputData(data); 
    } 

Answer 5

 data = [{username: "leonhaas"},...]; 

     var asc = true; 

     data.sort(function(a, b) { 
      if (asc) 
       return a.username > b.username ? 1 : -1; 
      else 
       return a.username > b.username ? -1 : 1; 
     }); 

     for (var i = 0; i < data.length; i++) { 
      console.log(data[i].username); 
     }