雜談

初始化

前言

在撰寫實體物件語法的時候往往都會有一些錯誤，所以課堂上也特別舉例出來。

初始化 （initialization）

初始化只是一個章節名稱，但主要內容都是在講解比較常見的範例錯誤，舉例…

var people = {
  {
    firstname: 'John',
    lastname: 'Doe',
    address: [
      '111 Main St.',
      '222 Third St.'
    ]
  },
  {
    firstname: 'John',
    lastname: 'Doe',
    address: [
      '333 Main St.',
      '444 Third St.'
    ]
  }
}

當我們在物件實體語法越來越大的時候，往往就很容易出現一些錯誤，而這些錯誤常常會導致新手害怕，舉例像這種錯誤。

那會出現錯誤的過程就是初始化的一種，因為他要將物件給初始化，而語法解析器發現我們所撰寫方式不正確提示的錯誤訊息。

「typeof」、「instanceof」與搞清楚這是什麼

前言

我們已經瞭解 JavaScript 是一個動態型別的語言，這可以讓我們做一些很特別的事情，但也很危險，一般來講如果我們要知道一個變數的型別通常都會透過 typeof，但是其實這個方法並不是很好，所以這章節將會講解「typeof」、「instanceof」。

「typeof」、「instanceof」

我知道標題「typeof」、「instanceof」與搞清楚下的很奇怪而原文翻譯是「typeof, instanceof, and figuring out what something is.」，但這是課程的標題，所以就照打了，那麼這邊就直接進入範例。

題外話，課程上的 typeof 是這樣寫 console.log(typeof a);，而我是習慣這樣寫 console.log(typeof(a)); 兩者結果都是相同不用擔心。

var a = 3;
console.log('a: ' + typeof(a));
var b = 'Hello';
console.log('b: ' + typeof(b));
var c = {};
console.log('c: ' + typeof(c)); 
var d = [];
console.log('d: ' + typeof(d));
console.log('d prototype call: ' + Object.prototype.toString.call(d));

function Person (name) {
  this.name = name;
}

var e = new Person('Jane');
console.log('e: ' + typeof(e));
console.log(e instanceof Person);
console.log('undefined: ' + typeof(undefined));
console.log('null: ' + typeof(null));

所以由此可知在 JavaScript 中陣列就是物件，這很重要。

接下來講 instanceof，這個方法主要是告訴我們物件有沒有在原型鏈上，如果有就會回傳 true，若沒有就是false。

再來是 undefined，undefined 是 JavaScript 的特別關鍵字，所以直接回傳 undefined 這也沒問題。

最後 null 這個東西在課堂上老師稱之為 JavaScript 的萬年 bug，所以才會得到像這樣的結果。

嚴謹模式

前言

經過前面幾個章節的理解，其實我們可以知道 JavaScript 的自由性是很高的，但是如果你今天希望 JavaScript 比較嚴格的話，這也是可以的，只需要透過一個方式就可以讓 JavaScript 進入嚴格模式。

嚴謹模式 (strict mode)

一般來講使用嚴謹模式絕對會有一定性的陣痛期，因為人難免會習慣自由，但是使用嚴謹模式主要的目的是為了解決一些不必要的奇怪問題，所以該如何替自己的 JavaScript 開啟嚴謹模式?開啟後又有何差異，就讓我們由範例來瞭解吧。

以下範例是非嚴謹模式，一般來講打錯字是我們最常做的事情，那如果今天這樣子呢?會跳錯嗎?

var person ; 
persom = {};
console.log(persom);

不會，它並不會犯錯，原因為什麼?因為 JavaScript 的自由關係，在語法解析器它在辨別 persom 時，會找看看執行環境下有沒有一下叫 persom，若沒有它就會自作主張幫我們補上 var，那通常這會導致一些 debug 上的問題。

那該怎麼避免這種狀況?這時候就要使用嚴謹模式，嚴謹模式的啟用方式非常簡單，只需要在最前面寫上一段 "use strict" 即可，這時候我們再看看範例會變怎樣。

"use strict";
var person ; 
persom = {};
console.log(persom);

這時候我們會得到 「Persom is not defined uncaught reference error」。

這邊有一個細節要注意 "use strict" 一定要放在所有程式碼最前面，否則會沒有效果。

當然也可以針對特定的執行環境下有嚴格模式。

function logNewPerson() {
  "use strict";
  var person2;
  persom2 = {};
  console.log(persom2);
}
"use strict";
var person; 
persom = {};
console.log(persom);
logNewPerson();

使用 "use strict"; 是一個很好的方式，可以幫助我們減少一些不必要的錯誤，但通常也會建議搭配一些 JavaScript 風格管理(ESlint)，或是改寫 TypeScript。

那因為自己還沒有學習 TypeScript，所以沒辦法提出範例作解講，但是我將參考資料放在這裡。

TypeScript入門 {學習筆記}
TypeScript 入门教程

另外補充如果想再多了解 嚴謹模式 (strict mode) 的話，這邊我也提供相關資料。

MDN
卡斯伯
iT邦幫忙

tags: WierdJavascript