Javascript - 按2个属性排序对象数组

Question

我想通过2个不同的属性对对象数组进行排序.

这些是我的对象

array = [{ resVal: "25FA15", resFlow: 49, resName: "Rendimiento Tri-Seal Completo", resPhoto: "Tri-Sealseries.png", resHP: 1.5 },
 { resVal: "25FA2", resFlow: 52, resName: "Rendimiento Tri-Seal Completo", resPhoto: "Tri-Sealseries.png", resHP: 2 },
{ resVal: "45FA2", resFlow: 53, resName: "Rendimiento Hi-Cap Completo", resPhoto: "HighCapseries.png", resHP: 2 },
{ resVal: "35FA2", resFlow: 59, resName: "Rendimiento Hi-Cap Completo", resPhoto: "HighCapseries.png", resHP: 2 }]

我想通过更高的"resFlow"值对数组进行排序,但是具有最低的"resHP"值.

我想把我的数组放到这样:

array = [{ resVal: "25FA15", resFlow: 49, resName: "Rendimiento Tri-Seal Completo", resPhoto: "Tri-Sealseries.png", resHP: 1.5 },
{ resVal: "35FA2", resFlow: 59, resName: "Rendimiento Hi-Cap Completo", resPhoto: "HighCapseries.png", resHP: 2 },
{ resVal: "45FA2", resFlow: 53, resName: "Rendimiento Hi-Cap Completo", resPhoto: "HighCapseries.png", resHP: 2 },
 { resVal: "25FA2", resFlow: 52, resName: "Rendimiento Tri-Seal Completo", resPhoto: "Tri-Sealseries.png", resHP: 2 }]

希望可以有人帮帮我.

谢谢.

Answer 1

您可以对指定的键顺序及其排序顺序使用链式方法.

数组按属性排序

• resHP,升序和
• resFlow,下降.

它适用于计算delta,这反映了两个对象的关系.如果该值为零,则两个值相等,并计算并返回下一个增量.

var array = [{ resVal: "25FA15", resFlow: 49, resName: "Rendimiento Tri-Seal Completo", resPhoto: "Tri-Sealseries.png", resHP: 1.5 }, { resVal: "25FA2", resFlow: 52, resName: "Rendimiento Tri-Seal Completo", resPhoto: "Tri-Sealseries.png", resHP: 2 }, { resVal: "45FA2", resFlow: 53, resName: "Rendimiento Hi-Cap Completo", resPhoto: "HighCapseries.png", resHP: 2 }, { resVal: "35FA2", resFlow: 59, resName: "Rendimiento Hi-Cap Completo", resPhoto: "HighCapseries.png", resHP: 2 }];

array.sort(function (a, b) {
    return a.resHP - b.resHP || b.resFlow - a.resFlow;
});

console.log(array);

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

Answer 2

要求是按resHP属性升序排序，然后对于任何关系，按属性降序排序resFlow。

现在，Javascript 的Array.prototype.sort函数允许我们对数组进行排序。它接受一个参数，即“compareFunction”。CompareFunction 接受两个参数，它们是要比较的数组的元素，并且它必须返回它们在预期结果数组中的相对位置。

function compareFunction (itemA, itemB) {...}

compareFunction(a, b)如果出现在结果之前，则返回大于零的数值。ba

compareFunction(a, b)如果在结果中位于后面，则返回小于零的数值。ba

compareFunction(a, b)在对数组进行排序时，如果和被认为在相对顺序方面等效，则返回零。例如，虽然对两个 5 进行排序时被认为是等效的，因此数组在调用时应返回 0。ab[5, 3, 5]compareFunction(5,5)

对于对字符串进行排序，compareFunction不需要提供 a。根据规范，当未提供compareFunction时，数组中的每个值都会转换为字符串，然后进行排序。这是一个例子：

function compareFunction (itemA, itemB) {...}

常见错误：

不使用compareFunction比较数字

尽管compareFunction在规范中是可选的，但如果在对数字或其他对象进行排序时未提供它，则可能会导致不正确的结果。考虑下面的例子：

console.log('["z", "ct", "a", "aa", "ab", "bc"].sort(): ', ["z", "ct", "a", "aa", "ab", "bc"].sort());

这里 20 出现在 3 之前，因为每个数字在比较之前都被转换为字符串，并且由于“20”在字典中出现在“3”之前（如果有这样的字典），因此它在结果中出现在“3”之上。

从compareFunction返回布尔值而不是数值

_{这是我在原来答案中的错误。}

当您从compareFunction 返回布尔值而不是数字时，布尔值将转换为数字。意义true会变成1，false也会变成0，但你不会返回-1。

console.log("[1, 2, 5, 3, 0, 20].sort(): ", [1, 2, 5, 3, 0, 20].sort());

这里的结果是未排序的、相同的数组，因为当 2 和 -1 比较时，比较 2 > -1 返回 false，转换为 0。但是当compareFunction 返回 0 时，表示两个元素的顺序保持不变。因此数组没有排序。

对该数组进行排序的正确方法是：

var array = [
  {
    compareThis: 1,
    originalIndex: 1
  },
  {
    compareThis: 2,
    originalIndex: 2
  },
  {
    compareThis: -1,
    originalIndex: 3
  },
  {
    compareThis: -2,
    originalIndex: 4
  }
];

console.log(array.sort((a, b) => a.compareThis > b.compareThis));

因此，解决问题中提出的问题的正确方法是：

var array = [
  {
    compareThis: 1,
    originalIndex: 1
  },
  {
    compareThis: 2,
    originalIndex: 2
  },
  {
    compareThis: -1,
    originalIndex: 3
  },
  {
    compareThis: -2,
    originalIndex: 4
  }
];

console.log(array.sort((a, b) => a.compareThis - b.compareThis));

当然，这可以进一步缩短，如其他答案所示。我保留了比较函数的较长版本，以使其更易于阅读。

原始（错误）答案

你可以用Array#sort这个：

array = [{ resVal: "25FA15", resFlow: 49, resName: "Rendimiento Tri-Seal Completo", resPhoto: "Tri-Sealseries.png", resHP: 1.5 },
 { resVal: "25FA2", resFlow: 52, resName: "Rendimiento Tri-Seal Completo", resPhoto: "Tri-Sealseries.png", resHP: 2 },
{ resVal: "45FA2", resFlow: 53, resName: "Rendimiento Hi-Cap Completo", resPhoto: "HighCapseries.png", resHP: 2 },
{ resVal: "35FA2", resFlow: 59, resName: "Rendimiento Hi-Cap Completo", resPhoto: "HighCapseries.png", resHP: 2 }]


array.sort(function(d1,d2) {
  if(d1.resHP == d2.resHP) {
    return d1.resFlow < d2.resFlow;
  } else {
    return d1.resHP > d2.resHP;
  }
});

console.log(array);