Archive: 2018/8

2018
0

Promise

JavaScript 有些程式是非同步的(例如 ajax, setTimeout, setInterval)，為了確保這些非同步程式能照我們想要的順序執行，我們使用了回呼函式 (以下稱 callback function) 來達成我們的需求，但 callback function 有個問題是只要程序一多，程式碼會變得非常難以閱讀，於是 ES6 提出了一個解決方案：Promise。 甚麼是 Prom

0

預設參數(Default parameters)

函式的傳入參數預設值，在未指定實際的傳入值時，一定是 undefined，ES6 的函式預設參數允許沒有值傳入或是傳入值為 undefined 的情況下，參數能以指定的預設值初始化，指定不同的預設值可能在某些情況很管用。 在以前還沒有預設參數的時候，程式會以||防呆，以免參數為 undefined。 1234567891011function foo(x, y){ x = x || 1

0

類別(Classes)

在 ES6 以前，想要簡化相同程式碼，必須用 prototype 原型來達到類與類繼承，ES6 引入了類別(Class)作為 JavaScript 現有原型程式(prototype-based)的語法糖，提供了一個更簡潔的語法來建立物件與處理繼承。 類別(Classes)實際上是一種特別的函數，就跟你可以定義函數敘述和函數宣告一樣。透過 Class 建立物件，將兩個或多個物件的相同結構抽取出來變成

0

分散 / 其餘(Spread/Rest)

ES6 引進一個新的 … 運算子(你沒看錯，就是三個點)，它通常被稱為 spread(分散) 或 rest(其餘) 運算子，取決於被使用的時機與方式。 分散(Spread)分散(spread)用於將 陣列 展開為個別的值。123const numbers = [1, 2, 3]const newNumbers = [...numbers, 4]console.log(newNumbers) //[

0

箭頭函式(Arrow Function)

箭頭函式 Arrow Function 是 ES6 非常受人喜愛的功能，同時支援普通函式所具備的功能，包括預設值、解構、rest 參數，它擁有以下幾個特性： 更短的函式寫法(怎麼寫) 綁定 this(怎麼用) 更短的函式寫法先說結論，使用箭頭函式，以下兩種寫法是相等的。123456//normal functionfunction add(x){ return x + 5}

0

模組(Modules)

Modules 模組系統是 ES6 的新功能，透過 import 與 export 關鍵字，你可將以往冗長且結構複雜的程式碼拆解成各個小區塊，以便我們可以把A檔案的程式碼導入到B檔案使用。Exports 有兩種輸出方式，分別是 Default export 與 Named exports 預設匯出(Default export)Default export 的作用是為模組指定預設輸出。舉個例子，假

0

解構賦值(Destructuring Assignment)

解構賦值是 ES6 的新特性，可以將陣列或物件中的資料取出成獨立變數。 陣列解構陣列解構強調順序，左右對照相對應的元素，右邊陣列的值即可對左邊陣列相對應的元素賦值。123456var foo = ['a', 'b', 'c'];var [one, two, three] = foo;console.log(one); // "a"console.log(two); // "b"console.lo

0

let 和 const

範疇在 ES6 之前，在 Javascript 要宣告變數必須要用 var。1var a = 100以 var 宣告的變數，作用範疇以 function(函式) 為基準，如果在 funciton 以外宣告，叫做全域變數，在檔案的各個位置都能使用。 在 function 以內宣告，叫做區域變數，它的作用範疇只存在於其宣告的 function 之內，離開該 function，此變數將不能再被使用。1

0

react 簡單入門

本系列是我學習 React 的心得筆記，主要參考 Udemy 上的 React 線上課程 React 16 - The Complete Guide，並輔以 React官方文件、css88 React中文文件，如有說錯或說不好之處，請各位不吝指教。 什麼是 React?JavaScript library for building user interfaces。 React 官網開宗明義的第