如何使用 javascript 对间接数组进行排序？

Question

在我的项目中，我需要对包含其他数组（它的项目）索引的数组进行排序。我已经搜索了很多小时，但没有找到任何人解决我的问题。var arr = [1, 4, 3, 4, 5, 6, 7, 8, 9];function sorting(){    let arr2 = [0, 1, 2, 3, 4, 5, 6, 7, 8];    //sorting code}现在，我想对 arr2 进行排序，因此当我使用此类代码（在本段下）循环遍历它时，我使用排序数组 (arr2) 中的索引访问 arr。  arr[arr2[i]]我的第一步是使用 arr2.sort(function(a,b){arr[a] - arr[b]}，但每次排序都不好。我尝试制作自己的排序函数，但我的问题留下来了。总而言之，我想对 arr2 进行排序，因此当我循环它时，我会按升序（或降序）顺序获得 arr 的值。编辑我修复了这个问题，但是出现了另一个问题，当我在 html 上应用 arr2 时，顺序混乱了。    var arr = [1, 4, 3, 4, 5, 6, 7, 8, 9];    function sorting(){        let arr2 = [0, 1, 2, 3, 4, 5, 6, 7, 8];        //The sorting block code (done)        z = document.getElementsByClassName("triable"); //this is on what I applied arr2        for (let i = 0; i < z.length; i++){            z[i].style.order = arr2[i]; //this line work, but doesn't correctly do what I what it to do        }    }对于html，我有一些带有“triable”类的div，上面的代码需要应用css样式（顺序），以便div在视觉上改变位置

Answer 1

函数任意排序

这是解决您的问题的另一种方法。假设我们有一些fruits并且任意的order我们希望对它们进行排序 -

const fruits =

  //   0        1          2        3         4 

  [ "apple", "banana", "cherry", "orange", "peach" ]

  

const order =

  [ 1, 3, 2, 0, 4 ]

我们希望能够写出这样的东西 -

fruits.sort(sortByIndex(fruits, order))

console.log(fruits)

// [ "banana", "orange", "cherry", "apple", "peach" ]

//      1         3         2         0        4

我们希望有一个Comparison模块来处理我们的排序代码 -

const { empty, map } =

  Comparison

  

const sortByIndex = (values = [], indexes = []) =>

  map(empty, x => indexes.indexOf(values.indexOf(x)))

现在我们只需要实施Comparison-

const Comparison =

  { empty: (a, b) =>

      a < b ? -1

        : a > b ? 1

          : 0

  , map: (m, f) =>

      (a, b) => m(f(a), f(b))

  }

const { empty, map } =

  Comparison

const sortByIndex = (values = [], indexes = []) =>

  map(empty, x => indexes.indexOf(values.indexOf(x)))

const fruits =

  [ "apple", "banana", "cherry", "orange", "peach" ]

  //   0        1          2        3         4 

  

const order =

  [ 1, 3, 2, 0, 4 ]

console.log(fruits)

// [ "apple", "banana", "cherry", "orange", "peach" ]

console.log(fruits.sort(sortByIndex(fruits, order)))

// [ "banana", "orange", "cherry", "apple", "peach" ]

为什么是模块？

实现一个Comparison模块意味着我们有一个整洁的地方来存储所有的比较逻辑。我们可以轻松实现其他有用的功能，例如reverse现在concat-

const Comparison =

  { // ...

  , concat: (m, n) =>

      (a, b) => Ordered.concat(m(a, b), n(a, b))

  , reverse: (m) =>

      (a, b) => m(b, a)

  }

const Ordered =

  { empty: 0

  , concat: (a, b) =>

      a === 0 ? b : a

  }

现在我们可以轻松地对复杂的排序逻辑进行建模 -

const sortByName =

  map(empty, x => x.name)

const sortByAge =

  map(empty, x => x.age)

const data =

  [ { name: 'Alicia', age: 10 }

  , { name: 'Alice', age: 15 }

  , { name: 'Alice', age: 10 }

  , { name: 'Alice', age: 16 }

  ]

排序依据name然后排序依据age-

data.sort(concat(sortByName, sortByAge))

// [ { name: 'Alice', age: 10 }

// , { name: 'Alice', age: 15 }

// , { name: 'Alice', age: 16 }

// , { name: 'Alicia', age: 10 }

// ]

排序依据age然后排序依据name-

data.sort(concat(sortByAge, sortByName))

// [ { name: 'Alice', age: 10 }

// , { name: 'Alicia', age: 10 }

// , { name: 'Alice', age: 15 }

// , { name: 'Alice', age: 16 }

// ]

并且毫不费力地reverse进行任何分类。在这里我们排序name然后反向排序age-

data.sort(concat(sortByName, reverse(sortByAge)))

// [ { name: 'Alice', age: 16 }

// , { name: 'Alice', age: 15 }

// , { name: 'Alice', age: 10 }

// , { name: 'Alicia', age: 10 }

// ]

功能原理

我们的Comparison模块灵活而可靠。这使我们能够以类似公式的方式编写排序器 -

// this...

concat(reverse(sortByName), reverse(sortByAge))

// is the same as...

reverse(concat(sortByName, sortByAge))

与concat表达式类似 -

// this...

concat(sortByYear, concat(sortByMonth, sortByDay))

// is the same as...

concat(concat(sortByYear, sortByMonth), sortByDay)

// is the same as...

nsort(sortByYear, sortByMonth, sortByDay)

发疯nsort

现在假设我们要按任意数量的因素进行排序。例如，对日期对象进行排序需要三个比较：year、month和day-

const { empty, map, reverse, nsort } =

  Comparison

const data =

  [ { year: 2020, month: 4, day: 5 }

  , { year: 2018, month: 1, day: 20 }

  , { year: 2019, month: 3, day: 14 }

  ]

const sortByDate =

  nsort

    ( map(empty, x => x.year)  // primary: sort by year

    , map(empty, x => x.month) // secondary: sort by month

    , map(empty, x => x.day)   // tertiary: sort by day

    )

现在我们可以按year, month, day-排序

data.sort(sortByDate)

// [ { year: 2019, month: 11, day: 14 }

// , { year: 2020, month: 4, day: 3 }

// , { year: 2020, month: 4, day: 5 }

// ]

并且同样可以轻松地按year, month, day-进行反向排序

data.sort(reverse(sortByDate))

// [ { year: 2020, month: 4, day: 5 }

// , { year: 2020, month: 4, day: 3 }

// , { year: 2019, month: 11, day: 14 }

// ]

由于功能原理，实现 N 排序变得轻而易举。我们concat并empty尽一切努力——

const Comparison =

  { // ...

  , nsort: (...m) =>

      m.reduce(Comparison.concat, Comparison.empty)

  }

展开下面的代码片段以查看此代码的实际效果 -

const Comparison =

  { empty: (a, b) =>

      a < b ? -1

        : a > b ? 1

          : 0

  , map: (m, f) =>

      (a, b) => m(f(a), f(b))

  , concat: (m, n) =>

      (a, b) => Ordered.concat(m(a, b), n(a, b))

  , reverse: (m) =>

      (a, b) => m(b, a)

  , nsort: (...m) =>

      m.reduce(Comparison.concat, Comparison.empty)

  }

const Ordered =

  { empty: 0

  , concat: (a, b) =>

      a === 0 ? b : a

  }

const { empty, map, concat, reverse, nsort } =

  Comparison

const sortByDate =

  nsort

    ( map(empty, x => x.year)  // primary

    , map(empty, x => x.month) // secondary

    , map(empty, x => x.day)   // tertiary

    )

const data =

  [ { year: 2020, month: 4, day: 5 }

  , { year: 2019, month: 11, day: 14 }

  , { year: 2020, month: 4, day: 3 }

  ]

console.log(data.sort(reverse(sortByDate)))

// [ { year: 2020, month: 4, day: 5 }

// , { year: 2020, month: 4, day: 3 }

// , { year: 2019, month: 11, day: 14 }

// ]

JavaScript 模块

上面Comparison和Ordered被定义为简单对象。JavaScript 是一种非常灵活的语言，并且import语法export明确可用于模块化您的程序。以这种方式编写模块可以让我们清楚地了解事情应该去哪里，并为我们提供足够的空间来扩展我们的代码 -

// Comparison.js

import { lt, gt, eq, concat:_concat } from "./Ordered"

const asc = (a, b) =>

  (console.log(a, b), a < b) ? lt

    : a > b ? gt

      : eq

const empty =

  asc

const map =  (m, f) =>

  (a, b) => m(f(a), f(b))

const concat = (m, n) =>

  (a, b) => _concat(m(a, b), n(a, b))

const reverse = (m) =>

  (a, b) => m(b, a)

const desc =

  reverse(asc)

export { asc, concat, desc, empty, map, reverse }

// Ordered.js

const lt = 

  -1

const gt =

  1

const eq =

  0

const empty =

  eq

const concat = (a, b) =>

  a === eq ? b : a

export { concat, empty, eq, gt, lt }

Answer 2

您需要返回增量。undefined否则，每次调用都会返回回调。

arr2.sort(function(a, b) {

    return arr[b] - arr[a];

});

为了添加正确的顺序，您不需要获取索引来indices寻址正确的元素并指定i为样式顺序值。

function sort() {

    var array = [1, 4, 3, 4, 5, 6, 7, 8, 9],

        z = document.getElementsByClassName("triable");

    [...array.keys()]

        .sort((a, b) => array[b] - array[a])

        .forEach((v, i) => z[v].style.order = i);

}

<button onclick="sort()">sort</button><br>

<div style="display: flex;">

<span class="triable">1</span>

<span class="triable">4</span>

<span class="triable">3</span>

<span class="triable">4</span>

<span class="triable">5</span>

<span class="triable">6</span>

<span class="triable">7</span>

<span class="triable">8</span>

<span class="triable">9</span> 

</div>

Answer 3

代码很多，但有效:)

对于 ASC 排序：

var test = [1, 4, 3, 4, 5, 6, 7, 8, 9];

console.log("Original Array: " + test);

var len = test.length;

var indices = new Array(len);

for (var i = 0; i < len; ++i) indices[i] = i;

indices.sort(function (a, b) { return test[a] < test[b] ? -1 : test[a] > test[b] ? 1 : 0; });

test.sort();

console.log("Sort-ASC " + test);

console.log("Index from Array " + indices);

对于 DESC 排序：

var test = [1, 4, 3, 4, 5, 6, 7, 8, 9];

console.log("Originales Array: " + test)

var len = test.length;

var indices = new Array(len);

for (var i = 0; i < len; ++i) indices[i] = i;

indices.sort(function (a, b) { return test[a] < test[b] ? -1 : test[a] > test[b] ? 1 : 0; });

indices.reverse();

test.sort();

test.reverse();

console.log("Sort-DESC " + test);

console.log("Index from Array " + indices);

Answer 4

使用这个 arr.sort(function(a, b){return a - b}); 很简单。// 使用 return 否则不会触发 - + 加号表示 ascndng dcndng ordee 简单方法 ..... 快乐编码