JS零散知識(持續更新...)

頂層對象

頂層對象，在瀏覽器中指的是window對象，在Node指的是global對象。ES5以前，頂層對象的屬性與全局變量是等價的。

window.a = 1;
a // 1

a= 2;
window.a //2
複製代碼

上面，頂層對象的屬性賦值與全局變量的賦值是一致的。 ES6爲了改變這一點，一方面規定，爲了保持兼容性，var命令和function命令聲明的全局變量仍然是頂層對象的屬性；另外一方面也規定，let，const，class聲明的全局變量，不屬於頂層對象的屬性。

globalThis對象

Javascript語言存在一個頂層對象，提供全局做用域，全部的代碼都是在這個環境中運行的，可是頂層對象在各類實現裏面是不統一的。

• 瀏覽器 頂層對象是window，Node和Web worker沒有window
• 瀏覽器和web worker裏面，self也指向頂層對象，可是Node沒有self
• Node裏面，頂層對象是global，可是其餘環境中沒有global

同一段代碼爲了可以在各類環境下，都能取到頂層對象，如今通常是使用this對象，可是有侷限性。

• 全局環境下，this會返回頂層對象。可是Node和ES6模塊中，返回的是當前模塊。
• 函數裏面的this，若是函數不是做爲對象的方法運行，而是單純做爲函數運行，this會指向全局對象。可是嚴格模式下，會返回this會返回undefined。

解決方案

//保證this返回的都是頂層對象
// 方法一
(typeof window !== 'undefined'
   ? window
   : (typeof process === 'object' &&
      typeof require === 'function' &&
      typeof global === 'object')
     ? global
     : this);

// 方法二
var getGlobal = function () {
  if (typeof self !== 'undefined') { return self; }
  if (typeof window !== 'undefined') { return window; }
  if (typeof global !== 'undefined') { return global; }
  throw new Error('unable to locate global object');
};
複製代碼

參考連接

ECMAScript 6入門