成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

[筆記] 深入理解 JavaScript Array.sort()

QLQ / 1875人閱讀

摘要:以上涉及到一個字符的轉換問題,這里不多擴展,寫一段代碼運行過程做筆記中國代表字符中的第一位,是只有長度的字符輸出字符長度為不確定時放入一個數(shù)組中。第一次運行后,返回值為,小于,所以的索引值未變化,。

Array.sort() 方法排序,默認為升序排序,如 1,2,3,4 這樣的排列,可以傳一個對比方法做為排序的參數(shù),也可以不傳,則為按照字符的逐個 unicode 排序。

簡單默認排序

第一步,創(chuàng)建一個 array.sort.js, 里面寫下以下內容并保存

let array_a=[1,12,11,123,9,10,2];聲明一個數(shù)字數(shù)組

array_a.sort();
//調用數(shù)組排序

console.log(array_a);
//輸出排序后的數(shù)組

第二步,在命令行下運行

node array.sort.js

第三步,查看運行結果

[ 1, 10, 11, 12, 123, 2, 9 ]

筆記

純數(shù)字的數(shù)組的排序結果,并沒有按照 1,2,9,10,11,12,123這樣輸出。

Arrary 的默認排序是按照字符的 unicode point 來排序,字符的第一位 unicode 越小,該字符越靠前,排序后的字符在數(shù)組中相應的索引值越小。

字符首位相同的情況下,第二位 unicode 越小,相應字符更靠前。

以上涉及到一個字符的 unicode 轉換問題,這里不多擴展,寫一段代碼運行過程做筆記

let str1="1",str2="中國",unicode_arr=[];
console.log(str1.charCodeAt(0));//0 代表字符中的第一位,str1 是只有長度 1 的字符; 輸出 "49"

for(let i=0;i
傳入對比方法排序

第一步,在以上的代碼基礎上,追加下面的代碼到 array.sort.js 中

let array_b=[
  {key:0,val:9},
  {key:1,val:6},
  {key:2,val:8},
  {key:3,val:7},
  {key:4,val:9},
  {key:5,val:10}
];

第二步,添加以下對比方法做數(shù)組 array_b 的排序

array_b.sort((a,b)=>{
  
  console.log(`array_b now is: --  ${JSON.stringify(array_b)}`);
  //輸出上一輪排序后的數(shù)組,第一次運行未排序
  
  console.log(`current a is: --  ${JSON.stringify(a)}`);
  //對比中的 a 是數(shù)組 array_b 中的哪一個
  console.log(`a"s index is:-- ${array_b.indexOf(a)}`);
  //對比中的 a 在數(shù)組中的索引值
  
  console.log(`current b is: -- ${JSON.stringify(b)}`);
  //對比中的 b 是數(shù)組 array_b 中的哪一個
  console.log(`b"s index is: -- ${array_b.indexOf(b)}`);
  //對比中的 b 在數(shù)組中的索引值

  console.log(b.val-a.val);
  //輸出方法返回值
  
  return b.val-a.val;
  //對比方法返回值,采用了降序排列
  //如果大于 0,a 的索引值要大于 b 的索引值,
  //如果小于 0,a 的索引值要小于 b 的索引值,
  //如果行于 0,a,b 的索引值都保持不變
  
});

console.log(array_b);//查看排序結果
/*[ 
  { key: 5, val: 10 },
  { key: 0, val: 9 },
  { key: 4, val: 9 },
  { key: 2, val: 8 },
  { key: 3, val: 7 },
  { key: 1, val: 6 } 
]*/

第三步,運行以下命令行

node array.sort.js

第四步,查看排序過程

array_b now is:--  [{"key":0,"val":9},{"key":1,"val":6},{"key":2,"val":8},{"key":3,"val":7},{"key":4,"val":9},{"key":5,"val":10}]
//數(shù)組初始化時。

current a is:--  {"key":0,"val":9}
a index is:-- 0
current b is:-- {"key":1,"val":6}
b index is:-- 1
-3
//開始從數(shù)組索引 0 開始,與索引 1 對比。

array_b now is:--  [{"key":0,"val":9},{"key":1,"val":6},{"key":2,"val":8},{"key":3,"val":7},{"key":4,"val":9},{"key":5,"val":10}]
//第一次運行后,返回值為 -3, 小于 0 ,所以 a,b 的索引值未變化,a index < b index。

current a is:--  {"key":1,"val":6}
a index is:-- 1
current b is:-- {"key":2,"val":8}
b index is:-- 2
2
//開始從數(shù)組索引 1 開始,與索引 2 對比。

array_b now is:--  [{"key":0,"val":9},{"key":1,"val":6},{"key":1,"val":6},{"key":3,"val":7},{"key":4,"val":9},{"key":5,"val":10}]
//第二次運行后,由于返回值為 2,大于 0,所以 索引 1 的值暫時填充索引 2 的值,并把索引 2 的值從數(shù)組中取出,與數(shù)組中比索引 1 小的索引 0 的值對比,在對比穩(wěn)定后,確定取出的索引 2 的值 放在數(shù)組的索引 1,或者索引 2 的位置

current a is:--  {"key":0,"val":9}
a index is:-- 0
current b is:-- {"key":2,"val":8}
b index is:-- -1
-1
//開始從數(shù)組索引 0 開始與取出的原索引 2 對比。

array_b now is:--  [{"key":0,"val":9},{"key":2,"val":8},{"key":1,"val":6},{"key":3,"val":7},{"key":4,"val":9},{"key":5,"val":10}]
//第三次運行后,由于返回值為 -1,小于 0,所以索引 0 保持不變,取出的原索引 2,變?yōu)閿?shù)組索引 1

current a is:--  {"key":1,"val":6}
a index is:-- 2
current b is:-- {"key":3,"val":7}
b index is:-- 3
1
//最后一次的索引起始為 1,在第二次,第三次對比穩(wěn)定后,從數(shù)組索引 2 開始與索引 3 對比

array_b now is:--  [{"key":0,"val":9},{"key":2,"val":8},{"key":1,"val":6},{"key":1,"val":6},{"key":4,"val":9},{"key":5,"val":10}]
//第四次運行后,由于返回值為 1,大于 0,索引 2 與索引 3 要發(fā)生索引對換,取出索引 3 ,并由索引 2 填充索引 3 的位置,

current a is:--  {"key":2,"val":8}
a index is:-- 1
current b is:-- {"key":3,"val":7}
b index is:-- -1
-1
//開始從比索引 2 小的索引 1 與取出的原索引 3 對比。

array_b now is:--  [{"key":0,"val":9},{"key":2,"val":8},{"key":3,"val":7},{"key":1,"val":6},{"key":4,"val":9},{"key":5,"val":10}]
//第五次運行后,對比穩(wěn)定后,取出的索引 3 放在數(shù)組索引 2 的位置

current a is:--  {"key":1,"val":6}
a index is:-- 3
current b is:-- {"key":4,"val":9}
b index is:-- 4
3
//從索引 3 開始與索引 4 對比

array_b now is:--  [{"key":0,"val":9},{"key":2,"val":8},{"key":3,"val":7},{"key":1,"val":6},{"key":1,"val":6},{"key":5,"val":10}]
//第六次運行后,取出索引 4 ,由索引 3 填充索引 4

current a is:--  {"key":3,"val":7}
a index is:-- 2
current b is:-- {"key":4,"val":9}
b index is:-- -1
2
//索引 2 與原索引 4 對比

array_b now is:--  [{"key":0,"val":9},{"key":2,"val":8},{"key":3,"val":7},{"key":3,"val":7},{"key":1,"val":6},{"key":5,"val":10}]
//第七次運行后,原索引 4 比索引 2 要大,索引 3,由索引 2 填充,索引 3 與索引 2 等待對比穩(wěn)定后確定

current a is:--  {"key":2,"val":8}
a index is:-- 1
current b is:-- {"key":4,"val":9}
b index is:-- -1
1
//索引 1與原索引 4 對比

array_b now is:--  [{"key":0,"val":9},{"key":2,"val":8},{"key":2,"val":8},{"key":3,"val":7},{"key":1,"val":6},{"key":5,"val":10}]
//第八次運行后,原索引 4 比索引 1 要大,索引 2,由索引 1 填充,索引 2 與索引 1 等待對比穩(wěn)定后確定

current a is:--  {"key":0,"val":9}
a index is:-- 0
current b is:-- {"key":4,"val":9}
b index is:-- -1
0
//索引 0 與原索引 4 對比

array_b now is:--  [{"key":0,"val":9},{"key":4,"val":9},{"key":2,"val":8},{"key":3,"val":7},{"key":1,"val":6},{"key":5,"val":10}]
//第九次運行后,原索引 4 與原索引 0 相當,把原索引 4 放在索引 1 的位置填充,……對比到索引 0,終于穩(wěn)定。

current a is:--  {"key":1,"val":6}
a index is:-- 4
current b is:-- {"key":5,"val":10}
b index is:-- 5
4
//從上次取出的索引 4 的位置開始,與索引 5 對比

array_b now is:--  [{"key":0,"val":9},{"key":4,"val":9},{"key":2,"val":8},{"key":3,"val":7},{"key":1,"val":6},{"key":1,"val":6}]
//第十次運行后,返回值為 4 大于 0,索引 4 與索引 5 要發(fā)生位置對調,索引 5 由索引 4 填充,并取出索引 5 與索引 3,2,1,0 對比,不斷由對比的索引起點填充索引起點+1 的位置,在對比穩(wěn)定后,確認當前的起始索引還是對比的起始索引+1的位置放置取出的原索引 5

//以下為不斷的不穩(wěn)定對比,不斷的 a 填充 b,并且起點索引-1 與取出的值對比的過程。
current a is:--  {"key":3,"val":7}
a index is:-- 3
current b is:-- {"key":5,"val":10}
b index is:-- -1
3

array_b now is:--  [{"key":0,"val":9},{"key":4,"val":9},{"key":2,"val":8},{"key":3,"val":7},{"key":3,"val":7},{"key":1,"val":6}]
current a is:--  {"key":2,"val":8}
a index is:-- 2
current b is:-- {"key":5,"val":10}
b index is:-- -1
2

array_b now is:--  [{"key":0,"val":9},{"key":4,"val":9},{"key":2,"val":8},{"key":2,"val":8},{"key":3,"val":7},{"key":1,"val":6}]
current a is:--  {"key":4,"val":9}
a index is:-- 1
current b is:-- {"key":5,"val":10}
b index is:-- -1
1
array_b now is:--  [{"key":0,"val":9},{"key":4,"val":9},{"key":4,"val":9},{"key":2,"val":8},{"key":3,"val":7},{"key":1,"val":6}]
current a is:--  {"key":0,"val":9}
a index is:-- 0
current b is:-- {"key":5,"val":10}
b index is:-- -1
1

筆記

對比方法的運行次數(shù)不確定,完全由初始數(shù)組的長度與運算值復雜度相關

在對比過程中,如果有發(fā)生索引更改,會由 a 來填充 b,組成新數(shù)組,并在下一輪對比中把索引起點-1,由上一輪的對比中的 a 前面的一位與取出的值做對比,取 a 前面一位的值做為 a,取出的值為 b;

循環(huán)2的過程,直至發(fā)生對比的 a 的索引為 0,最后在數(shù)組中確定取出的數(shù)組項該填充在數(shù)組哪個位置。

被取出數(shù)組的為下一輪對比中的 b

此篇為個人學習理解的筆記,為了更好的理解和掌握,歡迎留言。

文章版權歸作者所有,未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉載請注明本文地址:http://systransis.cn/yun/84038.html

相關文章

  • 學習筆記: JS數(shù)組

    摘要:數(shù)組元素甚至可以是對象或其它數(shù)組。它執(zhí)行的是淺拷貝,這意味著如果數(shù)組元素是對象,兩個數(shù)組都指向相同的對象,對新數(shù)組中的對象修改,會在舊的數(shù)組的相同對象中反應出來。 JS中的數(shù)組是弱類型的,數(shù)組中可以含有不同類型的元素。數(shù)組元素甚至可以是對象或其它數(shù)組。JS引擎一般會優(yōu)化數(shù)組,按索引訪問數(shù)組常常比訪問一般對象屬性明顯迅速。數(shù)組長度范圍 from 0 to 4,294,967,295(2^...

    archieyang 評論0 收藏0
  • 【干貨】js 數(shù)組詳細操作方法及解析合集

    摘要:數(shù)組轉字符串定義方法用于把數(shù)組中的所有元素通過指定的分隔符進行分隔放入一個字符串,返回生成的字符串。該字符串由數(shù)組中的每個元素的返回值經(jīng)調用方法連接由逗號隔開組成。 showImg(http://ww1.sinaimg.cn/large/005Y4rCogy1frtrbx8b69j30n20cyh3q.jpg); 前言 在開發(fā)中,數(shù)組的使用場景非常多,平日中也涉及到很多數(shù)組的api/相...

    pekonchan 評論0 收藏0
  • 深入了解JavaScript對象(2)--函數(shù)、對象

    摘要:屬性是函數(shù)獨有的,表明該對象可以被執(zhí)行。李四張三張三李四李四李四張三屬性探測由于屬性可以在任何時候添加,所以有時候就有必要檢查對象是否已有一個屬性。張三屬性特征通過方法來改變屬性特征。 1.[[Call]]屬性是函數(shù)獨有的,表明該對象可以被執(zhí)行。由于僅函數(shù)擁有該對象,ECMAScript定義typeof操作符對任何具有[[Call]]屬性的對象返回function。 注:某些瀏覽器曾經(jīng)...

    darkerXi 評論0 收藏0
  • JavaScript語言精粹 修訂版》 讀書筆記

    摘要:于是我就先把這本薄的經(jīng)典書語言精粹修訂版豆瓣讀書本書簡介總共章,除去附錄,才頁,讀完并記錄了一些筆記。讀書筆記還可以分享給別人看。編程語言第版定義了的標準。程序檢查時丟棄值為函數(shù)的屬性。 之前看到這篇文章,前端網(wǎng)老姚淺談:怎么學JavaScript?,說到怎么學習JavaScript,那就是看書、分析源碼。10本書讀2遍的好處,應該大于一本書讀20遍??磿鲃訉W習,看視頻是被動學習。看...

    EscapedDog 評論0 收藏0
  • JS中ArrayAPI學習筆記

    摘要:如果該函數(shù)的返回值大于,表示第一個成員排在第二個成員后面其他情況下,都是第一個元素排在第二個元素前面。第三次執(zhí)行,為上一輪的返回值,為第四個成員。第四次執(zhí)行,為上一輪返回值,為第五個成員。 JS中ArrayAPI學習筆記 記博客,時?;仡?尤其是面試之先回顧阮一峰標準庫Array對象 1 一些標準庫回顧 showImg(https://segmentfault.com/img/remo...

    tolerious 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<