对子对象键上的对象数组 javascript 排序

Question

I have an array of objects containing sub-objects like this;

var array=[
  {
    "EmployeeName": "John",
    "Experience": "12",
    "data":{
      "Technology":"SharePoint"
    }
  },
  {
    "EmployeeName": "Charles",
    "Experience": "9",
      "data":{
      "Technology":"ASPNET"
    }
  },
  {
    "EmployeeName": "Jo",
    "Experience": "3",
       "data":{
      "Technology":"PHP"
    }
  },
  {
    "EmployeeName": "Daine",
    "Experience": "7",
      "data":{
      "Technology":"javascript"
    }
  },
  {
    "EmployeeName": "Zain",
    "Experience": "6",
     "data":{
      "Technology":"Unity"
    }
  }
];

Now, I want to sort this array based on the sub-objects key "Technology". I am using the example from here: https://jsfiddle.net/KSPriyaranjan/4Lzr0qux

This does the job when it sorts from a base object, but how do I get this to work:

function GetSortOrder(prop){
   return function(a,b){
      if( a[prop] > b[prop]){
          return 1;
      }else if( a[prop] < b[prop] ){
          return -1;
      }
      return 0;
   }
}

array.sort( GetSortOrder("data.Technology") );

document.write("<br><br> Sorted Technology Names : <br>");

for (var item in array) {
 document.write("<br>"+array[item].Technology);
}

This produces this:

Sorted Technology Names :

undefined
undefined
undefined
undefined

Hope someone can help in this matter and thanks in advance:-) undefined

Answer 1

If the property passed contains any . s, use reduce to navigate to the last nested value before comparison:

const GetSortOrder = (accessor) => {
  const getVal = accessor.includes('.')
    ? outer => accessor.split('.').reduce((a, prop) => a[prop], outer)
    : outer => outer;
  return (a, b) => getVal(a).localeCompare(getVal(b));
};

 var array=[ { "EmployeeName": "John", "Experience": "12", "data":{ "Technology":"SharePoint" } }, { "EmployeeName": "Charles", "Experience": "9", "data":{ "Technology":"ASPNET" } }, { "EmployeeName": "Jo", "Experience": "3", "data":{ "Technology":"PHP" } }, { "EmployeeName": "Daine", "Experience": "7", "data":{ "Technology":"javascript" } }, { "EmployeeName": "Zain", "Experience": "6", "data":{ "Technology":"Unity" } } ]; const GetSortOrder = (accessor) => { const getVal = accessor.includes('.')? outer => accessor.split('.').reduce((a, prop) => a[prop], outer): outer => outer; return (a, b) => getVal(a).localeCompare(getVal(b)); }; array.sort( GetSortOrder("data.Technology") ); console.log(array);

The conditional isn't strictly necessary (though you may consider it to make the intent clearer), you could also do

const getVal = outer => accessor.split('.').reduce((a, prop) => a[prop], outer)

Answer 2

Technology is not a property of your object. It is a property of your object.data.

Try changing javascript array[item].Technology to array[item].data.Technology

Answer 3

You could add a function for getting the value by keeping your commparing approach.

 function GetSortOrder(prop) { const keys = prop.split('.'), getValue = object => keys.reduce((o, k) => o[k], object); return function(a, b) { const left = getValue(a), right = getValue(b); if (left > right) return 1; else if (left < right) return -1; return 0; } } var array = [{ EmployeeName: "John", Experience: "12", data: { Technology: "SharePoint" } }, { EmployeeName: "Charles", Experience: "9", data: { Technology: "ASPNET" } }, { EmployeeName: "Jo", Experience: "3", data: { Technology: "PHP" } }, { EmployeeName: "Daine", Experience: "7", data: { Technology: "javascript" } }, { EmployeeName: "Zain", Experience: "6", data: { Technology: "Unity" } }]; array.sort(GetSortOrder("data.Technology")); console.log(array);

 .as-console-wrapper { max-height: 100%;important: top; 0; }