js一数组按照另一数组进行排序

有时我们需要一个数组按另一数组的顺序来进行排序，总结一下方法，同时某些场景也会用到。

首先一个数组相对简单的情况：

var arr1 = [52,23,36,11,09];
var arr2 = [23,09,11,36,52];
// 要求arr1按照arr2的顺序来排序，可以看到两个数组都不是常规的从小到大排序的

既然数组不是按数字大小来排序的，我们就不能按他们的大小来比较。虽然数字本身不能用来比较，但是我们可以换一种思路，比较位置，也就是index。

arr1.sort((a,b) => arr2.indexOf(a)-arr2.indexOf(b))
// arr1 [23,09,11,36,52]

巧用下标就可以完成排序了，这里没明白可以先了解一下sort的原理。
https://blog.csdn.net/ws9029/article/details/106734256/

如果我们遇到的数组内是对象的情况下就不能用这种方法了，比如我们可能会遇到的场景：

场景：
一个多选的select，如果不排序会按照点击的顺序生成对应的数组，需求要按原本的顺序传给后端。

<el-select
  v-model="listQuery.data"
  placeholder="选择数据"
  clearable
  multiple
  collapse-tags
>
  <el-option
    v-for="(item,index) in dataList"
    :key="index"
    :label="item.label"
    :value="item.value"
  ></el-option>
</el-select>

dataList: [
	{
    
    
	  value: 'dc033',
	  label: 'XX值'
	}, {
    
    
	  value: 'dc015',
	  label: 'AA值'
	}, {
    
    
	  value: 'dc037',
	  label: 'BB值'
	}, {
    
    
	  value: 'dc025',
	  label: 'TT值'
	}, {
    
    
	  value: 'dc028',
	  label: 'HH值'
	}, {
    
    
	  value: 'dc020',
	  label: 'FF值'
	}
]

当我们点击下拉选选项的时候，会按照点击的顺序给listQuery.data赋值，得到的就是

['dc025','dc015','dc033']

这是个无规则，无大小顺序的数组，而且原数组本身也没有大小顺序，但是后端需要我们按照元数组的正常顺序来传递，那么我们只能创造条件来排序了。

//先给原数组加个排序的条件
dataList: [
	{
    
    
	  id: 1,
	  value: 'dc033',
	  label: 'XX值'
	}, {
    
    
	  id: 2,
	  value: 'dc015',
	  label: 'AA值'
	}, {
    
    
	  id: 3,
	  value: 'dc037',
	  label: 'BB值'
	}, {
    
    
	  id: 4,
	  value: 'dc025',
	  label: 'TT值'
	}, {
    
    
	  id: 5,
	  value: 'dc028',
	  label: 'HH值'
	}, {
    
    
	  id: 6,
	  value: 'dc020',
	  label: 'FF值'
	}
]

然后我们按id来进行排序即可

this.listQuery.data.sort((a, b) => {
    
    
  let aid, bid
  this.yleftList.forEach(item => {
    
    
    if (item.value == a) aid = item.id
    if (item.value == b) bid = item.id
  })
  return aid - bid
})

这样我们巧妙利用id大小来进行升序，正好得到的是原数组的顺序