blocks|key|4317704|text|不过，reduce并不是用于排序的理想方法。下面的解决方案就像一个forEach或任何循环函数，试图通过Array.reduce函数来实现。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4317705|​|4317706|var+arr+=+[91,4,6,24,8,7,59,3,13,0,11,98,54,23,52,87,4];

arr+=+arr.reduce(function(acc,val){
++
++if(acc.length)+{
++++var+temp+=+[];
++++while(acc[acc.length+-1]+>+val)+{
++++++temp.push(acc.pop());
++++}+
++++acc.push(val);
++++while(temp.length)+{
++++++acc.push(temp.pop());
++++}
++}+else+{
++++acc.push(val);++
++}
++return+acc;
++
},+[]);

console.log(arr);|code-block|syntax|javascript|4317707|4317708|请注意，您可以使用本机函数Array.sort进行排序，也可以拥有自己的自定义排序函数，您可以在其中定义自己的排序算法。|4317709|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort^0|X|7|1G|C|0|0|0|0|D|A|0|0^^$0|@$1|2|3|4|5|6|7|X|8|@$9|Y|A|Z|B|C]|$9|10|A|11|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|12|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|13|8|@]|D|@]|E|$K|L]]|$1|M|3|G|5|6|7|14|8|@]|D|@]|E|$]]|$1|N|3|O|5|6|7|15|8|@]|D|@$9|16|A|17|1|18]]|E|$]]|$1|P|3|-4|5|6|7|19|8|@]|D|@]|E|$]]]|Q|$R|$5|S|T|U|E|$V|W]]]]

<p>Though, reduce is not ideally meant for the sorting. The following solution is just like a <code>forEach</code> or any loop function trying to be achieved with <code>Array.reduce</code> function.</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>var arr = [91,4,6,24,8,7,59,3,13,0,11,98,54,23,52,87,4];

arr = arr.reduce(function(acc,val){
  
  if(acc.length) {
    var temp = [];
    while(acc[acc.length -1] &gt; val) {
      temp.push(acc.pop());
    } 
    acc.push(val);
    while(temp.length) {
      acc.push(temp.pop());
    }
  } else {
    acc.push(val);  
  }
  return acc;
  
}, []);

console.log(arr);</code></pre>
</div>
</div>
</p>

<p>Please note, you can use the native function <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort" rel="nofollow noreferrer">Array.sort</a> for sorting and can also have your own custom sort function where you can define your own sorting algorithm.</p>


blocks|key|4317769|text|在使用Array.reduce鼓励使用纯函数的情况下，Array.sort会改变数组。你可以在排序前克隆数组。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4317770|我相信这个问题的目的是通过强制约束来让你有不同的想法。它测试你对reduce如何工作的了解，正如答案所示，有许多方法可以给猫剥皮。它将展示您在解决此问题时的js个人风格。|4317771|我选择使用Array.findIndex和Array.splice。|4317772|const+sortingReducer+=+(accumulator,+value)+=>+{
++const+nextIndex+=+accumulator.findIndex(i+=>+value+<+i+);
++const+index+=+nextIndex+>+-1+?+nextIndex+:+accumulator.length;
++accumulator.splice(index,+0,+value);
++return+accumulator;
}

const+input+=+[5,4,9,1];
const+output+=+input.reduce(sortingReducer,+[]);|code-block|syntax|javascript|4317773|使用样本输入结果进行测试|4317774|arr.reduce(sortingReducer,+[])
//+(17) [0,+3,+4,+4,+6,+7,+8,+11,+13,+23,+24,+52,+54,+59,+87,+91,+98]|4317775|entityMap^0|3|C|R|A|0|W|6|0|5|F|L|C|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@$9|V|A|W|B|C]|$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|Z|8|@$9|10|A|11|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|12|8|@$9|13|A|14|B|C]|$9|15|A|16|B|C]]|D|@]|E|$]]|$1|J|3|K|5|L|7|17|8|@]|D|@]|E|$M|N]]|$1|O|3|P|5|6|7|18|8|@]|D|@]|E|$]]|$1|Q|3|R|5|L|7|19|8|@]|D|@]|E|$M|N]]|$1|S|3|-4|5|6|7|1A|8|@]|D|@]|E|$]]]|T|$]]

<p><code>Array.sort</code> mutates the array where using <code>Array.reduce</code> encourages a pure function. You could clone the array before sorting. </p>

<p>I believe this question is designed to get you thinking differently by enforcing constraints. It tests your knowledge of how <code>reduce</code> works and as the answers show there are many ways to skin a cat. It'll show your personal flavour of js in solving this.</p>

<p>I chose to use <code>Array.findIndex</code> and <code>Array.splice</code>.</p>

<pre><code>const sortingReducer = (accumulator, value) =&gt; {
  const nextIndex = accumulator.findIndex(i =&gt; value &lt; i );
  const index = nextIndex &gt; -1 ? nextIndex : accumulator.length;
  accumulator.splice(index, 0, value);
  return accumulator;
}

const input = [5,4,9,1];
const output = input.reduce(sortingReducer, []);
</code></pre>

<p>Testing with the sample input produces </p>

<pre><code>arr.reduce(sortingReducer, [])
// (17) [0, 3, 4, 4, 6, 7, 8, 11, 13, 23, 24, 52, 54, 59, 87, 91, 98]
</code></pre>


blocks|key|4317821|text|如果没有提供数组，您可以使用一些函数来获取数组，通过接受两个参数来返回已排序数组的函数，以及通过使用另一个reduce方法来获取已排序数组的部分结果的排序回调。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4317822|​|4317823|const
++++getArray+=+a+=>+Array.isArray(a)+?+a+:+[a],
++++order+=+(a,+b)+=>+a+<+b+?+[a,+b]+:+[b,+a],
++++sort+=+(a,+b)+=>+getArray(a).reduce((r,+v)+=>+r.concat(order(r.pop(),+v)),+[b]),
++++array+=+[91,+4,+6,+24,+8,+7,+59,+3,+13,+0,+11,+98,+54,+23,+52,+87,+4];

console.log(array.reduce(sort));|code-block|syntax|javascript|4317824|.as-console-wrapper+{+max-height:+100%25+!important;+top:+0;+}|4317825|4317826|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|P|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|K|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|M|$]]

<p>You could use some functions for getting an array if not an array is supplied, a function which returns a sorted array by taking two parameters and a sort callback which includes the above by using another reduce method for getting a part result of a sorted array.</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>const
    getArray = a =&gt; Array.isArray(a) ? a : [a],
    order = (a, b) =&gt; a &lt; b ? [a, b] : [b, a],
    sort = (a, b) =&gt; getArray(a).reduce((r, v) =&gt; r.concat(order(r.pop(), v)), [b]),
    array = [91, 4, 6, 24, 8, 7, 59, 3, 13, 0, 11, 98, 54, 23, 52, 87, 4];

console.log(array.reduce(sort));</code></pre>
<pre class="snippet-code-css lang-css prettyprint-override"><code>.as-console-wrapper { max-height: 100% !important; top: 0; }</code></pre>
</div>
</div>
</p>


blocks|key|4317873|text|下面是一个(国际海事组织)更优雅的Jonas+W's插入排序解决方案。回调只是构建了一个包含所有较低值、新值和所有较高值的新数组。避免使用显式循环或索引，因此很容易一目了然地看到它是正确工作的。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4317874|​|4317875|const+insertValue+=+(arr,+value)+=>
++[...arr.filter(n+=>+n+<=+value),+value,+...arr.filter(n+=>+n+>+value)]

const+testArr+=+[91,+4,+6,+24,+8,+7,+59,+3,+13,+0,+11,+98,+54,+23,+52,+87,+4]

console.log(testArr.reduce(insertValue,+[]))|code-block|syntax|javascript|4317876|4317877|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/a/50246094/7126740^0|H|9|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@]|9|@$A|U|B|V|1|W]]|C|$]]|$1|D|3|E|5|6|7|X|8|@]|9|@]|C|$]]|$1|F|3|G|5|H|7|Y|8|@]|9|@]|C|$I|J]]|$1|K|3|E|5|6|7|Z|8|@]|9|@]|C|$]]|$1|L|3|-4|5|6|7|10|8|@]|9|@]|C|$]]]|M|$N|$5|O|P|Q|C|$R|S]]]]

<p>Here's an (imo) more elegant version of <a href="https://stackoverflow.com/a/50246094/7126740">Jonas W's</a> insertion sort solution. The callback just builds a new array of all lower values, the new one and all higher values. Avoids using explicit loops or indices, so it's easier to see at a glance that it works correctly.</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>const insertValue = (arr, value) =&gt;
  [...arr.filter(n =&gt; n &lt;= value), value, ...arr.filter(n =&gt; n &gt; value)]

const testArr = [91, 4, 6, 24, 8, 7, 59, 3, 13, 0, 11, 98, 54, 23, 52, 87, 4]

console.log(testArr.reduce(insertValue, []))</code></pre>
</div>
</div>
</p>


blocks|key|4317932|text|您可以使用插入排序：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4317933|​|4317934|let+array++++++++=+[91,+4,+6,+24,+8,+7,+59,+3,+13,+0,+11,+98,+54,+23,+52,+87,+4];
let+countIfLess++=+(array,v)=>+array.reduce((c,n)=>n<v?c%2B1:c,0);
let+countIfEqual+=+(array,v)=>+array.reduce((c,n)=>n==v?c%2B1:c,0);

console.log(
++array.reduce(
++++(a,v,i,array)=>(+a[countIfLess(array,v)+%2B+countIfEqual(a,v)]=v,+a+),
++++new+Array(array.length)
++)
);|code-block|syntax|javascript|4317935|4317936|这将创建一次目标数组，然后在reduce的每个步骤中对其执行插入操作，而不必重新创建目标数组。|4317937|有更有效的方法来实现countIfEqual，但我选择使用reduce而不是其他数组函数来实现所有函数。|offset|length|style|CODE|4317938|entityMap^0|0|0|0|0|0|A|C|T|6|0^^$0|@$1|2|3|4|5|6|7|T|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|U|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|V|8|@]|9|@]|A|$G|H]]|$1|I|3|C|5|6|7|W|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|X|8|@]|9|@]|A|$]]|$1|L|3|M|5|6|7|Y|8|@$N|Z|O|10|P|Q]|$N|11|O|12|P|Q]]|9|@]|A|$]]|$1|R|3|-4|5|6|7|13|8|@]|9|@]|A|$]]]|S|$]]

<p>You can use an insertion sort:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>let array        = [91, 4, 6, 24, 8, 7, 59, 3, 13, 0, 11, 98, 54, 23, 52, 87, 4];
let countIfLess  = (array,v)=&gt; array.reduce((c,n)=&gt;n&lt;v?c+1:c,0);
let countIfEqual = (array,v)=&gt; array.reduce((c,n)=&gt;n==v?c+1:c,0);

console.log(
  array.reduce(
    (a,v,i,array)=&gt;( a[countIfLess(array,v) + countIfEqual(a,v)]=v, a ),
    new Array(array.length)
  )
);</code></pre>
</div>
</div>
</p>

<p>This will create the destination array once and then perform insertions into it at each step of the reduce without having to recreate the destination array.</p>

<p>There are more efficient ways of implementing <code>countIfEqual</code> but I chose to implement all the functions using <code>reduce</code> rather than other array functions.</p>


blocks|key|4317975|text|一个糟糕的排序算法可以用ES6在一行程序中编写：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4317976|const+sorter+=+(xs,+x)+=>+xs.slice(-1)[0]+>=+x+?+[x,+...xs]+:+[...xs,+x];|code-block|syntax|javascript|4317977|如果当前元素大于或等于先前排序列表的最后一个元素，则将其追加到末尾，否则追加到开头。|4317978|[3,4,1].reduce(sorter,[]).reduce(sorter,[])

//returns+[1,3,4]|4317979|除了最简单的数组之外，它需要几个应用程序才能对任何东西进行排序。|4317980|但它最终还是会实现的。这需要一个递归！|4317981|​|4317982|const+arr+=+[91,4,6,24,8,7,59,3,13,0,11,98,54,23,52,87,4];

const+sorter2+=(as)+=>+as.reduce(
++(xs,+x)+=>+x+>=+xs.slice(-1)[0]+?+[...xs,+x]+
++++:+xs[0]+<+x+?+sorter2([x,+...xs])
++++:+[x,+...xs],
++[],
);

const+result+=+sorter2(arr);

console.log(result.join(',+'));|4317983|4317984|当当前值大于已处理数组的最后一个值时，将追加该值。如果它小于第一个元素，则将其放在前面。仅当它既不在之前也不在之后时，当前值和累加数组将通过递归调用再次排序。该方法应该等同于插入排序(请注释！)。|4317985|entityMap^0|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|X|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|Y|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Z|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|10|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|11|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|12|8|@]|9|@]|A|$]]|$1|O|3|P|5|6|7|13|8|@]|9|@]|A|$]]|$1|Q|3|R|5|D|7|14|8|@]|9|@]|A|$E|F]]|$1|S|3|P|5|6|7|15|8|@]|9|@]|A|$]]|$1|T|3|U|5|6|7|16|8|@]|9|@]|A|$]]|$1|V|3|-4|5|6|7|17|8|@]|9|@]|A|$]]]|W|$]]

<p>A terrible sorting algorithm can be written in a one liner with ES6:</p>

<pre><code>const sorter = (xs, x) =&gt; xs.slice(-1)[0] &gt;= x ? [x, ...xs] : [...xs, x];
</code></pre>

<p>If the present element is larger or equal the last element of the previously sorted list it is appended to the end, otherwise to the beginning.</p>

<pre><code>[3,4,1].reduce(sorter,[]).reduce(sorter,[])

//returns [1,3,4]
</code></pre>

<p>It takes several applications to its return to sort anything but the most simple arrays.</p>

<p>But it will eventually get there. That calls for a recursion!</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>const arr = [91,4,6,24,8,7,59,3,13,0,11,98,54,23,52,87,4];

const sorter2 =(as) =&gt; as.reduce(
  (xs, x) =&gt; x &gt;= xs.slice(-1)[0] ? [...xs, x] 
    : xs[0] &lt; x ? sorter2([x, ...xs])
    : [x, ...xs],
  [],
);

const result = sorter2(arr);

console.log(result.join(', '));</code></pre>
</div>
</div>
</p>

<p>When the present value is larger than the last value of already processed array it is appended. If it is smaller than the first element it is prepended. Only if it is neither before or after the the present value and the accumulated array are sorted again by a recursive call. The method should be equivalent to an insertion sort (please comment!).</p>


<p>Often I  study some <code>JavaScript</code> interview questions, suddenly I saw a question about usage of <code>reduce</code> function for sorting an <code>Array</code>, I read about it in <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce" rel="nofollow noreferrer">MDN</a> and the usage of it in some <code>medium</code> articles, But sorting an <code>Array</code> is so Innovative:</p>

<pre><code>const arr = [91,4,6,24,8,7,59,3,13,0,11,98,54,23,52,87,4];
</code></pre>

<p>I thought a lot, but I've no idea about how answer this question, how must be the <code>reduce</code> <code>call back</code> function? what is the <code>initialValue</code> of <code>reduce</code> function? And what are the <code>accumulator</code> and <code>currentValue</code> of <code>call back</code> function of <code>reduce</code>?</p>

<p>And at the end, does this way have some benefits than other sorting algorithms? Or Is it useful to improve other algorithms?</p>


Sorting Array with JavaScript reduce function

我经常研究一些JavaScript面试问题，突然我看到了一个关于使用reduce函数对Array进行排序的问题，我在上读到了它，在一些medium文章中也看到了它的用法，但对Array进行排序是如此创新：const arr = [91,4,6,24,8,7,59,3,13,0,11,98,54,23,52,87,4];...

问使用JavaScript reduce函数的排序数组
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用JavaScript reduce函数的排序数组EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用JavaScript reduce函数的排序数组
EN