# Javascript - 20190616保哥課程

### 特性
* 無型別
* 弱型別，只能在執行時期檢查型別
* 只要有任何一個物件沒有被參考到，即立刻被回收
* 是call by value reference，官方說法為call by sharing

### 物件(Object)：在記憶體內的資料，執行期間才有的東西
1. 屬性，物件下的屬性名稱只能是字串，例如：car.start、car['start']
2. 物件是個不能比較的東西，例如：字串不能跟物件比
> 存取一個未定義的屬性會回傳undefined
> 取得一個未定義的屬性會回傳error

### 變數(Variable)：在執行時期只會用來儲存物件的記憶體位址（指標）

const a = 1  // 在執行時期a等於指向1的記憶體位址

1. 變數宣告後，不能被刪除

var a  = 1
window['a'] = 2
delete window['a'] 

console.log(a) //2
console.log(window['a']) //2

2. 用var、const、let宣告的就叫做變數
3. 不在function內宣告的變數，就叫做全域變數
4. 在function內宣告的變數，就叫做區域變數

var a = 1; 
// 宣告一個a的變數，將1這個物件的記憶體位置複製給a
var b = a;
// 宣告一個b的變數，然後 b 指向的位置跟 a 是一樣的記憶體位置

//請問這兩行在記憶體中建立過幾個物件？
//1個 a跟b是兩個變數 讀的是同一個物件
//
var a = 1;  // 宣告一個a的變數，將1這個物件的位置複製給a
var b = a;  // 宣告一個b的變數，a的內容是記憶體1的位置，複製給b
a //1
typeof a //'number' 指向1的型別

5. 自己可以指向自己

window.window.window === window  // 指向window
delete window.window  // 不可以被刪除

console.log呈現

### 型別(Type)

* 原始型別 - 無法自由擴增屬性、不允許擁有屬性
1. number
1-1. parseInt 邏輯
> 應該要傳字串進去，例如parseInt("0.001");
> 從第一個字開始解析，解析到看不懂就會直接忽略
> 

1-2. 判斷NaN寫法：isNaN()

2. string
3. boolean
4. null
5. undefined
6. symbol
7. BigInt：任何人用BigInt做計算，永遠不會overflow、不能做小數計算 (尚未是個原始型別，但未來可能是)

* 物件型別 - 可以自由擴增屬性
1. 原生物件
* Array
* Date
* Math
* RegExp正規表示法

2. 宿主物件：
* 瀏覽器的DOM物件
* Node.js：Global

### 任何兩個物件型別的物件相比永遠為false
>

var a = {}
var b = a
a == b //true

var a = {}
var b = {}
a == b //false

> 

### 執行時期(程式碼在run的時候) <=> 開發時期(寫程式碼的時候)

### Hoisting
1. 宣告的變數會提升
2. 宣告的function會提升
3. 會印出什麼？

Answer 3:

var tmp = 'React';

(function Choose(){
    console.log(tmp); // 因為在function找不到tmp，所以往外找，找到了，故會印出 React
})();

4. 會印出什麼？

Answer 4:

var tmp = 'React';

(function Choose(){
    console.log(tmp);  // undefined
    var tmp = 'Angular';
    console.log(tmp);  // Angular
})();

### 閉包(Closure)：
1. function內有function
2. 有人參考到變數，這個變數就不會消失，反之，就會消失
3. 外層函式可以在內層函式使用

function MyFunc(){
    var i = 0;
    return {
        GetCount: function(){ i++; return i; }
    }   
})

### ES6
1. for in -> 印 key
2. for of -> 印 value

### 練習題

1. 請在一個 function 裡回傳一個物件

Answer 1:

function MyFunc() {
    return {
        Key1: 1,
        Key2: 2
    };
}

var o = MyFunc();
console.log(o.Key1);  // 回傳值為 1
console.log(o.Key2);  // 回傳值為 2

2. 請在一個 function 裡一次回傳兩個 function 物件

Answer 2:

function MyFunc() {
    return {
        GetA: function() {
            return 1;
        },
        GetB: function() {
            return 2;
        }
    };
}

var o = MyFunc();
console.log(o.GetA()); // 回傳值為 1
console.log(o.GetB()); // 回傳值為 2

3.

Answer 3:  1個變數、3個型別、5個物件

1個變數
var a;

3個型別
var a;  // undefined      
a = 1;  //number         
a = 'a'; // string 

5個物件
var a;  // undefined       物件: 1
a = 1;  //number          物件: 2
a = 'a'; // string         物件: 3
a = 'a' + a; // 前面 'a'   物件 : 1  'a'+a  物件: 2    加上前面3個共5個

### 翻譯
1. GC -> 垃圾回收

### 書單
1. javascript優良部份
2. 計算機概論
3. 物件導向
4. javascript的藝術

### 保哥課後連結
1. [我要成為前端工程師！給 JavaScript 新手的建議與學習資源整理](https://blog.miniasp.com/post/2016/02/02/JavaScript-novice-advice-and-learning-resources)
2. [JavaScript Garden](http://bonsaiden.github.io/JavaScript-Garden/zhtw/)
3. [JavaScript MDN](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript)
4. [一道常被人輕視的JS面試題](https://www.cnblogs.com/xxcanghai/archive/2016/02/14/5189353.html)
5. [return true to win](https://alf.nu/ReturnTrue)
6. [alert(1) to win](https://alf.nu/alert1)
7. Mozilla 開發者網站擁有最棒的 JavaScript 相關教學文件 (中英文都有)
https://developer.mozilla.org/zh-TW/docs/Web/JavaScript
https://developer.mozilla.org/en-US/docs/Web/JavaScript