TS中const和readonly的区别

简介: TS中const和readonly的区别

在TypeScript(TS)中,const 和 readonly 都是用于确保变量或属性不被重新赋值的工具,但它们的使用场景和语义有所不同。


1.作用域和生命周期:

const 用于声明一个变量,并且这个变量的值在初始化后不能被重新赋值。它的作用域和生命周期取决于它被声明的位置。如果它在函数内部被声明,那么它的作用域就是该函数内部;如果它在全局作用域或模块作用域中声明,那么它的作用域就是整个文件或模块。

readonly 通常用于类属性或接口属性。它确保该属性在对象被创建后不能被修改。readonly 属性的作用域和生命周期与类的实例或接口的使用相关。

2.使用场景:

const 主要用于声明常量,这些常量可以是基本类型(如数字、字符串、布尔值)、对象字面量、数组字面量等。一旦初始化,这些值就不能再被改变。

readonly 主要用于类属性,确保类的实例在创建后,这些属性的值不会被改变。它也可以用于接口,以表示接口的实现者必须提供一个只读属性。

3.语法和用途:

const 声明一个不可变的变量绑定。它告诉TypeScript编译器该变量引用一个不能被重新赋值的值。

readonly 修饰类属性时,通常与类的构造函数一起使用,以确保在对象创建时初始化属性,并且在之后不被修改。它也可以用于接口,表示该属性在接口的实现中应该是只读的。

4.类型兼容性:

由于 const 变量不可重新赋值,它的类型在初始化后就固定了。尝试给 const 变量赋一个与初始类型不兼容的值会导致编译错误。

readonly 属性也具有固定的类型,但不同的是,它的类型由类的构造函数或接口定义决定。

示例:


// 使用 const 声明一个常量 
  const myConstant: string = "Hello, World!"; 
  // myConstant = "Goodbye, World!"; // 编译错误,不能重新赋值 
  // 使用 readonly 在类中声明一个只读属性 
  class MyClass { 
  readonly myProperty: string; 
  constructor(value: string) { 
  this.myProperty = value; 
  // this.myProperty = "another value"; // 编译错误,不能在类的方法中修改 readonly 属性 
  } 
  } 
  // 使用 readonly 在接口中声明一个只读属性 
  interface MyInterface { 
  readonly interfaceProperty: string; 
  } 
  const myObject: MyInterface = { 
  interfaceProperty: "Interface Property Value" 
  }; 
  // myObject.interfaceProperty = "new value"; // 编译错误,不能修改接口实现的只读属性


总的来说,const 和 readonly 在TypeScript中都是用来实现不可变性的,但它们的用途和上下文有所不同。const 主要用于变量,而 readonly 主要用于类属性和接口属性。


相关文章
|
关系型数据库 MySQL 网络安全
|
消息中间件 监控 NoSQL
Celery 高效异步任务队列:打破常规,颠覆认知,应用实践全攻略在此!
【8月更文挑战第5天】Celery 是一款强大的异步任务队列框架,适用于后台执行耗时任务如邮件发送、报表生成等。可通过`pip install celery`安装,并配置消息代理(如Redis)以启动服务。定义异步任务使用装饰器`@app.task`,并通过`.delay()`方法执行。任务状态和结果可通过`.ready()`和`.get()`查询。异常处理支持任务重试,性能优化包括调整并发数和选用高效消息代理。Celery 能显著提升应用效率与用户体验。
1111 0
|
SQL 前端开发 数据库
django面试题(21道)
1、什么是wsgi? WSGI是Python在处理HTTP请求时,规定的一种处理方式。如一个HTTP Request过来了,那么就有一个相应的处理函数来进行处理和返回结果。
8297 0
|
缓存 负载均衡 安全
Nginx常用基本配置总结:从入门到实战的全方位指南
Nginx常用基本配置总结:从入门到实战的全方位指南
1456 0
|
前端开发 数据处理
对象数据的读取,看这一篇就够了!Object.keys()、Object.values()和Object.entries()用法详解;如何获取对象原型链上的属性
Object.keys()、Object.values()和Object.entries()都是利于对象操作的便捷方法,能有效提升数据处理的效率。 博客不应该只有代码和解决方案,重点应该在于给出解决方案的同时分享思维模式,只有思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
前端开发 搜索推荐 数据可视化
阿里低代码引擎LowCodeEngine正式开源
低代码引擎是一款为低代码平台开发者提供的,具备强大扩展能力的低代码研发框架。由阿里巴巴前端委员会、钉钉宜搭联合出品。使用者只需要基于低代码引擎便可以快速定制符合自己业务需求的低代码平台。
阿里低代码引擎LowCodeEngine正式开源
|
负载均衡 网络协议 前端开发
一文快速上手 Nacos 注册中心+配置中心!
一文快速上手 Nacos 注册中心+配置中心!
10274 0
|
机器学习/深度学习 监控 算法
RetinaNet算法2
8月更文挑战第7天
|
前端开发
react配置proxy代理的两种方式
本文介绍了在React项目中配置代理的两种方式:通过在package.json中添加代理配置,以及通过创建setupProxy.js文件来实现更复杂的代理规则。
1080 3
|
存储 缓存 API
解密 Python 集合的实现原理
解密 Python 集合的实现原理
507 12