JS 陣列排序範例

馬老師離開待了約十幾年的教學界,目前在外商科技公司擔任Senior Consultant的工作,原因當然很多,未來有空再慢慢發文章分享,剛好最近有點時間,怕以後忘記,把最近專案中用到的一些程式筆記下來,如果大家有需要,也可以參考使用,這一篇是關於Javascript陣列排序的部分。

通常若有較多的內容需要儲存,變數就沒有陣列來的好用,所以陣列是拿來儲存大量的資料時所使用的,且儲存在裡面的資料,還可以選擇經過排序之後再呈現至畫面上,例如:

var name = ["stanley", "jack", "anita" , "mary"];

name.sort() //依照字母排序
console.log(name); // 輸出 ["anita", "jack", "mary", "stanley"]

names.reverse() //反轉陣列內容
console.log(name); //輸出 ["stanley", "mary", "jack", "anita"]

但若我們同時有多個陣列,但希望以其中之一的內容排序時,也可以同步更新到另外一個陣列,該如何處理呢?可以參考以下的方式:

var name = ["stanley", "jack", "anita" , "mary"];
var gender = ["male" , "male" , "female" , "female"];
var score = [30, 10, 40 , 80];
var ID = ["S1" , "S2" , "S3" , "S4"];

console.log("name : " + name + "; score : " + score + "; gender : " + gender + "; ID : " + ID);
/*
排序前
name : stanley,jack,anita,mary;
score : 30,10,40,80;
gender : male,male,female,female;
ID : S1,S2,S3,S4;
*/

var list = [];
for (var i = 0; i < name.length; i++){
  list.push({
    'name': name[i],
    'score': score[i],
    'gender': gender[i],
    'ID': ID[i]
  });
}

list.sort(function(a, b) {
  return ((a.name < b.name) ? -1 : ((a.name == b.name) ? 0 : 1));
});

for (var i = 0; i < list.length; i++) {
  name[i] = list[i].name;
  score[i] = list[i].score;
  gender[i] = list[i].gender;
  ID[i] = list[i].ID;
}

console.log("name : " + name + "; score : " + score + "; gender : " + gender + "; ID : " + ID);
/*
排序後
name : anita,jack,mary,stanley;
score : 40,10,80,30;
gender : female,male,female,male;
ID : S3,S2,S4,S1;
*/

若是希望按照分數排序,則可以將sort function 修改為下:

//score 由小到大
list.sort(function(a, b) {
  return a.score - b.score
});

//score 由大到小
list.sort(function(a, b) {
  return b.score - a.score
});

補充:

上述的排序內容均以英文和數字為主,若是遇到中文可使用localeCompare進行,而排序的方式是漢語拼音順序,以下為範例:

var arr = ["二","五","四","一","三"];
//漢語拼音:一[yi], 二[er], 三[san], 四[si], 五[wu]
console.log("排序前:" + arr); // 排序前:二,五,四,一,三
arr.sort(function(a,b){
	return a.localeCompare(b, 'zh'); //排序後:二,三,四,五,一
});
console.log("排序後:" + arr); 

var arr = ["中文","英語","法國話", "京片子", "中國"];
//中文[zhong wen], 英語[ying yu], 法國話[fa guo hua], 京片子[jing pian zi], 中國[zhong guo]
console.log("排序前:" + arr); //排序前:中文,英語,法國話,京片子,中國
arr.sort(function(a,b){
	return a.localeCompare(b, 'zh');
});
console.log("排序後:" + arr); //排序後:法國話,京片子,英語,中國,中文


var arr = ["中文","英语","法国话", "京片子", "中国"];
console.log("排序前:" + arr); //排序前:中文,英语,法国话,京片子,中国
arr.sort(function(a,b){
	return a.localeCompare(b, 'zh');
});
console.log("排序後:" + arr); //排序後:法国话,京片子,英语,中国,中文

You may also like...

7,855 Responses

  1. Ask Me Anything: 10 Responses To Your Questions About Malpractice Litigation malpractice Attorney

  2. Genia表示:

    The Companies That Are The Least Well-Known To Watch In Medical Malpractice Law
    Industry medical malpractice lawyer [Genia]

  3. Ask Me Anything: 10 Answers To Your Questions About Malpractice Attorney Malpractice Lawyer

  4. A Step-By-Step Guide To Selecting Your Malpractice
    Lawyers Malpractice Lawsuit

  5. 9 . What Your Parents Teach You About Veterans Disability Lawyer Veterans disability

  6. What’s Everyone Talking About Software SEO
    Today seo Software tool

  7. Diplomi_tvei表示:

    купить фоторамку а4 для дипломов ast-diploms.com .

  8. Diplomi_kcPa表示:

    купить диплом вуза в красноярске diplomasx.com .

  9. Promote My Website – 4 Tips To Get The Most Out Of Article Marketing 검색엔진최적화 사례

  10. Howdy! This blog post could not be written much better! Looking at this article reminds me of my previous roommate! He continually kept talking about this. I am going to send this article to him. Fairly certain he’s going to have a great read. Thank you for sharing!

  11. JosephAerox表示:

    Военный адвокат Запорожье. Бесплатная консультация
    юрист
    — это опытный специалист имеющий высшее юридическое образование, сдавший квалификационный государственный экзамен на право осуществления адвокатской деятельностью и специализирующийся в основном на военных делах
    Вся правовая помощь военного адвоката осуществляется в индивидуальном порядке, грамотно, четко и в соответствии с действующими нормативно-правовыми актами.

    Мы как военные юристы действуем не против органов Украины или министерства обороны, мы действуем во благо Украины — наших защитников и граждан Украины, которые попали в тяжелую жизненную ситуацию связанную с незнанием военного и действующего законодательства.

    Поскольку, проявив патриотизм и чувство гражданской ответственности – став на защиту суверенитета страны, граждане участвующие и помогавшие в обороне после, становятся никому не нужными, особенно если военнослужащий стал инвалидом, потерял часть тела или конечность, и не может самостоятельно защитить свои права. Именно в таких ситуациях мы как военные адвокаты приходим на помощь, и добиваемся в установленном законом порядке справедливости, необходимых выплат, установление статуса, оформление пенсий, льгот и т.п.

    Тоже касается, и получение отсрочки от мобилизации, когда например, безосновательно призывают сына у которого отец инвалид 2 группы, или мать прикованная из-за тяжелой болезни к постели, и требующая постороннего ухода. Это же относится и к военнослужащим, рапорта которых не регистрируются в канцелярии воинской части и полностью игнорируются, под прикрытием суеты боевых действий..

    Именно в таких ситуациях, мы приходим на помощь и с помощью ЗАКОННЫХ методов правовой защиты, используя свой опыт полученный при ведении аналогичных военных дел добиваемся справедливости.

  12. Lariorlli表示:

    Официальная покупка диплома вуза с сокращенной программой обучения в Москве
    asxdiplomik24.ru/kupit-diplom-vracha

  13. Dnrtemt表示:

    Привет, друзья!
    Купить документ о получении высшего образования можно в нашем сервисе.
    ast-diplom24.ru/kupit-diplom-moskva
    Хорошей учебы!

  14. I blog often and I truly appreciate your content. This great article has really peaked my interest. I’m going to book mark your blog and keep checking for new information about once per week. I subscribed to your Feed too.

  15. 구글SEO表示:

    Seo – Use Blog To Help Rise Your Quest Engine Ranking 구글SEO

  16. I used to be able to find good information from your content.

  17. tubidy表示:

    Spot on with this write-up, I honestly feel this website needs much more attention. I’ll probably be returning to read through more, thanks for the information.

  18. Lower Your Own Card Bills – Extremely Best 3 Legitimate Debt Settlement 다바오 모바일 설치

  19. Qazrjhx表示:

    Добрый день!
    Где приобрести диплом специалиста?
    Мы предлагаем быстро и выгодно купить диплом, который выполнен на оригинальном бланке и заверен печатями, водяными знаками, подписями официальных лиц. Диплом способен пройти лубую проверку, даже с использованием специального оборудования. Решайте свои задачи быстро и просто с нашими дипломами.
    Приобрести диплом ВУЗа.
    theprome.com/read-blog/13692

  20. JasonNenly表示:

    Robert Lewandowski https://barcelona.robertlewandowski-ar.com is one of the most prominent footballers of our time, and his move to Barcelona has become one of the most talked about topics in world football.

  21. Lesliedap表示:

    Toni Kroos https://real-madrid.tonikroos-ar.com the German midfielder known for his accurate passes and calmness on the field, has achieved remarkable success at one of the most prestigious football clubs in the world.

  22. Stacyflasp表示:

    Victor Osimhen https://napoli.victorosimhen-ar.com born on December 29, 1998 in Lagos, Nigeria, has grown from an initially humble player to one of the brightest strikers in modern football.

  23. How By Utilizing Backlinks Easily And Add Consistent Flows Of Traffic 구글지니어스

  24. HowardNal表示:

    Vinicius Junior https://real-madrid.vinicius-junior-ar.com the Brazilian prodigy whose full name is Vinicius Jose Baixao de Oliveira Junior, has managed to win the hearts of millions of fans around the world in a short period of time.

  25. TravisRig表示:

    Earvin “Magic” Johnson https://los-angeles-lakers.magicjohnson.biz is one of the most legendary basketball players in history. NBA history.

  26. Anke表示:

    12 Companies That Are Leading The Way In Repairs To Double Glazed Windows window repairs – Anke,

  27. Very good post. I am facing some of these issues as well..

  28. Jamesnok表示:

    Nuno Mendes https://paris-saint-germain.nuno-mendes.com, a talented Portuguese left-back, He quickly became one of the key figures in the Paris Saint-Germain (PSG) team.

  29. Herberttoure表示:

    Bruno Miguel Borges Fernandes https://manchester-united.brunofernandes-br.com was born on September 8, 1994 in Maia, Portugal.

  30. DavidTerge表示:

    Daniel Alves https://paris-saint-germain.danielalves.net is a name that symbolizes the greatness of the world of football.

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。