如何按波斯字母排序列表?

时间:2019-06-06 09:14:59

标签: javascript jquery

如何阅读ul中的testArrray并对列表进行排序?

lis.sort(function(a,b))支持英语/阿拉伯语和字母,而不支持波斯字母。请帮帮我。谢谢

var alphabets = ["ا", "ب", "پ", "ت", "ث", "ج", "چ", "ح", "خ", "د", "ذ", "ر", "ز", "ژ", "س", "ش", "ص", "ض", "ط", "ظ", "ع", "غ", "ف", "ق",
  "ک", "گ", "ل", "م", "ن", "و", "ه", "ی", "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"
];
var testArrray = ["ی", "گ", "ژ", "پ"];

var aChar;
var bChar;

function OrderFunc() {
  testArrray.sort(function(a, b) {
    return CharCompare(a, b, 0);
  });
  document.getElementById("result").innerHTML = testArrray;;
}

function CharCompare(a, b, index) {
  if (index == a.length || index == b.length)
    return 0;
    
  aChar = alphabets.indexOf(a.toUpperCase().charAt(index));
  bChar = alphabets.indexOf(b.toUpperCase().charAt(index));
  
  if (aChar != bChar)
    return aChar - bChar
  else
    return CharCompare(a, b, index + 1)
}
<html>
<head></head>
<body onload="OrderFunc()">
  <div id="result"></div>
  <ul class="myul">
    <li>ی</li>
    <li>پ</li>
    <li>گ</li>
    <li>ژ</li>
  </ul>
</body>
</html>

6 个答案:

答案 0 :(得分:2)

String#localeCompare应该是语言环境感知的,并且可以适当地比较字符串,因此:

function OrderFunc() {
  // Get the list
  const ul = document.querySelector(".myul");
  // Get its items as an array
  const lis = [...ul.querySelectorAll("li")];
  // Sort the array with localeCompare
  lis.sort((a, b) => a.textContent.localeCompare(b.textContent));
  // Move each of them to the end of the list; this
  // puts them back in order
  for (const li of lis) {
    ul.appendChild(li);
  }
}

实时示例:

function OrderFunc() {
    // Get the list
    const ul = document.querySelector(".myul");
    // Get its items as an array
    const lis = [...ul.querySelectorAll("li")];
    // Sort the array with localeCompare
    lis.sort((a, b) => a.textContent.localeCompare(b.textContent));
    // Move each of them to the end of the list; this
    // puts them back in order
    for (const li of lis) {
        ul.appendChild(li);
    }
}
OrderFunc();
<div id="result"></div>
<ul class="myul">
<li>ی</li>
<li>پ</li>
<li>گ</li>
<li>ژ</li>
</ul>

您可能需要将一些选项传递给localeCompare,有关更多信息,请参见ECMAScript® Internationalization API Specification


在您询问的评论中:

  

我将首先使用波斯语和第二个英语单词吗?

如果您要问如何在列表中将波斯语单词排在英语单词的上方,我想您可能必须检测文字所写的脚本。应该可以使用JavaScript正则表达式来做到这一点,但是该功能(Unicode属性摘录)是新功能,尚未得到很好的支持。不过,您可以使用XRegExp library来做到这一点

// This checks to see if the FULL string is in Arabic script; you'll
// probably have to adjust it to fix your use case
const rexArabic = XRegExp("^\\p{Arabic}+$");
function OrderFunc() {
    // Get the list
    const ul = document.querySelector(".myul");
    // Get its items as an array
    const lis = [...ul.querySelectorAll("li")];
    // Sort the array with localeCompare
    lis.sort(({textContent: a}, {textContent: b}) => {
        const aArabicScript = rexArabic.test(a);
        const bArabicScript = rexArabic.test(b);
        if (aArabicScript && !bArabicScript) {
            // `a` is in Arabic script, `b` isn't; `a` should be first
            return -1;
        }
        if (!aArabicScript && bArabicScript) {
            // `b` is in Arabic script, `a` isn't; `b` should be first
            return 1;
        }
        // They're in the same script
        return a.localeCompare(b);
    });
    // Move each of them to the end of the list; this
    // puts them back in order
    for (const li of lis) {
        ul.appendChild(li);
    }
}

实时示例:

// This checks to see if the FULL string is in Arabic script; you'll
// probably have to adjust it to fix your use case
const rexArabic = XRegExp("^\\p{Arabic}+$");
function OrderFunc() {
    // Get the list
    const ul = document.querySelector(".myul");
    // Get its items as an array
    const lis = [...ul.querySelectorAll("li")];
    // Sort the array with localeCompare
    lis.sort(({textContent: a}, {textContent: b}) => {
        const aArabicScript = rexArabic.test(a);
        const bArabicScript = rexArabic.test(b);
        if (aArabicScript && !bArabicScript) {
            // `a` is in Arabic script, `b` isn't; `a` should be first
            return -1;
        }
        if (!aArabicScript && bArabicScript) {
            // `b` is in Arabic script, `a` isn't; `b` should be first
            return 1;
        }
        // They're in the same script
        return a.localeCompare(b);
    });
    // Move each of them to the end of the list; this
    // puts them back in order
    for (const li of lis) {
        ul.appendChild(li);
    }
}
OrderFunc();
<div id="result"></div>
<ul class="myul">
<li>ی</li>
<li>پ</li>
<li>Some English</li>
<li>گ</li>
<li>More English</li>
<li>ژ</li>
</ul>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xregexp/3.2.0/xregexp-all.min.js"></script>

答案 1 :(得分:2)

要在Persion中按字母顺序对列表进行排序,我将此代码与<meta charset="utf-8">一起使用,其结果是完美的:

const myList = ["ی","گ","پ", "ژ"];
const collator = new Intl.Collator('fa');  
const sortedLetters = myList.sort(collator.compare);  
console.log(sortedLetters);

Intl.Collat​​or对象启用对语言敏感的字符串比较。

对于其他语言,您可以替换fa:

ar — Arabic
bg — Bulgarian
ca — Catalan
zh-Hans — Chinese, Han (Simplified variant)
cs — Czech
da — Danish
de — German
el — Modern Greek (1453 and later)
en — English
es — Spanish
fi — Finnish ,....

有关更多信息,请访问https://dev.to/aumayeung/comparing-non-english-strings-with-javascript-collators-57bfhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Collator

答案 2 :(得分:1)

我从未测试过它,但实际上做不到,因为我不知道阿拉伯语前后是什么字母,但是我可以为您指明正确的方向。您将需要以类似于此的方式使用localeCompare:

arr.sort((x,y)=>x.localeCompare(y, 'ar-ma'))

ar-ma是阿拉伯摩洛哥语言代码,应将其更改为所需的语言代码。

答案 3 :(得分:1)

我遇到了同样的问题而且我写了这个函数,它对我来说效果很好.. 所以我决定在这里为你分享:

// costome order of english and persian letters 
var persianAlphabets = [" ", "آ", "ا", "ب", "پ", "ت", "ث", "ج", "چ", "ح", "خ", "د", "ذ", "ر", "ز", "ژ", "س", "ش", "ص", "ض", "ط", "ظ", "ع", "غ", "ف", "ق", "ک", "گ", "ل", "م", "ن", "و", "ه", "ی", "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z", "0", "1", "2", "3", "4", "5", "6", "7", "8", "9"];

// function for sorting an array of persian words 
function customSort(x, y) {
  var i = 0;
  var maxLen = Math.min(x.length, y.length);

  function increseIndex() {
    if (persianAlphabets.indexOf(x[i]) == persianAlphabets.indexOf(y[i]) &&
      i <= maxLen) {
      i++;
      increseIndex();
    } else return
  }
  increseIndex();

  if (persianAlphabets.indexOf(x[i]) <
    persianAlphabets.indexOf(y[i])) {
    return -1;
  }
  if (persianAlphabets.indexOf(x[i]) >
    persianAlphabets.indexOf(y[i])) {
    return 1;
  }
  return 0;
}

// sample array for testing 
var testArrray = [
  "بابا",
  "آبادان",
  "آب",
  "احمد آقا",
  "احد محمدی",
  "احد مرادی",
  "یونس",
  "مادر 1",
  "آبادانی",
  "ش س",
  "شگیرا",
  "یدالله",
  "مادر 2",
  "سلام"
];

// applying the sorting function 
testArrray.sort(customSort);

// testing resoults 
console.log(testArrray);

答案 4 :(得分:0)

Crowder给出了正确的答案。但是,如果您想自己解决问题,则可以应用自定义排序功能,该功能通过比较引用数组中的索引进行排序。

var alphabets = ["ا", "ب", "پ", "ت", "ث", "ج","چ","ح","خ","د","ذ","ر","ز","ژ","س","ش","ص","ض","ط","ظ","ع","غ","ف","ق","ک","گ","ل","م","ن","و","ه","ی","A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"];

var testArrray = ["ی","گ","ژ","پ"];
testArrray.sort(customSort(alphabets));
function customSort(alphabets){
    return function (x,y) {
      if (alphabets.indexOf(x) < alphabets.indexOf(y)) {
        return -1;
      }
      if (alphabets.indexOf(x) > alphabets.indexOf(y)) {
        return 1;
      }
      return 0;
  }
}
console.log(testArrray);

答案 5 :(得分:0)

function OrderFunc() {
    // Get the list
    const ul = document.querySelector(".myul");
    // Get its items as an array
    const lis = [...ul.querySelectorAll("li")];
    // Sort the array with localeCompare
    lis.sort((a, b) => a.textContent.localeCompare(b.textContent));
    // Move each of them to the end of the list; this
    // puts them back in order
    for (const li of lis) {
        ul.appendChild(li);
    }
}
OrderFunc();
<div id="result"></div>
<ul class="myul">
<li>ی</li>
<li>پ</li>
<li>گ</li>
<li>ژ</li>
</ul>