如何按 ABC 对 javascript.map 名称数组进行排序答案

【问题标题】：How can i sort javascript.map array of names by ABC如何按 ABC 对 javascript.map 名称数组进行排序
【发布时间】：2019-08-19 11:09:21
【问题描述】：

我正在尝试从这个 javascript 地图中按 ABC 对名字数组进行排序。而且我还想从结果中隐藏“未定义”行：

function contacts_callback(obj) {
    var contactinfo = obj.contacts.map(o => 
        `${o.givenName} ${o.familyName} ${o.organizationName} ${
             o.phoneNumbers.map(n => n.phoneNumber)
        }`)
        .join("<br>");
    document.getElementById("demo").innerHTML = contactinfo;
}

// Demo
var obj = 
  {"success":true,"contacts":[
{"emailAddresses":[],"phoneNumbers":[{"label":"unknown","phoneNumber":"XXX-XXXXXXX"}],"givenName":"GGG","organizationName":"","familyName":"ggg",},
{"emailAddresses":[],"phoneNumbers":[{"label":"unknown","phoneNumber":"XXX-XXXXXXX"}],"givenName":"AAA","organizationName":"","familyName":"aaa",},
{"emailAddresses":[],"phoneNumbers":[{"label":"unknown","phoneNumber":"XXX-XXXXXXX"}],"givenName":"BBB","organizationName":"Apple","familyName":"bbb",},
{"emailAddresses":[],"phoneNumbers":[{"label":"unknown","phoneNumber":"XXX-XXXXXXX"}],"givenName":"undefined","organizationName":"","familyName":"",},
{"emailAddresses":[],"phoneNumbers":[{"label":"unknown","phoneNumber":"XXX-XXXXXXX"}],"givenName":"","organizationName":"Apple","familyName":"",},
]};

contacts_callback(obj);

&lt;div id="demo"&gt;&lt;/div&gt;

【问题讨论】：

旁注；将“未定义”字符串作为实际值是代码异味。如果是未定义的，应该是未定义的，而不是字符串
在映射之前在 obj.contacts 上使用 .sort() 和 .filter()。
按哪个名称排序？
@Taplar 我还没有听说过有人叫“未定义”，还，但我知道名字为Null 的人在很多系统上都遇到了很多问题.所以，是的 - 为一个不应该是字符串的值设置一个字符串是很糟糕的。
我写了“未定义”，因为在我的 Android 手机中，如果名称为空，则结果为“未定义”，所以我想隐藏此 NULL 名称所在的行。

标签： javascript jquery arrays sorting

【解决方案1】：

您可以过滤未定义的名称行并按givenName 排序，然后映射想要的结果。

function contacts_callback(obj) {
    var contactinfo = obj.contacts
        .filter(({ givenName }) => givenName !== 'undefined')
        .sort(({ givenName: a }, { givenName: b }) => a.localeCompare(b))
        .map(({ givenName, familyName, organizationName, phoneNumbers }) => 
            `${givenName} ${familyName} ${organizationName} ${
                 phoneNumbers.map(({ phoneNumber }) => phoneNumber)
            }`)
        .join("<br>");
    document.getElementById("demo").innerHTML = contactinfo;
}

// Demo
var obj = { success: true, contacts: [{ emailAddresses: [], phoneNumbers: [{ label: "unknown", phoneNumber: "XXX-XXXXXXX" }], givenName: "GGG", organizationName: "", familyName: "ggg" }, { emailAddresses: [], phoneNumbers: [{ label: "unknown", phoneNumber: "XXX-XXXXXXX" }], givenName: "AAA", organizationName: "", familyName: "aaa" }, { emailAddresses: [], phoneNumbers: [{ label: "unknown", phoneNumber: "XXX-XXXXXXX" }], givenName: "BBB", organizationName: "Apple", familyName: "bbb" }, { emailAddresses: [], phoneNumbers: [{ label: "unknown", phoneNumber: "XXX-XXXXXXX" }], givenName: "undefined", organizationName: "", familyName: "" }, { emailAddresses: [], phoneNumbers: [{ label: "unknown", phoneNumber: "XXX-XXXXXXX" }], givenName: "", organizationName: "Apple", familyName: "" }] };

contacts_callback(obj);

&lt;div id="demo"&gt;&lt;/div&gt;

【讨论】：