用js實(shí)現(xiàn)數(shù)組方法簡(jiǎn)要說明
終于淤年，這是有關(guān)于數(shù)組的最后一篇，下一篇會(huì)真真切切給大家?guī)頂?shù)據(jù)結(jié)構(gòu)在js中的實(shí)現(xiàn)方式。那么這篇文章還是得啰嗦一下數(shù)組的相關(guān)知識(shí)，因?yàn)閿?shù)組真的太重要了贫贝！
以下部分內(nèi)容 由小紅書（www.xiaohongshutuiguang.cn）轉(zhuǎn)載提供?
不要懷疑數(shù)組在JS中的重要性與實(shí)用性。這篇文章分為兩部分蛉谜，第一部分會(huì)給大家簡(jiǎn)單說一下數(shù)組原生的排序方法sort和reverse稚晚。第二部分會(huì)給大家簡(jiǎn)單說一下二維和三維數(shù)組。都不難型诚，仔細(xì)看客燕，很簡(jiǎn)單的。
1狰贯、reverse()
reverse比較容易理解也搓，顛倒數(shù)組中元素的順序，也就是第一個(gè)變成最后一個(gè)涵紊，最后一個(gè)呢變成第一個(gè)傍妒。
varnums = [0,1,2,3,4,5,6,7];
nums.reverse();
console.log(nums)//[7, 6, 5, 4, 3, 2, 1, 0]
reverse方法只是無差別的對(duì)數(shù)組進(jìn)行倒敘，可能很多時(shí)候并不適用于我們的應(yīng)用場(chǎng)景摸柄，所以才出現(xiàn)了sort()方法拍顷。
2、sort()
? sort()方法可以說是js數(shù)組中不太容易記憶和使用的方法塘幅，但是sort()是十分重要的一個(gè)方法，那么下面我就詳細(xì)的說明一下尿贫，sort()的應(yīng)用場(chǎng)景和使用方法电媳。
? sort()方法允許傳入一個(gè)匿名函數(shù)作為排序的依據(jù)，也可以不傳參數(shù)庆亡，但是我想大家都知道匾乓，在不傳參數(shù)的情況下，很多時(shí)候的結(jié)果并不是我們想要的又谋，比如：
varnums = [0,2,4,9,10,11,20,32,3,6,7,8,15,26];varnewNums = nums.sort();
console.log(newNums)//[0, 10, 11, 15, 2, 20, 26, 3, 32, 4, 6, 7, 8, 9]console.log(nums)//[0, 10, 11, 15, 2, 20, 26, 3, 32, 4, 6, 7, 8, 9]
上面的代碼說明拼缝，sort會(huì)改變?cè)瓉淼臄?shù)組娱局，而不是生成一個(gè)排序后的新數(shù)組，大家看到上面的排序并不是依據(jù)數(shù)字從大到小排序的咧七。這是因?yàn)樗テ耄瑂ort在排序的時(shí)候會(huì)默認(rèn)把數(shù)組中的各個(gè)元素轉(zhuǎn)換成字符串，并且依據(jù)字符串對(duì)應(yīng)的ASCII碼值來比較的继阻，那ASCII是什么耻涛？ASCII是基于拉丁字母的一套電腦編碼系統(tǒng)，主要用于顯示現(xiàn)代英語和其他西歐語言瘟檩。
顯然這不是我們想要的結(jié)果抹缕，所以就需要給sort傳入一個(gè)函數(shù)（compareFunction）來使排序得到我們想要的結(jié)果或者自定義排序的方式。
在大多數(shù)實(shí)際工作的排序中墨辛，我們都會(huì)依據(jù)id值得大小卓研，或者一些依據(jù)數(shù)值大小來排序的場(chǎng)景。那么我們看看如何使用compareFunction來使sort排序可以得到正確的結(jié)果：
varnums = [0,2,4,9,10,11,20,32,3,6,7,8,15,26];
nums.sort(function (a,b) {
? ? returna - b;
})
console.log(nums)//?[0, 2, 3, 4, 6, 7, 8, 9, 10, 11, 15, 20, 26, 32]
我在剛接觸sort時(shí)候看到這樣的寫法睹簇，第一個(gè)反應(yīng)就是a和b是什么奏赘？他所代表的參數(shù)是什么意義？為什么要用a和b?我用其他的參數(shù)可以么带膀？
首先志珍，a和b在這里只是代表數(shù)組中任意兩個(gè)元素的值，你可以使用任何兩個(gè)參數(shù)來代表它垛叨。
那么再給大家看一個(gè)：
varnums = [0,2,4,9,10,11,20,32,3,6,7,8,15,26];vari = 0;
nums.sort(function (m,n) {
? ? console.log(m,n)
? ? console.log(++i)
? ? returnm - n;
})
console.log(nums)//?[0, 2, 3, 4, 6, 7, 8, 9, 10, 11, 15, 20, 26, 32]
上面的代碼伦糯，給大家留下一個(gè)疑問自己去找答案。這里不會(huì)多說嗽元，看看再不同數(shù)組長(zhǎng)度下sort會(huì)循環(huán)多少次敛纲？m，n每一次的值又是什么樣的剂癌？其實(shí)一個(gè)sort方法就包含很多更深層次的問題淤翔。
那么還有一種場(chǎng)景，比如說后端傳給我一個(gè)包含對(duì)象元素的數(shù)組佩谷，我需要依照id的大小來給這個(gè)數(shù)組排序旁壮，要怎么做呢？
var objArr = [{name:"zaking",id:0},{name:"json",id:6},{name:"undefined",id:11},{name:"obj",id:10},{name:"number",id:4},{name:"string",id:5}]
objArr.sort(function(a,b){
? ? varm = a.id;
? ? varn = b.id;
? ? returnm - n;
})
console.log(objArr)
console出來的結(jié)果是這樣的：
那么這樣就實(shí)現(xiàn)了我們?cè)诠ぷ鲌?chǎng)景中排序的大多數(shù)的情況谐檀。那么如果你想要倒敘排序怎么辦呢抡谐？a-b變成b-a。其實(shí)a-b這樣的方式是簡(jiǎn)寫桐猬。
nums.sort(function (a,b) {
? ? if(a
? ? ? ? return-1? ? }
? ? if(a>b) {
? ? ? ? return1? ? }
? ? return0})
或許這樣更清晰一點(diǎn)麦撵，判斷a和b值得大小來決定是否要調(diào)換兩個(gè)值得位置，如果a<b那么a就放在b的后面，如果a>b免胃，那么久把a(bǔ)放在b的前面音五，如果a既不大于b，也不小于b羔沙，那么說明a=b躺涝，則不改變兩個(gè)值得位置。
這里有一篇文章撬碟，大家可以去看一下诞挨，JS基礎(chǔ)篇--sort()方法的用法，參數(shù)以及排序原理呢蛤。
3惶傻、多維數(shù)組的使用及場(chǎng)景
其實(shí)多維數(shù)組在平時(shí)的工作中還是很常見的，最普通的要說是二維數(shù)組了其障，也可以叫做矩陣银室。但是其實(shí)js是不支持二維或者多維數(shù)組的，但是好在js夠靈活励翼，我沒有的蜈敢，都可以模擬出來。那么我們也可以通過數(shù)組嵌套數(shù)組的方式來模擬多維數(shù)組汽抚。
我們先來看看二維數(shù)組：
varmatrix = [["a","b","c","d"],["A","B","C","D"],[1,2,3,4]];
這就是一個(gè)簡(jiǎn)單的二維數(shù)組形式抓狭，我們通常需要遍歷數(shù)組獲取其中的每一個(gè)值，其實(shí)我們可以把二維數(shù)組視為行和列造烁，第一層循環(huán)每一行否过，第二層循環(huán)每一行的每一列，這樣就可以得到二維數(shù)組中的每一個(gè)元素惭蟋。
varmatrix = [["a","b","c","d"],["A","B","C","D"],[1,2,3,4]];for(vari = 0; i < matrix.length; i++) {
? ? document.write("
")
? ? for(varj = 0; j < matrix[i].length;j++) {
? ? ? ? document.write(matrix[i][j])
? ? }? ?
}
這樣我們就得到了一個(gè)二維數(shù)組內(nèi)所有的元素苗桂。
其實(shí)三維數(shù)組也是一樣的，只是再多循環(huán)一層告组，我們來看一下煤伟。
varmatrix3 = [];for(vari = 0; i < 3; i++) {
? ? matrix3[i] = [];
? ? for(varj = 0; j < 3; j++) {
? ? ? ? matrix3[i][j] = [];
? ? ? ? for(vark = 0; k < 3; k++) {
? ? ? ? ? ? matrix3[i][j][k] = i + j + k;
? ? ? ? }
? ? }
}
console.log(matrix3)
數(shù)組的介紹到這里就基本結(jié)束了，下一篇文章會(huì)跟大家一起來看看如何用JS來實(shí)現(xiàn)棧這種數(shù)據(jù)結(jié)構(gòu)木缝。
