柯里化是一個函數的運用技術，不只是JavaScript裡面，它可以運用在很多的地方，簡單來說就是幫忙做了轉換。 原本的函式可能是長這樣的： 1fnc(A, B, C); 柯里化後會變成這樣： 1fnc(A)(B)(C); 這兩種方式最後出來的結果都是會一樣的，而怎麼實現的等等就會提到，今天會從幾個角度介紹這個主題 => 介紹與原理 目的與好處 介紹與原理柯里化主要的用途是用來簡化呼叫函式的過程，像是說把呼叫 f(a,b)變成呼叫 f(a)以及 f(b)，就可以達成說，把一個很多參數的函式，切分成很多只有一個參數的函式。 舉例來說：這是一個簡單的相加，它是一個有很多參數的函式。 12345function plus(a, b, c) { return a + b + c;}console.log(plus(1, 2, 3)); //印出6 使用柯里化的方式改寫，讓它變成很多只有一個參數的函式。 12345678910function plus(a) { return function (b) { return f ...

今天要來介紹JSON的兩個靜態方法： JSON.parse() JSON.stringify() 會從什麼是JSON開始介紹起，直接開始吧。 JSONJSON的全名是JavaScript Object Notation，它是一種輕量型的數據交換格式，就是可以用來儲存跟方便傳遞的一種格式，跟物件的樣子很像，但其實不太一樣，會有著JSON的出現，主要還是單純物件的話，還不夠簡單跟容易閱讀。 跟使用物件的格式有一些差別。 第一JSON它只能用雙引號，不能用單引號，不論是key還是value，物件沒有這種限制，可以用單引號，甚至key不要加引號也沒有關係。 第二JSON 支持 object、array、string、number、boolean 和 null，基本上除了undefined之外其他全包了。 不過雖然支持，但是大部分的JavaScript都不是JSON，主要原因還是上面第一點，不論是key還是value都需要雙引號。 簡單說，JSON 是用來表示在JavaScript物件的一種格式，比單純的物件格式更好閱讀，有更高的相容性。 JSON的範例： 1234567{&quo ...

前言JavaScript的嚴格模式，如其名會讓程式碼的檢視變的嚴格，嚴格意味著不讓你錯，寫起來會更加安全嚴謹。 今天會照以下幾個角度來講解： 嚴格模式由來 使用方式 禁止事項 使用情境 嚴格模式由來JavaScript寫法規則相對來說不嚴謹，像是弱型別的轉換特性，就算沒有寫清楚，JavaScript也會自動幫忙補完，不會報錯，好處是很容易上手，不會被一大堆語法的限制給綁手綁腳，不過同時壞處也是十分明顯的，有時候寫錯也不會報錯，那麼將會很難避免一堆潛在錯誤，在寫的時候也完全發現不了。 為了應付這種狀況，JavaScript在 2009 年 ECMAScript5 有新推出了這個叫做Strict Mode的語法，創造出一個模式，是很嚴格嚴謹的，提供一個給開發者改善上述提到不嚴謹導致出錯的問題，讓開發者可以自由選擇。 舉例來說，在嚴格模式下，沒有辦法使用一個沒有宣告的變數。 沒有嚴格模式: 12apple = 10;console.log(apple); //10 使用了嚴格模式： 123"use strict";apple = 10;console.log(app ...

前言今天要來介紹什麼是Arrow Function，這個是一個看起來非常簡單的語法，因為=>就像是箭頭一樣所以叫做Arrow Function，它可以直接把函式的建立變成簡化版，看起來像是這樣： 1let arrow = (a, b) => a + b; 會叫做Arrow Function也是因為=>就像是一個箭頭的關係，雖然看起來很簡單，但其實我自己在寫時常常忘記怎麼寫,利用這次寫文章的機會來複習一下。 過去與現在Arrow Function是 es6 之後才出來的新語法，意味著在此之前都是只能用以下這些方式。 一般做法： 12345function past() { return "過去做法";}console.log(past()); // 過去做法 匿名做法： 12345let past = function () { return "過去做法";};console.log(past()); // 過去做法 es6 之前只能用上面那兩種方式，之後多了一種箭頭函式可用。 而 ...

前言之前講的是常用的邏輯運算子，而有一個比較特別的，寫法是兩個問號。之前看不太懂，趁著今天研究出來順便寫自己的理解，接下來就直接開始。 ??根據 MDN 的解釋，當左邊的值是null或是undefined時，會回傳右邊的值，假如不是null或是undefined就會回傳左邊的值。 還記得前天講的||嗎？ ||是碰到第一個真值就回傳。 而當一個值，如果它不是null也不是undefined，那它就會是defined，意思是一個已經定義的值。 所以||跟??來做比較的話： ??會回傳第一個已經定義的值 ||會回傳第一個遇到的真值(true) 來試試看 => 左邊是null時，會回傳右邊的值，左邊不是null或是undefined，就會直接回傳左邊的值。 12console.log(null ?? 100); // 100console.log(50 ?? null); // 50 MDN 只有說左右兩側，測試看看假如兩組值以上的狀況。 12console.log(null ?? null ?? 100 ?? 50); // 100console.log(50 ?? n ...

今天來講昨天沒講完的兩個Logical operators。 Logical AND (&&) Logical NOT (!) Logical AND (&&)會用&&來判斷&&兩邊的值，最基本的判斷是兩邊只有true跟false值的話，全部為true才會是true，只要有一個false就會直接回傳成false。 舉例來說，假如小白他想要合法的騎車，他就必須滿足以下條件: 滿 18 歲 獲得機車駕照 有一台車 有安全帽 其中，假如有一項沒有達成也就是false，那麼最後的結果也會是回傳false，沒有辦法騎車。 123目前狀況 = 已滿18歲 && 已有駕照 && 已有車 && 沒有安全帽;可以騎車嗎? => 不行 同等於 123const condition = true && true && true && false;console.log(condition); // false 而跟||一樣，有著操作 ...

今天要來介紹的是Logical operators，最主要有這三種常常使用 => || => OR 運算子 && => AND 運算子 ! => NOT 運算子 學習在這邊的時候可能會有疑問，運算子(operators)是什麼? 拿去 google 會發現它似乎會常常被跟運算式(Expressions)一起談論。 Expressions and operators可以用一個簡單的 1+1 來了解這個概念。 1const X = 1 + 1; //2 1+1會等於2應該沒問題，而這個X = 1+1其實就是Expressions，這個Expressions會產生一個2的值，那麼operators在哪裡？ 在這個X = 1+1的Expressions裡面，=是一個operators，+也是一個operators，實際上，Expressions就是透過operators來進行運算的，透過operators的運算獲得最後的「值」。 是的，加、減、乘、除都是operators，除了計算之外，operators也可 ...

今天假如要寫一個求 1 + 2 + … + n 的總和，一般人可能很直覺的就想到說，要用迴圈的方式把所有值都加在一起。 123456789function add(n) { let result = 0; for (let i = 1; i <= n; i++) { result += i; } return result;}console.log(add(5)); // 15 但除了迴圈之外，還有另外一種名為遞迴的技巧也能達成相同的效果。 123456789function add(n) { if (n === 1) { return 1; } else { return n + add(n - 1); }}console.log(sum(5)); //15 我們先來看一下遞迴(recursion)在mdn上面的定義： The act of a function calling itself, recursion is used to sol ...

前言今天要來講的主題是this，在JavaScript中的this可以在呼叫函式時，透過不同方式決定它要指向哪一個物件，而關於什麼時候會指向什麼地方，這就是this的困難之處。 理解this來由一開始自己的猜測理解是，有些很冗長的名字，假如有一個代名詞，去代替它會很好很多。 比如說，我要描述在一家便利商店打工的小白擁有的東西： 在便利商店打工的小白擁有著一台機車，在便利商店打工的小白還有隨身攜帶一個水壺，而且在便利商店打工的小白手中現在還拿著一個過期的超商飯糰。 假如把「便利商店打工的小白」用「他」來替換掉的話： 在便利商店打工的小白擁有著一台機車，「他」還有隨身攜帶一個水壺，而且「他」手中現在還拿著一個過期的超商飯糰。 程式碼寫起來概念會像這樣： 這邊變數名稱就不要太長單純是white就好，但可以想像成叫做SuperWhiteWorkingInAConvenienceStore比較符合概念。 1234567891011const white = { transportation: "motorcycle", thing: "kettle&q ...

前言ES6 才加入的primitive type，我個人覺得是primitive type當中最難理解的。 object的key在 ES6 之前都只能是字串，就算寫成數字也會被轉成字串，所以之前我會說，object的key只能是字串，但這個說法被symbol打破了，它也可以拿來當作object的key，而它為什麼可以，以及symbol是處理什麼領域的問題，讓我們看下去吧。 特性：獨一無二symbol可以直接跟獨一無二的值劃上等號，只會有一個保證是唯一的，這其實就是可以拿來當作object的key的原因，不會重複很適合拿來幫物件取名。 這樣記：只要透過symbol建立的值，都會獲得特性：獨一無二。 建立：symbol建立symbol的方式很簡單，只要使用Symbol()即可，不需要用new。 1234// 語法const fruit = Symbol();console.log(typeof symbol); // symbol 可以給Symbol裡面加名字，在Symbol()的()裡面，可以當作它是這個變數fruit的描述，而它的類別是Symbol。 由於特性：獨一無二，所以當名字都 ...