Question

在 JavaScript 中对数组的索引进行排序

2019-02-01

71

javascript vue.js ecmascript-6 vuejs2

我正在尝试在 Vuejs 上构建一个小型应用程序，其中我有一组通过 api 响应出现的数组，该数组提供以下输出：

{
    "data":
    {
        "Real Estate Regulatory Act":[
            {
                "id":603,
                "project_id":2392,
                "parent_type":"Real Estate Regulatory Act",
                "type":"Building Plan Approval",
                "name":"FORMS.pdf",
                "link":"https://.....DyumatHotelsFORMS.pdf"
            }
        ],
        "Environmental Clearance":[
            {
                "id":602,
                "project_id":2392,
                "parent_type":"Environmental Clearance",
                "type":"Form 1",
                "name":"HotelsCPEMP.pdf",
                "link":"https://.....MarineandDyumatHotelsCPEMP.pdf"
            }
        ],
        "Document":[
            {
                "id":601,
                "project_id":2392,
                "parent_type":"Document",
                "type":"Land Details",
                "name":"FORMS.pdf",
                "link":"https://....HotelsFORMS.pdf"
            }
        ],
        "Miscellaneous Approvals":[
            {
                "id":604,
                "project_id":2392,
                "parent_type":
                "Miscellaneous Approvals",
                "type":"Not Reported",
                "name":"Report Part 1.pdf",
                "link":"https://...Report Part 1.pdf"
            }
        ]
    }
}

我想根据以下数组的索引对此 javascript 进行排序：

['Document', 'Environmental Clearance', 'Real Estate Regulatory Act', 'Miscellaneous Approvals']

所以我的最终结果将是：

{
    "data":
    {
        "Document":[
            {
                "id":601,
                "project_id":2392,
                "parent_type":"Document",
                "type":"Land Details",
                "name":"FORMS.pdf",
                "link":"https://....HotelsFORMS.pdf"
            }
        ],
        "Environmental Clearance":[
            {
                "id":602,
                "project_id":2392,
                "parent_type":"Environmental Clearance",
                "type":"Form 1",
                "name":"HotelsCPEMP.pdf",
                "link":"https://.....MarineandDyumatHotelsCPEMP.pdf"
            }
        ],
        "Real Estate Regulatory Act":[
            {
                "id":603,
                "project_id":2392,
                "parent_type":"Real Estate Regulatory Act",
                "type":"Building Plan Approval",
                "name":"FORMS.pdf",
                "link":"https://.....DyumatHotelsFORMS.pdf"
            }
        ],
        "Miscellaneous Approvals":[
            {
                "id":604,
                "project_id":2392,
                "parent_type":
                "Miscellaneous Approvals",
                "type":"Not Reported",
                "name":"Report Part 1.pdf",
                "link":"https://...Report Part 1.pdf"
            }
        ]
    }
}

我的代码目前看起来像：

if(response.status === 200)
{
    let docs = response.data.data;
    let sortDocs = ['Document', 'Environmental Clearance', 'Real Estate Regulatory Act', 'Miscellaneous Approvals'];
    let result = []

    sortDocs.forEach(function(key) {
        this.subscProDocument[key] = result.push(docs[key])
    })

}

我收到类似这样的错误：

Uncaught (in promise) TypeError: Cannot read property 'subscProDocument' of undefined

我已经在 data() 中定义了这个 subscProDocument 并将其初始化为一个空数组。请帮我解决这个问题。谢谢

Answer 1

let data = {
    "data":
    {
        "Real Estate Regulatory Act":[
            {
                "id":603,
                "project_id":2392,
                "parent_type":"Real Estate Regulatory Act",
                "type":"Building Plan Approval",
                "name":"FORMS.pdf",
                "link":"https://.....DyumatHotelsFORMS.pdf"
            }
        ],
        "Environmental Clearance":[
            {
                "id":602,
                "project_id":2392,
                "parent_type":"Environmental Clearance",
                "type":"Form 1",
                "name":"HotelsCPEMP.pdf",
                "link":"https://.....MarineandDyumatHotelsCPEMP.pdf"
            }
        ],
        "Document":[
            {
                "id":601,
                "project_id":2392,
                "parent_type":"Document",
                "type":"Land Details",
                "name":"FORMS.pdf",
                "link":"https://....HotelsFORMS.pdf"
            }
        ],
        "Miscellaneous Approvals":[
            {
                "id":604,
                "project_id":2392,
                "parent_type":
                "Miscellaneous Approvals",
                "type":"Not Reported",
                "name":"Report Part 1.pdf",
                "link":"https://...Report Part 1.pdf"
            }
        ]
    }
};

从对象获取数据并分配给 unordered 变量

const unordered = data.data;

声明新变量 ordered

const ordered = {};

Object.keys 将从 unordered object 获取 keys 数组，然后将对键应用 sort function 进行 升序排序 。

然后我们将对 array of keys 执行 forEach 循环，并将键的值分配给 ordered object ；

Object.keys(unordered).sort().forEach(function(key) {
  ordered[key] = unordered[key];
});

console.log(ordered);

Answer 2

let obj = {
    "data":
    {
        "Real Estate Regulatory Act":[
            {
                "id":603,
                "project_id":2392,
                "parent_type":"Real Estate Regulatory Act",
                "type":"Building Plan Approval",
                "name":"FORMS.pdf",
                "link":"https://.....DyumatHotelsFORMS.pdf"
            }
        ],
        "Environmental Clearance":[
            {
                "id":602,
                "project_id":2392,
                "parent_type":"Environmental Clearance",
                "type":"Form 1",
                "name":"HotelsCPEMP.pdf",
                "link":"https://.....MarineandDyumatHotelsCPEMP.pdf"
            }
        ],
        "Document":[
            {
                "id":601,
                "project_id":2392,
                "parent_type":"Document",
                "type":"Land Details",
                "name":"FORMS.pdf",
                "link":"https://....HotelsFORMS.pdf"
            }
        ],
        "Miscellaneous Approvals":[
            {
                "id":604,
                "project_id":2392,
                "parent_type":
                "Miscellaneous Approvals",
                "type":"Not Reported",
                "name":"Report Part 1.pdf",
                "link":"https://...Report Part 1.pdf"
            }
        ]
    }
};

const orderedObj = { data: {} };
Object.keys(obj.data).sort().forEach(function(key) {
  orderedObj.data[key] = obj.data[key];
});

Answer 3

您需要将对 this 的引用作为 Array#forEach

sortDocs.forEach(function(key) {
    this.subscProDocument[key] = result.push(docs[key]);
}, this);

的 thisArg 来获取，或者获取箭头函数，该函数获取外部作用域的 this 。

sortDocs.forEach(key => this.subscProDocument[key] = result.push(docs[key]));