/

JavaScript 中的命名空間

JavaScript 中的命名空間

什麼是命名空間？

命名空間是將一組實體、變量、函數、對象包裝在單一的總體下的行為。

JavaScript 有多種方式來實現命名空間，通過看例子可以更容易地理解這個概念。

創建命名空間的最簡單方式是通過創建一個物件文字：

1
2
3
4
5
6
7
8
const car = {
  start: () => {
    console.log('start');
  },
  stop: () => {
    console.log('stop');
  }
};

這樣，start 和 stop 就被命名為 car 的子集：car.start() 和 car.stop()。

它們不會汙染全局物件。

為什麼這很重要？一個好的理由是沒有任何東西能干擾它們。

這種方式還可以在對象創建後將變量分配給該對象：

1
2
3
4
5
6
7
8
9
const car = {};

car.start = () => {
  console.log('start');
};

car.stop = () => {
  console.log('stop');
};

但是它們仍然可以從外部訪問，這要歸功於 car 對象引用。

從外部完全隱藏此代碼的最佳方法是將其包裹在一個區塊中，這是一段用花括號包裹的代碼，就像 if 或 for 區塊一樣，但也可以形成獨立的區塊，像這樣：

1
2
3
4
5
6
7
8
9
{
  const start = () => {
    console.log('start');
  };

  const stop = () => {
    console.log('stop');
  };
}

現在這兩個函數在區塊外是無法訪問的。

但是，你需要注意總是使用 let 或 const，它們是區塊作用域的。

如果使用 var 的話，它就會“泄露”到區塊外。

為了解決這個問題，你可以使用函數，這是“舊的”、在 let/const 出現之前的方法：

1
2
3
4
5
6
7
8
9
(function() {
  var start = () => {
    console.log('start');
  };

  const stop = () => {
    console.log('stop');
  };
})();

現在 start 和 stop 都無法從外部訪問，即使 start 被分配給使用 var 定義的變量。

tags: [“JavaScript”, “Namespace”, “Code Organization”]