การเรียงลำดับภาษาจีนโดยพินอินใน Javascript ด้วย localeCompare?

สิ่งนี้ใช้ได้กับ Chrome:

const arr = ["博","啊","吃","世","中","超"]
arr.sort((x,y)=>x.localeCompare(y, 'zh-CN'))

โดยทั่วไป ผู้คนจะใช้วิธีต่อไปนี้ในการเรียงลำดับพินอินของตัวอักษรจีน

var list=[' king ', 'a', 'li'];  
list.Sort(function (a, b) {return a.localeCompare(b); });

localeCompare () : มีลำดับเฉพาะท้องถิ่นเพื่อเปรียบเทียบสองสตริง

วิธีการเรียงลำดับพินอินนี้ไม่น่าเชื่อถือ

วิธีที่สอง: ขึ้นอยู่กับระบบปฏิบัติการจีนเป็นอย่างมาก

ขึ้นอยู่กับเคอร์เนลของเบราว์เซอร์อย่างมาก กล่าวคือ หากผู้เยี่ยมชมไซต์ของคุณใช้ระบบภาษาจีนหรือเบราว์เซอร์ Internet Explorer (Chrome) เขาอาจจะไม่สามารถเห็นพินอินเรียงลำดับผลลัพธ์ที่เราคาดหวังได้

ที่นี่ฉันจะแนะนำวิธีแก้ปัญหาของฉันสำหรับปัญหานี้ หวังว่าจะได้มาด้วยวิธีใดวิธีหนึ่ง: วิธีนี้รองรับชุดอักขระ Unicode x4e00 จาก 0 ถึง 0 x9fa5 พื้นที่ทั้งหมด 20902 ติดต่อกันจากจีน (รวมถึงไต้หวัน) ญี่ปุ่น เกาหลีใต้ ตัวอักษรจีน ได้แก่ ตัวอักษร CJK (จีน ญี่ปุ่น เกาหลี)

var CompareStrings={.........}
getOrderedUnicode: function (char) {
var originalUnicode=char.charCodeAt (); 
if (originalUnicode >=0 x4e00 && originalUnicode <=0 x9fa5) {
var index=this.Db.IndexOf (char); 
if (index >1) {
return index + 0 x4e00; 

}} 
return originalUnicode; 
}, 


compare: function (a, b) {
if (a==b) {return 0; }

//here can be rewritten according to the specific needs and the writing is the empty string at the bottom the if (a.length==0) {return 1; } 

if (b.length==0) {return - 1; } 
var count=a.length >B.length? B.length: a.length; 

for (var i=0; i<count; i++) {
var au=this.GetOrderedUnicode (a [i]); 
var bu=this.GetOrderedUnicode [i] (b); 
if (au >bu) {
return 1; 
} else if (au <bu) {
return - 1; 
}} 

return a.length >B.length? 1:1; 

}} 
//rewriting system native localeCompare 

ต้นแบบ:

LocaleCompare = function (param) {
    return CompareStrings.compare said (enclosing the toString (), param); 
} 

คุณสามารถใช้ลิงก์ด้านล่างเพื่อดาวน์โหลดโค้ดที่สมบูรณ์

การแนะนำหลักการดำเนินการโดยย่อ:

1. ตามพินอินเรียงลำดับอักขระที่ดี (db) : มีหลายวิธีในการบรรลุเป้าหมาย ฉันเสร็จแล้วด้วยการรวม JavaScript + c# ใช้สคริปต์ก่อนอื่นให้ใส่การแจงนับตัวอักษรจีนทั้งหมดแล้วส่งไปที่การเรียงลำดับพื้นหลัง c #good และส่งออกไปที่แผนกต้อนรับ นี่เป็นเพียงการเตรียมการ สิ่งที่ทุกคนสามารถทำได้

2. ระบุตัวอักษรสองตัวที่ใหญ่กว่า (getOrderedUnicode) : เพราะในการสั่งซื้อไม่ใช่แค่จัดการกับตัวอักษรจีนและตัวอักษรจีนนอกตัวอักษรดังนั้นผู้เปรียบเทียบจะต้องสามารถระบุตัวอักษรทั้งหมดได้เราที่นี่ด้วยการตัดสินว่าตัวอักษร คือการเลือกปฏิบัติตัวอักษรจีน: ถ้าเป็นตัวอักษรจีนแล้วดัชนีการค้นหาไลบรารีการเรียงลำดับคำที่ดีค่าดัชนีบวกอักขระ Unicode ตั้งค่าตำแหน่งของตัวอักษรจีนตัวแรกอยู่หลัง "การปรับเทียบ" ของชุดอักขระ Unicode ของ ค่าดัชนี; หากไม่ใช่อักขระจีน ให้ส่งคืนโดยตรงบนค่าดัชนีของชุดอักขระ Unicode

3. เปรียบเทียบสองสตริง (เปรียบเทียบ) : โดยการเปรียบเทียบอักขระแต่ละตัวสองตัว (ภายในการเปรียบเทียบช่วงที่มีประสิทธิภาพ นั่นคือ ยิ่งความยาวของสตริงสั้นลง) หากคุณพบค่าที่มากกว่า b จะส่งคืนค่า 1 และส่งคืน 1 รอง

4. ภายในช่วงที่มีผลหลังการเปรียบเทียบ ถ้ายังไม่เสมอกัน ให้ดูว่าใครยาวกว่า เช่น a='123', b='1234' ให้ยาว b ไปทางด้านหลัง

แก้ไข

คุณยังสามารถใช้ปลั๊กอิน JQuery ได้:

jQuery.extend( jQuery.fn.dataTableExt.oSort, {
    "chinese-string-asc" : function (s1, s2) {
        return s1.localeCompare(s2);
    },
    "chinese-string-desc" : function (s1, s2) {
        return s2.localeCompare(s1);
    }
} );

ดูโพสต์ต้นฉบับ

ตาม MDN, locales และ options อาร์กิวเมนต์ใน localeCompare() ได้รับการเพิ่มใน Firefox 29 แล้ว คุณควรจะสามารถเรียงลำดับตามพินอินได้แล้ว

นี่คือวิธีแก้ปัญหา:

<!--
pinyin_dict_notone.js and pinyinUtil.js is available in URL below:
https://github.com/sxei/pinyinjs
-->
<script src="pinyin_dict_notone.js"></script>
<script src="pinyinUtil.js"></script>
<script>
jQuery.extend(jQuery.fn.dataTableExt.oSort, {
  "chinese-string-asc": function(s1, s2) {
    s1 = pinyinUtil.getPinyin(s1);
    s2 = pinyinUtil.getPinyin(s2);
    return s1.localeCompare(s2);
  },
  "chinese-string-desc": function(s1, s2) {
    s1 = pinyinUtil.getPinyin(s1);
    s2 = pinyinUtil.getPinyin(s2);
    return s2.localeCompare(s1);
  }
});
jQuery(document).ready(function() {
  jQuery('#mydatatable').dataTable({
    "columnDefs": [
      { type: 'chinese-string', targets: 0 }
    ]
  });
});
</script>