0%

Day 20

老闆,幫我切一段香腸,從第三節到第六節,你手握著的那節不要。謝謝!

slice 的英文是切片或擷取,我們生活中常用的像是:「slice of life」生活的小片段、「slice of bread」一片麵包都是在表示一部分或「片狀」。但在陣列使用slice()的情境,比較像是「切  一段」,因為可以指定從某個元素切到某一個元素 的前一個。 切下來的部份是以複製的型態產生,所以也不會影響原本的陣列。

Read more »

Day 19

人生像是一列火車,旅程中總是會搭載著不同貨物,走得越遠掛載的越多,包括肥肉。

https://ithelp.ithome.com.tw/upload/images/20191004/201041759bPpG8rNEQ.png

圖片來源:www.unsplash.com / Dibyendu Sekhar Das

在法國搭高速火車時,曾經收到朋友的告誡:千萬不要自己亂換車廂,尤其是火車停在某一站的時候。

原本不以為意,但聽到以下的故事就頓時聽話了:
某人在火車停靠在某一站時,因為肚子痛急著想上廁所,但自己座位的那節車廂廁所卻有人,於是到隔壁的車廂去上,拉肚子總是不好解決,花了許多時間,等到舒緩之後,突然意會到怎麼火車還沒開,於是走回去原車廂時,驚!發現原本坐的那節車廂不見了!完全被shift()掉了!

Read more »

Day 18

別把我頭上的角取下來,這樣我就被 Shift 了。不過也好,這樣我看起來會比較正常。

前一篇我們認識了從陣列的頭部加上一個或多個元素的unshift(),今天要介紹的是從陣列的開端刪除元素的shift(),這一對陣列方法,都屬於佇列(Queue)「先進先出 FIFO」的資料結構。

Read more »

Day 17

頭和腳的關係如此微妙,一個思考一個執行,但對程式的陣列來說,都只是陣列的一部分而已,很公平。

接下來我們會分兩天,聊聊從陣列的開頭(前面)新增或刪除陣列元素的方法。

unshift()shift()這一對,說穿了和push()pop()ㄧ樣,只是一個從陣列的前頭增加與刪除元素,另一個則是從陣列的尾端操作。
https://ithelp.ithome.com.tw/upload/images/20191002/20104175DIqBdswLxB.png

Read more »

Day 16

既然都要被刪掉了,那就跟他告別吧!誰叫他要吊車尾。

在 javascript 裡,我們常常會把 push( )、pop( )、unshift( )、shift( )這四個陣列方法一起討論,因為 push( )、pop( )一組、unshift( )、shift( )一組,正代表著兩種不同的資料結構和演算法,它們分別是堆疊(Stack)和佇列(Queue),但它們又分別代表什麼呢?我們先來看一下這張圖:

https://ithelp.ithome.com.tw/upload/images/20191001/20104175Lq4qae4nP9.png

Read more »

Day 15

有付出一定有收穫,有 push ㄧ定有增加,但是要排隊喔~

介紹陣列方法的第一天,想先請大家看一下底下的這張圖,在上一篇,我們依 JavaScript 的更新版本與方法的功能來列出所有陣列方法(Array Methods)

這張圖上的所有方法,皆是 Chrome 瀏覽器有支援的方法,如果擔心與其他瀏覽器的問題,可以到 Can I use 查閱,看看我們使用的功能是否和其他瀏覽器有相容性的問題。

Read more »

Day 14

知道怎麼做,但是如果有好工具會更得心應手。

JavaScript 一直在演化,也因此因不同時期推出的新方法好像是給我們補充能量,原本需要複雜的程序寫出來的函式,現在大多可用內建的方法處理 for 被放生了,不但直接且經過優化,以往使用For迴圈來遍歷陣列,現在只要用內建方法就可以,簡單又好用。

如果有用 javascript 來操作處理 JSON 的經驗,會發現陣列方法實在是非常好用,無論是在陣列上的資料過濾、排序、儲存、組合都超級方便!我們可以想像一下,如果我們想要做出好看又好吃的甜點,是不是需要一些必須的工具,例如刮刀、擠花袋、打蛋器(電動的更好、量匙、電子秤等等,如果沒有這些,即使有上好的材料與器材如烤箱,要做甜點勢必困難重重,而這些陣列 Array 的方法正如這些工具,幫我們快速又精準的把甜點做出來。 寫著寫著就餓了

Read more »

Day 13

傻傻以為迴圈是唯一,那只是沙灘上的一塊小岩石。

回想剛開始學程式時,看到 While 迴圈可以透過 ASCII 碼,把英文數字從 a 到 Z 印出來,感到好驚訝!到底是怎麼辦到的?但是,經過了幾次無限迴圈的背叛後,才知道如果迴圈不給一個「範圍」,就會出大事。 電腦整個當掉要重開

記得小時候家裡小孩多,當時的台灣經濟正在起飛 馬上透露了世代,家庭代工正興起。記得媽媽總是會叫我們兄弟姐妹來幫忙 是滴,本人兄弟姐妹都有。 當時的手工產品是要寄往北方某個遙遠國度的聖誕節飾品,也就是要掛在樹上的小型禮物盒。媽媽先是叫我們排排坐,開始解說步驟,接著就開始這條要完成「一百個」小禮物的童工生產線:

Read more »

Day 12

拿到它,先看它是什麼?拿它來做什麼? 再決定。

在複製陣列之前,先理解了 JavaScript 會依資料型別 Primitive type(基本型別)和 Non-primitive type(非基本型別)而有不同的運作方式,我們就可以進一步的來了解,我們常聽到的深拷貝(DeepCopy)和淺拷貝(shallow) 是什麼、在什麼情境下要選擇哪一種複製方法、如何實作出這些深拷貝和淺拷貝。

什麼是拷貝?

在生活中我們最常做的拷貝就是影印,假如我有一份筆記,朋友跟我借去拷貝,當他拿著我的筆記,到影印機前,按下拷貝鍵的那一刻,複製的筆記從機器跑出來,這時「拷貝」這件事就算完成,「我的筆記」和「他影印的筆記」是各自獨立的筆記,之後他要在這份影印的筆記上塗鴉也好、修改也好,也不會影響我的筆記。

Read more »

Day 11

別懷疑,複製就是拷貝,深拷貝淺拷貝就是深複製淺複製,呼~

人家說,如果我們可以和某位朋友一起旅行 30 天,要嘛旅程結束變至親,不然就是變仇人,鐵人賽已經第十天,本人也開始有點了解 Array 這位木訥寡言,但一肚子學問的中年大叔。很難想像,光陣列就可以讓我寫十天寫不盡,即使寫完它,但是後頭還有多少 JavaScript 特性或其他奇怪的東西要了解?不過,只要確定走在進步的路上,那就繼續走吧!

複製到哪個程度?

要說到陣列的複製,得讓我們聊聊 Javascript 是怎麼將型別分類的,原因是這牽涉到記憶體的分配與讀取的方式。在這之前,我們再來複習一下,在前幾天有聊到的 Javascript 資料型別。

Read more »