前言這兩天會來講Set/Map，這是ES6後才新增的兩種資料結構，主要是用來處理一些array跟object沒辦法完全顧及的領域，也因如此，其實許多地方跟array跟object非常相似，那今天就從set開始吧！ set是集合的意思，在JavaScript裡是唯一值的集合，意思就是說，set裡面的每一個值都只能出現一次。 什麼是集合？set 的中文翻譯是集合的意思，在 JavaScript 裡這個語法是唯一值的集合，而數學上的集合定義，去爬了維基百科，得到以下結論： 指具有某種特定性質的事物的母體，集合裡的事物稱作元素。 下圖就是一個有一些多邊形的集合。關於集合我的理解是可以把它當作一堆類型差不多的東西，而在JavaScript就是一堆值，而在array確實就只有一大堆值，跟Set的差別就在於，JS 的Set值是獨一無二的。 出處: https://zh.wikipedia.org/zh-tw/%E9%9B%86%E5%90%88_%28%E6%95%B0%E5%AD%A6%29set常用方法與屬性 new Set() => 創建一個set add() = ...

前言今天會來繼續介紹語法糖Class的語法部分，會介紹到的分別為: 「extends」、「super」 keywords static properties and methods extends and super首先昨天已經知道了，class可以依靠constructor跟prototype的原理來去實作出像是其他程式語言的繼承效果，但是class以及class之間的繼承還是一個問題，為了這件事情，JavaScript有提供在class中可以使用extends跟super來解決這件事情。 原本單純使用class來寫會是長這樣： 1class Parent 使用extends關鍵字的語法是： 1class Child extends Parent 這邊使用 MDN 上面的範例修改過後來做講解： 1234567891011121314151617181920212223class Animal { constructor(name) { this.speed = 0; this.name = name; } speak()
...

前言在介紹完prototype之後，該是來理解JavaScript的class，之前有提到說，JavaScript的繼承依靠的是Prototypal inheritance，但並不是所有的程式語言都是如此，我覺得要理解class的話要從這裡下手，那就開始吧。 其他程式語言的繼承之前有提到過繼承，其實道理差不多，一個物件可以將自己的屬性跟方法給其他人使用，換句話說，一個物件可以去取用別人物件的屬性跟方法。 在JavaScript中，這種可以被取用屬性跟方法的物件是原型物件，透過原型鏈來找到跟綁定，但是在其他語言中，像是java或是c++就會直接把這個可以被取用屬性跟方法的物件視為class，一個類別的概念。 關於類別的比喻，有一個我覺得很不錯，出處是在：JavaScript 概念三明治。 class其實就是像建築物的設計圖一樣，而建築物就可以透過裡面所描述的概念來寫現做出來。 class(類別) => 設計圖。object(物件) => 建築物。 然後有了 class(類別)就可以創造出許多的instance(實例)，透過用new的方式，非常合理，但是Ja ...

前言Constructor Function也是Function，那它跟一般的Function差在哪裡，有什麼特別之處，就是今天主要介紹的部分。 構造函式剛剛有提到其實跟Function差不多，所以正常來說為了要區分這兩者的差別，構造函式在命名上都會以大寫字母來寫，而構造函式的誕生，是要經過一個叫做new這個關鍵字來創立。 意味著，使用new來生成的函式就是構造函式。沒有使用new來生成，可以直接呼叫執行的，就是普通函式。 那什麼是new？ new關鍵字new這個關鍵字其實是new operator，在 mdn 的解釋是： The new operator lets developers create an instance of a user-defined object type or of one of the built-in object types that has a constructor function. 我自己翻起來是：new可以創建一個定義物件類型，或者是具有構造函式的內置物件類型，它們的實例。 我的理解是new只可以拿來創造構造函式，沒有用new來創造就只 ...

Array Methods繁多，許多人常常使用時會在去 MDN 看文檔，但如果你仔細看會發現奇怪地方，比如說你想要去查map的語法，你實際會看到Array.prototype.map()。 更奇怪的地方是，有些會有.prototype，有些沒有，當初我初學時百思不得其解。 其實這就跟今天主題的Prototypal inheritance有關，讓我們從一開始提到的map的Array Methods開始看起，寫一個簡單的例子: 12345const arr = [1, 2, 3, 4, 5];const arr2 = arr.map((n) => n + 1);console.log(arr2); 會發現說，我明明沒有寫這個方法，但是我可以用，why?arr 裡面明明就只有 12345。這就是原型繼承的奧妙之處。 arr = [1, 2, 3, 4, 5]其實可以看成是arr = new Array([1, 2, 3, 4, 5]) 其中Array就是內建的一個 Constructor Function，它自身的prototype會指向一個帶有 map(方法)跟其他一堆的方法的 ...

昨天Prototype世界的例子中，小白這種打電話讓別人再去打電話找的方式，其實就是一種Prototype Chain的概念。 畫一張示意圖會比較清楚一些，用一個空的陣列來做舉例。 首先，陣列也是一種物件，空陣列代表裡面什麼都沒有，不過不代表不能從空陣列去獲取東西。 當我要從物件裡面找一個不存在的屬性，JavaScript 就會直接從它的原型物件去找，要是它的原型物件沒有，就會再往上找它的原型物件，直到最上面，都沒有那就是找不到。 而這個最上面的原型物件就稱作叫Object.prototype。真的就最上面了，再往上找就是null。 而這一個由下往最上尋找的過程，一層一層相依尋找，就是原型鏈。 Object.create這個可以拿來創造出一個擁有原型物件的新空物件，裡面的參數就帶要被繼承的原型物件，比如說: 12345const food = { eat: true,};const apple = Object.create(food); 這個新被創造出來的物件其實原型物件就會自動綁定是 food 了，所以現在的 apple 也可以去看 eat 的這個屬性。 ...

前言我相信每個語法的發明都有它意義存在，以我看來Prototype的存在，是為了要讓JavaScript 也能實現物件導向，準確點來說，可以用來做到物件的繼承，透過Prototype的方式。 Prototype 的產生是為了 JavaScript 的繼承而所謂物件的繼承，就是可以從其他地方拿到本身沒有的方法或是屬性，藉由去繼承有方法跟屬性的物件，來獲得使用那些方法跟屬性的權利。 在JavaScript中，每個object都會去連結到Prototype object => 每個object都可以看得到裡面有Prototype(null是例外～)。 這個Prototype是[[prototype]]也是原型物件。 舉例來說，創造一個空物件，會看見[[Prototype]]: 但是用Object.create使用null當原型的這個新物件是會看到no properties，很乾淨的那種。 Prototype object 包含了 properties(屬性) 跟 methods(方法)簡單解釋一下什麼是properties跟methods。首先要先知道物件會有key-valu ...

解答來源： https://gist.github.com/j796160836/262083cdbad0d45eefcd 顯示隱藏檔案：defaults write com.apple.finder AppleShowAllFiles TRUE;\killall Finder 不顯示隱藏檔案：defaults write com.apple.finder AppleShowAllFiles FALSE;\killall Finder

大家好，我是 Vic，目前在台南的好想工作室學習，已經在這裡自學了幾個月時間。鐵人賽的開始，代表著我的 JS 學習的路也已經學到了一個段落，這一個階段要挑戰的就是三十天連續的技術發文，挑戰短時間內對JavaScript的理解程度，學習了三、四個月也是一段不短的時間，該來突破自我了！ 這段時間自學看了許多網路上資源跟書籍，列出一些我自己覺得很不錯的(各列前三個)。 學習網站： JS MDN提供了很多語法的說明跟相關的技術文件，正確性很高，而且每個語法都有很清晰的範例，是一個我後來當作 JS 字典的地方，會天天看天天查。 JS w3schools跟 MDN 是同個性質的學習網站，但相對來說會簡單些，優點是版面很乾淨，會讓人看了覺得很舒服，我覺得也很適合初學者去看。 Lidemy 鋰學院號稱是一個為初學者而生的線上程式課程平台，我覺得當之無愧，滿完整又便宜，就算不花錢上面也有一些免費的課程。之前花了一個月去訂閱，然後把想看的學習影片全部看完，我覺得很划算。 學習書籍： JavaScript 概念三明治：基礎觀念、語法原理一次帶走！簡稱三明治，看完後個人認為超適合初學者，裡面淺白好懂，去 ...

這個一直困擾我很久的問題，有時候用一用就突然失效，而到最近更是連 F3 也無法使用，三指往上滑也沒辦法，可惡這是剛買沒有到一年的 mac m1 呀，不過我最終找到了解決方式，記錄一下。 1. 重新開機重新開機就能恢復正常，缺點就是每次發生失效就得一直重新開關機。 2. 重啟 dock在終端機或是其他命令提示的地方下這一個指令： 1killall Dock