javascript 自己实现数字\字母和中文的混合排序方法 by FungLeo

版权声明：本文为 FengCms FungLeo 原创文章，未经 FungLeo 允许不得转载。

目录(?)[+]

javascript 自己实现数字\字母和中文的混合排序方法(纯粹研究,不实用)

前言

在上一篇博文《javascript 数组排序sort方法和自我实现排序方法的学习小结》中,我用自己的方法实现了数字数组的排序.

当然,实际运用中,我还是会使用sort方法更加方便.但是,我上一篇博文,仅仅是实现了数字排序,而srot方法默认可是能给字母实现排序的哦!而我的代码只能排序数字,看起来还是弱弱的.

所以,我得加上能排字母甚至中文的排序方法.

实现代码

<code class="language-javascript hljs  has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;">$(<span class="hljs-function" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">function</span><span class="hljs-params" style="color: rgb(102, 0, 102); box-sizing: border-box;">()</span>{</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> arr = [<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"Jack"</span>,<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"Book"</span>,<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"Fung"</span>,<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">76</span>,<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"Love"</span>,<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"Mark"</span>,<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"中国"</span>,<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"china"</span>,<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"phone"</span>,<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"刘德华"</span>];
    console.log(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'原数组'</span>);
    console.log(arr);
    console.log(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'for方法从小到大排序'</span>);
    console.log(arrSortMinToMax(arr));
    console.log(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'for方法从大到小排序'</span>);
    console.log(arrSortMaxToMin(arr));
    console.log(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'原数组'</span>);
    console.log(arr);
});

<span class="hljs-function" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">function</span> <span class="hljs-title" style="box-sizing: border-box;">arrMinNum</span><span class="hljs-params" style="color: rgb(102, 0, 102); box-sizing: border-box;">(arr)</span>{</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> minNum = <span class="hljs-literal" style="color: rgb(0, 102, 102); box-sizing: border-box;">Infinity</span>, index = -<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1</span>,minVul = <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">""</span>;
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">for</span> (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> i = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>; i < arr.length; i++) {
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span> (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">typeof</span>(arr[i]) == <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"string"</span>) {
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span> (arr[i].charCodeAt()<minNum) {
                minNum = arr[i].charCodeAt();
                minVul = arr[i];
                index = i;
            }
        }<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">else</span> {
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span> (arr[i]<minNum) {
                minNum = arr[i];
                minVul = arr[i]
                index = i;
            }
        }
    };
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">return</span> {<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"minNum"</span>:minVul,<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"index"</span>:index};
}
<span class="hljs-function" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">function</span> <span class="hljs-title" style="box-sizing: border-box;">arrSortMinToMax</span><span class="hljs-params" style="color: rgb(102, 0, 102); box-sizing: border-box;">(arr)</span>{</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> arrNew = [];
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> arrOld = arr.concat();
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">for</span> (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> i = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>; i < arr.length; i++) {
        arrNew.push(arrMinNum(arrOld).minNum);
        arrOld.splice(arrMinNum(arrOld).index,<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1</span>)
    };
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">return</span> (arrNew);
}
<span class="hljs-function" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">function</span> <span class="hljs-title" style="box-sizing: border-box;">arrMaxNum</span><span class="hljs-params" style="color: rgb(102, 0, 102); box-sizing: border-box;">(arr)</span>{</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> maxNum = -<span class="hljs-literal" style="color: rgb(0, 102, 102); box-sizing: border-box;">Infinity</span>, index = -<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1</span>,maxVul = <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">""</span>;
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">for</span> (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> i = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>; i < arr.length; i++) {
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span> (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">typeof</span>(arr[i]) == <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"string"</span>) {
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span> (arr[i].charCodeAt()>maxNum) {
                maxNum = arr[i].charCodeAt();
                maxVul = arr[i];
                index = i;
            }
        }<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">else</span> {
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span> (arr[i]>maxNum) {
                maxNum = arr[i];
                maxVul = arr[i];
                index = i;
            }
        }
    };
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">return</span> {<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"maxNum"</span>:maxVul,<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"index"</span>:index};
}
<span class="hljs-function" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">function</span> <span class="hljs-title" style="box-sizing: border-box;">arrSortMaxToMin</span><span class="hljs-params" style="color: rgb(102, 0, 102); box-sizing: border-box;">(arr)</span>{</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> arrNew = [];
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> arrOld = arr.slice(<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>);
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">for</span> (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">var</span> i = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>; i < arr.length; i++) {
        arrNew.push(arrMaxNum(arrOld).maxNum);
        arrOld.splice(arrMaxNum(arrOld).index,<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1</span>);
    };
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">return</span> (arrNew);
}</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li><li style="box-sizing: border-box; padding: 0px 5px;">9</li><li style="box-sizing: border-box; padding: 0px 5px;">10</li><li style="box-sizing: border-box; padding: 0px 5px;">11</li><li style="box-sizing: border-box; padding: 0px 5px;">12</li><li style="box-sizing: border-box; padding: 0px 5px;">13</li><li style="box-sizing: border-box; padding: 0px 5px;">14</li><li style="box-sizing: border-box; padding: 0px 5px;">15</li><li style="box-sizing: border-box; padding: 0px 5px;">16</li><li style="box-sizing: border-box; padding: 0px 5px;">17</li><li style="box-sizing: border-box; padding: 0px 5px;">18</li><li style="box-sizing: border-box; padding: 0px 5px;">19</li><li style="box-sizing: border-box; padding: 0px 5px;">20</li><li style="box-sizing: border-box; padding: 0px 5px;">21</li><li style="box-sizing: border-box; padding: 0px 5px;">22</li><li style="box-sizing: border-box; padding: 0px 5px;">23</li><li style="box-sizing: border-box; padding: 0px 5px;">24</li><li style="box-sizing: border-box; padding: 0px 5px;">25</li><li style="box-sizing: border-box; padding: 0px 5px;">26</li><li style="box-sizing: border-box; padding: 0px 5px;">27</li><li style="box-sizing: border-box; padding: 0px 5px;">28</li><li style="box-sizing: border-box; padding: 0px 5px;">29</li><li style="box-sizing: border-box; padding: 0px 5px;">30</li><li style="box-sizing: border-box; padding: 0px 5px;">31</li><li style="box-sizing: border-box; padding: 0px 5px;">32</li><li style="box-sizing: border-box; padding: 0px 5px;">33</li><li style="box-sizing: border-box; padding: 0px 5px;">34</li><li style="box-sizing: border-box; padding: 0px 5px;">35</li><li style="box-sizing: border-box; padding: 0px 5px;">36</li><li style="box-sizing: border-box; padding: 0px 5px;">37</li><li style="box-sizing: border-box; padding: 0px 5px;">38</li><li style="box-sizing: border-box; padding: 0px 5px;">39</li><li style="box-sizing: border-box; padding: 0px 5px;">40</li><li style="box-sizing: border-box; padding: 0px 5px;">41</li><li style="box-sizing: border-box; padding: 0px 5px;">42</li><li style="box-sizing: border-box; padding: 0px 5px;">43</li><li style="box-sizing: border-box; padding: 0px 5px;">44</li><li style="box-sizing: border-box; padding: 0px 5px;">45</li><li style="box-sizing: border-box; padding: 0px 5px;">46</li><li style="box-sizing: border-box; padding: 0px 5px;">47</li><li style="box-sizing: border-box; padding: 0px 5px;">48</li><li style="box-sizing: border-box; padding: 0px 5px;">49</li><li style="box-sizing: border-box; padding: 0px 5px;">50</li><li style="box-sizing: border-box; padding: 0px 5px;">51</li><li style="box-sizing: border-box; padding: 0px 5px;">52</li><li style="box-sizing: border-box; padding: 0px 5px;">53</li><li style="box-sizing: border-box; padding: 0px 5px;">54</li><li style="box-sizing: border-box; padding: 0px 5px;">55</li><li style="box-sizing: border-box; padding: 0px 5px;">56</li><li style="box-sizing: border-box; padding: 0px 5px;">57</li><li style="box-sizing: border-box; padding: 0px 5px;">58</li><li style="box-sizing: border-box; padding: 0px 5px;">59</li><li style="box-sizing: border-box; padding: 0px 5px;">60</li><li style="box-sizing: border-box; padding: 0px 5px;">61</li><li style="box-sizing: border-box; padding: 0px 5px;">62</li><li style="box-sizing: border-box; padding: 0px 5px;">63</li><li style="box-sizing: border-box; padding: 0px 5px;">64</li><li style="box-sizing: border-box; padding: 0px 5px;">65</li><li style="box-sizing: border-box; padding: 0px 5px;">66</li><li style="box-sizing: border-box; padding: 0px 5px;">67</li><li style="box-sizing: border-box; padding: 0px 5px;">68</li></ul>

运行截图如下:

排序原理

1. 如果是数字,则直接是数字进行比对
2. 如果是字符串,则使用charCodeAt()转换成Unicode编码进行排序.
3. Unicode 是 0 - 65535 之间的整数

其他说明

1. 按照正常的排序逻辑,应该是:数字比一切字母都小,字母比一切中文都小,中文应该按照首字拼音的首字母排序.
2. 我的这段代码除了字母比一切中文都小这一条实现了,其他都没有实现.
3. 逻辑也应该可以实现,把数字字母中文分别找出来,数字跟数组进行比较,字母跟字母比较,中文跟中文比较,然后拼接数组
4. 中文获取首字的首字母可能稍微麻烦一点.

汉字居然可以直接比对的.

如上图所示,张飞想要做老大是有道理的.javascript终于在千年之后为张飞正名,当年他就应该是做老大的!~

本文由FungLeo原创,允许转载.但转载必须署名作者,并保留文章首发链接.否则将追究法律责任. 
首发地址:http://blog.csdn.net/FungLeo/article/details/51583344