TypeScript - 符號



在 TypeScript 中,符號是一種原始資料型別,它是唯一且不可變的。符號是在 ECMAScript 2015(也稱為 ES6)中引入的。

就像我們使用數字、字串或布林值來建立不同資料型別的變數一樣,我們可以使用符號型別來建立符號。

使用符號型別有很多好處,因為它提供了比其他資料型別更多的功能。在本教程中,我們將學習符號的基礎知識及其不同用途。

語法

TypeScript 中的符號是使用 Symbol() 建構函式建立的 -

let test_symbol = Symbol();

您可以將鍵作為符號引數傳遞以識別符號號。

let key_symbol = Symbol("key-for-symbol"); 

符號是唯一且不可變的

在 TypeScript 中,您可以建立多個唯一的符號。即使您使用相同的鍵建立符號,它們也將是唯一的。

讓我們建立兩個具有相同鍵的不同符號。

let first_sym = Symbol("sym");
let second_sym = Symbol("sym");
console.log(first_sym === second_sym);

以上 TypeScript 程式碼顯示了這兩個符號是唯一的並且不可比較的。

編譯後,它將在 JavaScript 中生成相同的程式碼。

輸出如下 -

false

符號作為物件屬性的鍵

符號也可以像字串一樣用作物件屬性的鍵。

在下面的示例中,我們建立了符號並定義了物件。我們使用 obj_symbol 作為物件的屬性。此外,我們可以像訪問物件的普通屬性一樣訪問它。

const obj_symbol = Symbol();
// creating the object
let object = {
   // using the obj_symbol as key of object
   [obj_symbol]: "obj value",
};
// accessing the symbol property of the object
console.log(
   "The value of the obj_symbol property in the object is " + object[obj_symbol]
);

編譯後,它將在 JavaScript 中生成相同的程式碼。

它將產生以下輸出 -

The value of the obj_symbol property in the object is obj value

帶 switch case 語句的符號

由於每個符號都是唯一的,因此我們可以將其用作 switch-case 語句的 case。當我們使用符號與 switch case 語句時,它確保每個 case 都是唯一的。如果任何 case 與作為 switch 語句引數傳遞的 case 不匹配,則它將轉到 default case。

switch(symbol) {
   case symbol1: 
      break
   case symbol2: 
      break;
}

在上面的語法中,符號作為 switch 語句的引數傳遞。之後,我們使用符號名稱後跟 case 關鍵字來建立不同的 case。

示例

在下面的示例中,我們建立了四個不同的符號。之後,我們定義了 print_symbol 函式,其中包含 switch case 語句來處理不同的 case。

在 switch case 語句中,我們使用符號值作為 case 並執行特定 case 的程式碼。

// different symbols
const symbol1 = Symbol();
const symbol2 = Symbol();
const symbol3 = Symbol();
const symbol4 = Symbol();
function print_symbol(symbol) {
   // creating the switch case statement
   switch (symbol) { 
      // different cases
      case symbol1:
         console.log("The case is symbol 1.");
         break;
      case symbol2:
         console.log("The case is symbol 2.");
         break;
      case symbol3:
         console.log("The case is symbol 3.");
         debugger;
         break;
      case symbol4:
         console.log("The case is symbol 4.");
         break;
      default:
         console.log("The case is default.");
   }
}

// calling the function
print_symbol(symbol2);
print_symbol(symbol4);

編譯後,它將在 JavaScript 中生成相同的程式碼。

它將產生以下輸出 -

The case is symbol 2.
The case is symbol 4.

唯一符號

在 TypeScript 中,Symbol 是一種原始資料型別。因此,我們只需要將其用作型別,但我們也可以使用“唯一符號”將其用作字面量。符號包含唯一符號,這意味著唯一符號是符號的子型別。

我們只能將唯一符號與 const 變數和只讀屬性一起使用。如果我們想將特定符號型別引用到另一個變數,我們可以使用“typeof”運算子。

語法

您可以按照以下語法使用符號作為使用唯一符號的字面量。

const test_symbol: unique symbol = Symbol();
let symbol1: typeof test_symbol = test_symbol;
class C {
   static readonly symb: unique symbol = Symbol("unique symbol");
}

示例

在下面的示例中,我們聲明瞭型別為 symbol 的 test_symbol,並使用 unique symbol 關鍵字將符號用作型別字面量。此外,使用者可以觀察我們如何使用 typeof 運算子將符號用作使用 let 和 var 關鍵字宣告的變數的型別字面量。

此外,我們使用了 unique symbol 關鍵字來定義只讀靜態類的成員的型別。

// here, we used the unique symbol to define the type of the sym1.
const test_symbol: unique symbol = Symbol();
// we can't reference the unique symbol to the let type of variable
// let sym2: unique symbol = Symbol();
// to reference the symbol type to the variables declared with the let keyword, using the typeof operator.
let symbol1: typeof test_symbol = test_symbol;
console.log("The value of symbol1 is " + typeof test_symbol);
// referencing the unique symbol to the static class property
class C {
   static readonly symb: unique symbol = Symbol("unique symbol");
}

編譯後,它將生成以下 JavaScript 程式碼 -

// here, we used the unique symbol to define the type of the sym1.
var test_symbol = Symbol();
// we can't reference the unique symbol to the let type of variable
// let sym2: unique symbol = Symbol();
// to reference the symbol type to the variables declared with the let keyword, using the typeof operator.
var symbol1 = test_symbol;
console.log("The value of symbol1 is " + typeof test_symbol);
// referencing the unique symbol to the static class property
var C = /** @class */ (function () {
   function C() {
   }
   C.symb = Symbol("unique symbol");
   return C;
}());

以上程式碼將產生以下輸出 -

The value of symbol1 is symbol
廣告