# JavaScript學習手冊 第三版 自學筆記
## 開始前你應該要知道的事
### JavaScript 歷史
在1996年11月，Netscape宣布將JavaScript提交至Ecma國際性的非營利標準組織，Ecma International發表第一版的ECMA-26規格其實就是JavaScript。
[ECMA-262 規範](http://www.ecma-international.org/publications/standards/Ecma-262.htm)
### 撰寫工具
常見的撰寫工具有
[Atom](https://atom.io/)、[Visual Studio Code](https://code.visualstudio.com/)、[Xcode](https://developer.apple.com/xcode/)、[WebStorm](https://www.jetbrains.com/webstorm/)、[Vim](https://www.vim.org/)
這些工具幾乎都有以下功能，方便我們撰寫程式
1. Auto List Members
2. Syntax Highlighted Code
3. Auto Complete
4. Code Folding
### 一些方便的JavaScript Library
1. [jQuery](https://jquery.com/)
2. [Paper.js](http://paperjs.org/)
3. [KineticJS](https://github.com/ericdrowell/KineticJS/)
4. [Fabric.js](http://fabricjs.com/)
5. [EaselJS](https://www.createjs.com/easeljs)
6. [PixiJS](http://www.pixijs.com/) - [奔跑吧！台北：程式幕後分享](https://medium.com/@chiunhau/奔跑吧-台北-程式幕後分享-e02d0a565559)
### JavaScript 開發工具
* Git
* Node
* Gulp
* Babel
* ESLint
### 基本的程式碼架構
1. 變數、常數與常值
使用 let 或 cost 不使用 var
命名規則 Camel case 或 Snake case
2. Data type 和 Object
Boolean、Null、Number、String、Symbol、undefined，共六個
小數點問題，JavaScript採用[IEEE-754](http://grouper.ieee.org/groups/754/) double-precision floating-point

console.log(0.1 + 0.2); //0.30000000000000004

3. Special Characters
\n、\r、\\\'、\\\"、\\\$、\\\`、\\\\、\uXXXX、\v、\t、\b、\0、\f
` 稱仰音 (grave accent)

console.log(`string text line 1
string text line 2`);
// "string text line 1
// string text line 2"

var a = 5;
var b = 10;
console.log(`Fifteen is ${a + b} and
not ${2 * a + b}.`);
// "Fifteen is 15 and
// not 20."

let sym = Symbol(); // sym 聯繫了另一個 symbol object
console.log(sym);   // undefined
sym = 1;            // 注意，這是賦予另一個值(整數1)給 sym ，而不是賦值給匿名符號。


//看看下列的程式碼範例測試一下自己是否理解為什麼最後的結果是 3 和 2 。
let x = Symbol('sym');
let a = {}

a.x = 1;    // using 'x' as public key.
a[x] = 2;   // using a symbol as private key.
a['x'] = 3;

console.log(a.x);   // 3
console.log(a[x]);  // 2

4. Array and Object 避免最後一個逗號
在早期的Internet Explorer版本，最後一個逗號會產生錯誤（即使JavaScript語法允許這麼做），JSON不容許最後一個逗號。
5. Date and Regular Expression
6. Map and Set
ES6加入的新資料型態
7. Data type 的轉換

//Number，若字串無法轉換成數字會回傳NaN
const numStr = "3.33";
const num = Number(numStr);     //不是Number物件的實例

// parseInt & parseFloat，會捨棄數字以外的東西
const a parseInt("16 volts", 10); //volts會被忽略，會以基數10來解析
const b = parseInt("3a", 16);     //基數(radix)16來解析，結果為58
const c = parseFloat("15.5 kph"); //parseFloat一定會假設基數10

//valueOf()，從UTC 1970年01月01日午夜算起
const d = new Date();
const ts = d.valueOf();

// Boolean
const e = true;
const n = b ? 1 : 0;

//在 JavaScript 中，有許多數值，在邏輯判斷中，其結果與 false 等價。由於其數值實際上並非 false，因此，特別稱此類數值為 falsy value。

[falsy 參考資料](https://amobiz.github.io/2015/09/28/javascript-truthy-falsy/)

## Control flow and error handling
### If...Else Statements

if (time < 10) {
  greeting = "Good morning";  
 } else if (time < 20) {  
  greeting = "Good day";  
 } else {  
  greeting = "Good evening";  
 }

### While Loop

let i = 0;
while (i < 10) {
  text += "<br>The number is " + i;
  i++;
}
// ------------------------------
do {
  text += "The number is " + i;
  i++;
}
while (i < 10);

### For Loop

for (let i = 0; i < 5; i++) {
  text += "The number is " + i + "<br>";
}
// ------------------------------
let person = {fname:"John", lname:"Doe", age:25}; 
for (let x in person) {
  txt += person[x] + " ";
}

### 控制流程例外
1. break
2. continue
3. return
4. throw

### Metasyntax 超語法
Extended Backus-Naur Form (EBNF
## 運算式與運算子
## 函式

取的Cookie

function getCookie(cookieName) {
  const decodedCookie = decodeURIComponent(document.cookie);
  const cookieArry = decodedCookie.split(';');
  for (const cookieData of cookieArry) {
    if (cookieData.trim().indexOf(cookieName.trim() + "=") === 0) {
      return cookieData.trim().substring((cookieName.trim() + "=").length, cookieData.trim().length).trim();
    }
  }
  return 0;
}
console.log(getCookie("partnerID"));

console.log

let process = {
  env: {server:'dev'}
}

function log(...args){
  if (process.env.server === 'dev'){
    process.log(...args)
  }
}

---

相關資料：
[理解ES6中的暂时死区(TDZ)](https://segmentfault.com/a/1190000008213835#articleHeader2)

[Day 05: ES6篇 - let與const](https://ithelp.ithome.com.tw/articles/10185142)

[學習 ECMAScript 6 - var, let 和 const](http://rocksaying.tw/archives/2015/ES6_var,let,const.html)

###### tags: `javascript`、`js`、`Js`