TypeScript 从入门到进阶之基础篇(四) symbol类型篇

在这里插入图片描述

系列文章目录

TypeScript 从入门到进阶系列

  1. TypeScript 从入门到进阶之基础篇(一) ts基础类型篇
  2. TypeScript 从入门到进阶之基础篇(二) ts进阶类型篇
  3. TypeScript 从入门到进阶之基础篇(三) 元组类型篇
  4. TypeScript 从入门到进阶之基础篇(四) symbol类型篇
    持续更新中…


前言

前面我们了解了 基础类型、引用类型、元组类型的使用,本章我们来了解TypeScript中如何使用symbol类型,当然 symbol类型要是属于JavaScript,可能有很多同学还不知道symbol

symbol类型 是 ES6 引入的一种新的原始数据类型,用来表示唯一的、不可变的值。Symbol值通过Symbol()函数生成,每个Symbol值都是唯一的,可以用于对象的属性名,从而避免属性名冲突的问题。自ECMAScript 2015起,symbol成为了一种新的原生类型。

一、symbol类型的使用

要创建一个Symbol值,可以使用Symbol构造函数,创建时可以穿一个唯一参数作为唯一标识。

注意:参数只能是number类型string 类型

//正确使用
const mySymbol = Symbol();
const mySymbol =Symbol('我是唯一标识');

二、symbol类型的使用场景

Symbol类型在JavaScript中是一种新的数据类型,它的主要用途是作为对象属性的唯一标识符。以下是一些Symbol类型的使用场景:

1. 用作对象属性名:

Symbol类型的值可以作为对象的属性名,这样可以确保属性的唯一性,避免属性名冲突的问题。

const obj = {};
const symbol1 = Symbol('foo');
const symbol2 = Symbol('foo');

obj[symbol1] = 'value1';
obj[symbol2] = 'value2';

console.log(obj[symbol1]); // 'value1'
console.log(obj[symbol2]); // 'value2'

//也可以这样使用
const symbol3= Symbol();

let objMap={
 [symbol3]:'我是值'
}

console.log(objMap[symbol3]); // "我是值"

2. 用作常量:

Symbol类型的值是唯一且不可变的,可以作为常量使用。在这种情况下,使用相同的Symbol值可以确保常量的唯一性。

const LOG_LEVEL = {
  DEBUG: Symbol('debug'),
  INFO: Symbol('info'),
  ERROR: Symbol('error')
};

function log(level) {
  if (level === LOG_LEVEL.DEBUG) {
    console.log('Debug message');
  } else if (level === LOG_LEVEL.INFO) {
    console.log('Info message');
  } else if (level === LOG_LEVEL.ERROR) {
    console.log('Error message');
  }
}

log(LOG_LEVEL.INFO); // 'Info message'

3. 用作私有属性或方法名:

Symbol类型的值不会被默认遍历到对象的属性列表中,这使得它可以用作私有属性或方法名,不会被外部访问到。

const obj = {};
const privateProperty = Symbol('private');

obj[privateProperty] = 'private value';

console.log(obj[privateProperty]); // 'private value'
console.log(obj.privateProperty); // undefined

需要注意的是,Symbol类型的值不是字符串,虽然可以给Symbol传递一个描述参数,但描述参数只是作为标识符的可读性提示,不会影响Symbol的唯一性。

三、symbol类型的使用注意事项

使用symbol类型时有一些注意事项:

  1. Symbol是一种原始数据类型,可以用作对象属性的唯一标识符。每个symbol都是唯一且不可变的,不同于字符串类型的属性名可以重复。

  2. Symbol类型的变量不能通过直接访问来获取它们的值,因为它们没有固定的名称。相反,可以使用变量名和Symbol的描述符作为参数访问变量。例如:console.log(mySymbol)。

  3. 可以使用Symbol类型作为对象属性名。这样可以确保属性的唯一性。例如:const obj = {[mySymbol]: “value”}。

  4. Symbol类型的变量可以作为对象的私有属性,因为它的值不会被意外修改或覆盖。

  5. Symbol类型的变量在使用JSON.stringify()方法时会被忽略。这是因为JSON.stringify()默认情况下只序列化对象的可枚举属性,而Symbol类型的属性默认为不可枚举。

  6. 可以使用Object.getOwnPropertySymbols()方法来获取对象中所有的Symbol属性。

  7. Symbol类型的变量可以作为迭代器的唯一键,例如Symbol.iterator可以用于实现自定义迭代器。

  • 28
    点赞
  • 27
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
好的,下面是 TypeScript入门到精通教程: # TypeScript 入门教程 ## 什么是 TypeScriptTypeScript 是一种由微软开发的静态类型语言,它是 JavaScript 的超集,意味着它包含了 JavaScript 的所有内容,并且添加了一些新的特性。TypeScript 可以编译成纯 JavaScript,并且可以在任何地方运行。 TypeScript 的主要特点包括: - 强类型TypeScript 可以在编译时检查类型错误,从而提高代码质量和可维护性。 - 面向对象:TypeScript 支持类、接口、继承等面向对象编程特性。 - 模块化:TypeScript 支持模块化,可以将代码分成多个模块,以便更好地组织和管理代码。 - 可读性:TypeScript 支持类型注解和接口定义,使代码更容易阅读和理解。 ## 安装 TypeScript 要开始使用 TypeScript,您需要先安装 TypeScript 编译器。您可以使用以下命令在全局范围内安装 TypeScript: ``` npm install -g typescript ``` ## 第一个 TypeScript 程序 创建一个名为 `hello.ts` 的文件,并将以下代码添加到文件中: ```typescript function sayHello(name: string) { console.log(`Hello, ${name}!`); } sayHello("TypeScript"); ``` 要编译 TypeScript 文件,请在命令行中导航到 TypeScript 文件所在的目录,并运行以下命令: ``` tsc hello.ts ``` 这将生成一个名为 `hello.js` 的 JavaScript 文件。要运行这个 JavaScript 文件,请在命令行中运行以下命令: ``` node hello.js ``` 这将输出以下内容: ``` Hello, TypeScript! ``` ## 类型注解 TypeScript 支持类型注解,可以在变量名后面使用冒号来指定变量的类型。例如: ```typescript let name: string = "TypeScript"; let age: number = 10; let isStudent: boolean = true; ``` 在上面的例子中,我们声明了三个变量,并将它们的类型分别设置为字符串、数字和布尔值。 ## 接口 接口是 TypeScript 的一个重要特性,它用于定义对象的形状。例如,以下是一个 `Person` 接口: ```typescript interface Person { name: string; age: number; } let person: Person = { name: "TypeScript", age: 10 }; ``` 在上面的例子中,我们定义了一个 `Person` 接口,它有两个属性:`name` 和 `age`。我们还创建了一个 `person` 对象,并将它的类型设置为 `Person`。 ## 类 TypeScript 支持类,可以使用类来创建对象和继承。以下是一个 `Animal` 类的示例: ```typescript class Animal { name: string; constructor(name: string) { this.name = name; } move(distance: number = 0) { console.log(`${this.name} moved ${distance}m.`); } } class Dog extends Animal { constructor(name: string) { super(name); } bark() { console.log("Woof! Woof!"); } } let dog = new Dog("Fido"); dog.move(10); dog.bark(); ``` 在上面的例子中,我们定义了一个 `Animal` 类和一个 `Dog` 类,并使用 `extends` 关键字将 `Dog` 类继承自 `Animal` 类。我们还创建了一个 `dog` 对象,并调用了 `move()` 和 `bark()` 方法。 ## 模块 TypeScript 支持模块化,可以将代码分成多个模块,并使用 `import` 和 `export` 关键字来管理模块之间的依赖关系。以下是一个简单的模块示例: ```typescript // greeter.ts export function sayHello(name: string) { console.log(`Hello, ${name}!`); } // main.ts import { sayHello } from "./greeter"; sayHello("TypeScript"); ``` 在上面的例子中,我们将 `sayHello()` 函数定义在 `greeter.ts` 文件中,并使用 `export` 关键字将它导出。然后在 `main.ts` 文件中,我们使用 `import` 关键字将 `sayHello()` 函数导入,并调用它。 ## 总结 以上是 TypeScript入门教程,涵盖了 TypeScript 的主要特性,包括类型注解、接口、类和模块。这些特性可以帮助您编写更安全、更可维护的 JavaScript 代码。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

枫ゞ

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值