如何使用javascript对间接数组进行排序? [英] How can I sort an indirect array with javascript?

查看:72
本文介绍了如何使用javascript对间接数组进行排序?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在我的项目中,我需要对包含另一个数组(它的项)的索引的数组进行排序.我已经搜索了很多小时,但没有找到遇到问题的人.

In my project, I need to sort an array that contain index of an other array (it's item). I've search for many hours, but I did not find anyone with my problem.

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.

Now, I want to sort arr2, so when I loop through it with this kind of code (under this paragraph), I access arr with the index in the sorted array (arr2).

  arr[arr2[i]]

我的第一步是使用arr2.sort(function(a,b){arr [a]-arr [b]},但是每次排序都不理想时,我尝试创建自己的排序函数,但是我的问题仍然存在.

My first move was to use arr2.sort(function(a,b){arr[a] - arr[b]}, but each time the sort wasn't good. I attempt to make my own sorting function, but my problem stayed.

总而言之,我想对arr2进行排序,所以当我循环遍历它时,我会以升序(或降序)获得arr的值.

To summarize, I want to sort arr2 so when I loop through it, I get the value of arr in ascending (or descending) order.

编辑我解决了这个问题,但是当我在HTML上应用arr2时,另一个问题出现了.

EDIT I fixe this problem, but another appears, when I applied the arr2 on my html, the order mess up.

    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可以直观地改变位置

For html, I have some div with a class "triable" and the code above this need to applied a css style (order) so the div visually change of position

推荐答案

函数任意排序

这是解决问题的另一种方法.假设我们有一些fruits和任意的order我们希望将它们排序为-

Here's another way to approach your problem. Let's say we have some fruits and an arbitrary order we wish to sort them in -

const fruits =
  //   0        1          2        3         4 
  [ "apple", "banana", "cherry", "orange", "peach" ]


const order =
  [ 1, 3, 2, 0, 4 ]

我们希望能够编写这样的内容-

We want to be able to write something like this -

fruits.sort(sortByIndex(fruits, order))

console.log(fruits)
// [ "banana", "orange", "cherry", "apple", "peach" ]
//      1         3         2         0        4

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

We wish up a Comparison module to handle our sorting code -

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模块意味着我们有一个整齐的位置来存储我们所有的比较逻辑.我们现在可以轻松实现其他有用的功能,例如reverseconcat-

Implementing a Comparison module means we have a tidy place to store all of our comparison logic. We could easily implement other useful functions like reverse and concat now -

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
  }

现在,我们可以轻松地为复杂的排序逻辑建模-

Now we can model complex sorting logic with ease -

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-

And effortlessly reverse any sorter. Here we sort by name then reverse sort by age -

data.sort(concat(sortByName, reverse(sortByAge)))
// [ { name: 'Alice', age: 16 }
// , { name: 'Alice', age: 15 }
// , { name: 'Alice', age: 10 }
// , { name: 'Alicia', age: 10 }
// ]

功能原理

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

Our Comparison module is flexible yet reliable. This allows us to write our sorters in a formula-like way -

// this...
concat(reverse(sortByName), reverse(sortByAge))

// is the same as...
reverse(concat(sortByName, sortByAge))

并且类似地使用concat表达式-

And similarly with concat expressions -

// this...
concat(sortByYear, concat(sortByMonth, sortByDay))

// is the same as...
concat(concat(sortByYear, sortByMonth), sortByDay)

// is the same as...
nsort(sortByYear, sortByMonth, sortByDay)


nsort


go nuts with nsort

现在让我们说我们要按任意多个因素进行排序.例如,对日期对象进行排序需要进行三个比较:yearmonthday-

Now let's say we want to sort by an arbitrary number of factors. For example, sorting date objects requires three comparisons: year, month, and 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
    )

现在我们可以按yearmonthday-

data.sort(sortByDate)
// [ { year: 2019, month: 11, day: 14 }
// , { year: 2020, month: 4, day: 3 }
// , { year: 2020, month: 4, day: 5 }
// ]

和按yearmonthday-

data.sort(reverse(sortByDate))
// [ { year: 2020, month: 4, day: 5 }
// , { year: 2020, month: 4, day: 3 }
// , { year: 2019, month: 11, day: 14 }
// ]

由于功能原理,实施N-sort轻而易举.我们的concatempty做了所有艰苦的工作-

Implementing N-sort is a breeze thanks to functional principles. Our concat and empty do all the hard work -

const Comparison =
  { // ...
  , nsort: (...m) =>
      m.reduce(Comparison.concat, Comparison.empty)
  }

展开下面的代码片段,以查看运行中的此代码-

Expand the snippet below to see this code in action -

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对间接数组进行排序?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆