首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Typescript只读属性赋值错误,但仍在编译

在Typescript中,只读属性是指一旦被赋值后就不能再被修改的属性。当我们尝试给只读属性赋值时,Typescript会报错并阻止编译通过。

这种错误通常发生在以下情况下:

  1. 在类的构造函数中,尝试给只读属性赋值。
  2. 在类的实例方法或静态方法中,尝试给只读属性赋值。
  3. 在类的其他方法或外部代码中,尝试给只读属性赋值。

以下是一个示例代码:

代码语言:txt
复制
class Example {
  readonly name: string;

  constructor(name: string) {
    this.name = name; // 正确的赋值方式
  }

  updateName(newName: string) {
    this.name = newName; // 错误,只读属性不能被修改
  }
}

const example = new Example("John");
example.name = "Jane"; // 错误,只读属性不能被修改

在上述示例中,我们定义了一个名为name的只读属性。在构造函数中,我们可以通过this.name = name的方式正确地给只读属性赋值。但是,在updateName方法中,我们尝试再次给只读属性赋值,这将导致编译错误。

对于这种情况,我们可以通过以下方式解决:

  1. 在构造函数中正确地给只读属性赋值。
  2. 在其他方法中避免给只读属性赋值。
  3. 如果需要修改属性的值,可以考虑将其定义为可写属性而不是只读属性。

腾讯云相关产品和产品介绍链接地址:

  • 腾讯云函数(云原生、服务器运维):https://cloud.tencent.com/product/scf
  • 腾讯云数据库(数据库):https://cloud.tencent.com/product/cdb
  • 腾讯云CDN(网络通信):https://cloud.tencent.com/product/cdn
  • 腾讯云安全产品(网络安全):https://cloud.tencent.com/solution/security
  • 腾讯云音视频处理(音视频、多媒体处理):https://cloud.tencent.com/product/mps
  • 腾讯云人工智能(人工智能):https://cloud.tencent.com/product/ai
  • 腾讯云物联网(物联网):https://cloud.tencent.com/product/iotexplorer
  • 腾讯云移动开发(移动开发):https://cloud.tencent.com/product/mobdev
  • 腾讯云对象存储(存储):https://cloud.tencent.com/product/cos
  • 腾讯云区块链(区块链):https://cloud.tencent.com/product/baas
  • 腾讯云虚拟专用云(元宇宙):https://cloud.tencent.com/product/vpc
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

TypeScript 演化史 — 第二章】基于控制流的类型分析 和 只读属性

: // 错误赋值表达式的左侧 // 不能是常量或只读属性 origin.x = 100; 一个更现实的例子 虽然上面的示例可能看起来有些做作(确实是这样),但是请考虑下面这样的函数: function...因为 x 是只读的,如果尝试这么,TypeScript 编译器会给出错误提示: image.png 相反,moveX 应该返回一个具有更新的属性值的 point,它类似这样的: function...(1); unitCircle.radius; // 1 unitCircle.area; // 3.141592653589793 // 错误赋值表达式的左侧 // 不能是常量或只读属性 unitCircle.radius...它只被编译器用来检查非法的属性分配。一旦TypeScript代码被编译成JavaScript,所有readonly的概念都消失了。您可以随意摆弄这个小示例,看看如何转换只读属性。...它只被编译器用来检查非法的属性分配。一旦TypeScript代码被编译成JavaScript,所有readonly的概念都消失了。您可以随意摆弄这个小示例,看看如何转换只读属性

2K10

TypeScript 初学者入门学习笔记(一)

1、类型系统 TypeScript 是静态类型 动态类型:是指在运行时才会进行类型检查,类型错误往往会导致运行时错误。...: foo.split is not a function 运行时会报错(foo.split 不是一个函数) 静态类型:是指编译阶段就能确定每个变量的类型,类型错误往往会导致语法错误。...age: 25, gender: 'male', year:2021 }; 只读属性 对象中的一些字段只能在创建时被赋值,可以使用 **readonly **定义只读属性: 例一:使用...例二:只读的约束存在于第一次给对象赋值的时候,而不是第一次给只读属性赋值时: interface Person { readonly id: number; name: string;...id 是只读属性 数组的类型 在 TS 中,有多种定义数组类型的方式。

1.8K20

TypeScript基础(三)扩展类型-接口和类型兼容性

除了描述对象结构外,接口还可以描述函数类型、可选属性只读属性等特性。...= 5; // 编译错误:无法分配到 "x" ,因为它是只读属性。...总结一下,TypeScript中的接口用于定义对象的结构和类型。它可以描述对象的属性、方法、函数类型、可选属性只读属性等特性。接口可以提高代码的可读性、可维护性和可重用性。...需要注意,在某些情况下可能会出现潜在的错误或不一致性,因此在使用时需要谨慎考虑。类型断言TypeScript的类型断言是一种告诉编译器某个值的具体类型的方式。...需要注意的是,类型断言只是在编译时起作用,并不会影响运行时的行为。它只是告诉编译器某个值应该被视为特定的类型,如果实际上该值不具备该类型所需的属性和方法,那么在运行时可能会导致错误

24640

TypeScript一些知识点

TS时需要编辑器直接告诉我们哪里编码错误,而不是等编译的时候再检查,所以这里更推荐第二种方式。...TypeScript中有两种顶端类型: any unknown any 类型允许执行任意操作而不会产生编译错误运行时候也可能出现错误),通常用于跳过类型检查: const a: any = 0; a.length...同时函数重载语句与其他函数重载语句或函数实现语句之间不能出现其他语句,否则将产生编译错误。函数重载语句在函数编译后将会删除。...类 TypeScript的类与JavaScript的类大多数语法都是类似的,TypeScript对类的一下功能做了扩充,如接口实现、泛型类等。...readonly b: number = 1; // 定义一个只读属性b 只读属性必须赋初始值 readonly c: number; // 只读属性初始值在构造函数中赋值 如果不赋值则报错

3310

TypeScript 元组类型

阅读须知:本文示例的运行环境是 TypeScript 官网的 Playground,对应的编译器版本是 v3.8.3。...在 JavaScript 中是没有元组的,元组是 TypeScript 中特有的类型,其工作方式类似于数组。 元组可用于定义具有有限数量的未命名属性的类型。每个属性都有一个关联的类型。...在元组初始化的时候,我们还必须提供每个属性的值,不然也会出现错误,比如: tupleType = ["Semlinker"]; 此时,TypeScript 编译器会提示以下错误信息: Property..., age] = employee; 在以上代码中,我们新增了一个 age 变量,此时 TypeScript 编译器会提示以下错误信息: Tuple type '[number, string]' of...六、只读的元组类型 TypeScript 3.4 还引入了对只读元组的新支持。我们可以为任何元组类型加上 readonly 关键字前缀,以使其成为只读元组。

1.5K20

如何使用 TypeScript 中的 as const 创建只读对象

提高类型安全性:as const 创建的对象具有固定类型,这提高了代码的类型安全性,因为编译器可以确保对象始终具有相同的属性和值。...可以与对象展开语法结合使用:可以创建一个新对象,该对象是现有对象的副本,其中一些属性使用 as const 声明为只读。...}; // newPerson.age = 35; // 这会导致错误,因为 age 是只读 深层对象的情况 对于深层对象,as const 也能保证其所有嵌套属性只读,而 const 只能保证第一层的变量不可重新赋值...,因为所有属性都是只读的 在第一个例子中,deepObject 的属性仍然可以修改。...在第二个例子中,deepReadonlyObject 的所有属性,包括嵌套属性,都是只读的,无法修改。 实际应用场景 配置文件:使用 as const 定义配置文件,确保配置项不被意外修改。

7510

掌握 TypeScript:20 个提高代码质量的最佳实践

最佳实践2:类型推断 TypeScript 的核心理念是显式地指定类型,这并不意味着你必须在每次声明变量时都明确指定类型。...类型推断是 TypeScript 编译器根据变量赋值的值自动推断变量类型的能力。这意味着你不必在每次声明变量时都显式指定类型。相反,编译器会根据值推断类型。...与 any 不同的是,当你使用 unknown 类型时,除非你首先检查其类型,否则 TypeScript 不允许你对值执行任何操作。这可以帮助你在编译时捕捉到类型错误,而不是在运行时。...这是一种很好的方式,可以向其他开发人员(和编译器)指示一个函数不能以某种方式使用,这可以帮助捕捉潜在的错误。...“只读”关键字用于使对象的属性只读,意味着在创建后它们无法被修改。例如,在处理配置或常量值时,这非常有用。

4K30

【TS 演化史 -- 16】数字分隔符和更严格的类属性检查

{ value: 42 } : {}; 在以前TypeScript会查找 { value: number }和 {}的最佳超类型,结果是 {}。 这从技术角度上讲是正确的,并不是很有用。...它们仅出现在常量声明和只读的静态属性上,并且为了引用一个存在的 unique symbols 类型,你必须使用 typeof 操作符。...TypeScript 2.7 引入了一个新的编译器选项,用于类中严格的属性初始化检查。...现在咱们的责任是确保在构造函数返回后明确地将属性赋值给它,所以必须小心;否则,username 属性可能被明显的undefined或者在运行时就会报 TypeError 错误。...上面提到过,显式赋值断言是一个新语法,使用它来告诉 TypeScript 一个属性会被明确地赋值。 但是除了在类属性上使用它之外,在TypeScript 2.7里你还可以在变量声明上使用它!

1.3K50

TypeScript 学习笔记(一)

编译型语言:编译为 js 后运行,单独无法运行; 强类型语言; 面向对象的语言; 优势 类型系统实际上是最好的文档,大部分的函数看看类型的定义就可以知道如何使用; 可以在编译阶段就发现大部分错误...“boolean”是基元,“Boolean”是包装器对象。如可能首选使用“boolean”。...Wed 和手动赋值的 Thu 取值重复了,但是 TypeScript 并不会报错,该种情况可能会引起取值错误,所以使用的时候最好避免出现取值重复的情况。...: number; [propName: string]: any; } 只读的约束存在于第一次给对象赋值的时候,而不是第一次给只读属性赋值的时候 let person: Person = {...'welson', age: 2 } // => 编译报错:给对象 person2 赋值,未定义只读属性id person2.id = 1; // => 编译报错:id为只读, 不可修改 函数类型接口

2.7K10

TypeScript学习笔记(二)—— TypeScript基础

实际上,typescript推荐使用unknown,因为unknown是类型安全的。 任意值(Any)用来表示允许赋值为任意类型。...如果是 any 类型,则允许被赋值为任意类型。...注意,只读的约束存在于第一次给对象赋值的时候,而不是第一次给只读属性赋值的时候: interface Person { readonly id: number; name: string...上例中,报错信息有两处,第一处是在对 tom 进行赋值的时候,没有给 id 赋值。 第二处是在给 tom.id 赋值的时候,由于它是只读属性,所以报错了。...上面的例子中,我们需要将 window 上添加一个属性 foo, TypeScript 编译时会报错,提示我们 window 上不存在 foo 属性

5K20

Typescript真香秘笈

设置为any类型后,相当于告诉typescript编译器跳过这个变量的检查,因此可以访问、设置这个变量的任何属性,或者给这个变量赋任何值,编译器都不会报错。...: number; } const square: SquareConfig = { color: 'red', }; 只读属性: 一些对象属性只能在对象刚刚创建的时候修改其值。...你可以在属性名前用 readonly来指定只读属性。...这里主要说下typescript的class和javascript的class的不同之处: 只读属性 public、private、protected修饰符 抽象类 实现接口 只读属性 类似于接口中的只读属性...name是只读的 public、private、protected修饰符: public修饰符表示属性是公开的,可以通过实例去访问该属性。类属性默认都是public属性

5.6K20

接口_TypeScript笔记3

这种检查只针对字面量,因此: let squareOptions = { colour: "red", width: 100 }; // 正确,不检查变量squareOptions身上的多余属性 let...(index signature)来描述这种类型约束: interface NetCache { [propName: string]: string; } 只读属性 interface Point...{ readonly x: number; readonly y: number; } 紧跟在属性名前的readonly表示只读,与const约束一样,修改只读属性会抛出编译错误: let...5; P.S.const与readonly的区别在于前者用来约束变量,后者用来约束属性(变量声明之外的场景) 特殊的,只读数组有一种特别的类型表示ReadonlyArray: let ro: ReadonlyArray...(pop、push、reverse、shift等),因此不允许把只读数组赋值给普通数组: // Type 'ReadonlyArray' is missing the following

60330

Typescript学习笔记,从入门到精通,持续记录

如果是 any 类型,则允许被赋值为任意类型。...; //不报错,toString是共有属性 } 联合类型的变量在被赋值的时候,会根据类型推论的规则推断出一个类型; 4.对象的类型—接口 在 TypeScript 中,我们使用接口...如果接口中有多个类型的属性,则可以在任意属性中使用联合类型 4.3 只读属性 有时候我们希望对象中的一些字段只能在创建的时候被赋值,那么可以用 readonly 定义只读属性 interface...只读的约束存在于第一次给对象赋值的时候,而不是第一次给只读属性赋值的时候 5.数组的类型 //最简单的方法是使用「类型 + 方括号」来表示数组 let fibonacci: number[] = [1,...值 as 类型 / 值 需要注意的是,类型断言只能够「欺骗」TypeScript 编译器,无法避免运行时的错误,反而滥用类型断言可能会导致运行时错误: interface Cat {

1.9K50

TypeScript】超详细的笔记式教程【上】

前言 之前了解过TypeScript,也学习过,但是项目中没有具体的使用过,导致忘得差不多了,最近公司不是很忙,学习的时间比较多,趁这个机会,快快的过一遍,然后准备用SolidJs + TypeScript...类型推论 如果你的变量没有赋值,那么TypeScript会看你后面的值是啥类型,那你这个变量就是啥类型 let age = 12 // === let age: number = 12 age = '12..."{ name: string; }" 中缺少属性 "age",类型 "Person" 中需要该属性。...只读属性 有时候我们需要一个属性不能再被修改,需要用到readonly定义属性,举个 interface Person { readonly id: number; name: string...alice: Person = { id: 1, name: 'Alice', gender: 0 } alice.id = 2 // error: 无法分配到 "id" ,因为它是只读属性

1.1K30

初识TypeScript -基础一 (持续更新)

TypeScript 与 JavaScript 的对比 TypeScript JavaScript JavaScript 的超集用于解决大型项目的代码复杂性 一种脚本语言,用于创建动态网页 可以在编译期间发现并纠正错误...不支持模块,泛型或接口 社区的支持仍在增长,已经初具规模 大量的社区支持以及大量文档和解决问题的支持 TypeScript使用 通过线上环境学习 线上学习可以不用安装 typescript,而是直接使用...TypeScript 只会在编译阶段对类型进行静态检查,如果发现有错误编译时就会报错。而在运行时,编译生成的 JS 与普通的 JavaScript 文件一样,并不会进行类型检查。.../ 给元组错误赋值 x = [10, 'hello']; // Error 枚举,使用枚举类型可以为一组数值赋予友好的名字。...类型断言(类型转换) 两种形式是等价的,当你在TypeScript里使用JSX时,只有 as语法断言是被允许的。

1.1K10

一篇朴实的文章带捋完TypeScript基础,方法是正反对比!

以下为原文内容 目前公司的主架构已经定为了react和typescript,因此把typescript又大致捋了一下 我发现把正确的写法和错误的写法对比着来看.好像学习起来更加快速.更加有劲~ 正确的大部分人都会写...布尔值是最基础的数据类型,在 TypeScript 中,使用 boolean 定义布尔值类型: 以下都编译通过的,并且给出了说明,一句话总结,是什么类型就要赋值给什么类型,这句话够俗了吧 正确的写法 /...没有错误的写法~ 类型推论 正确的写法 // 如果没有明确的指定类型,那么 TypeScript 会依照类型推论(Type Inference)的规则推断出一个类型。....所以编译错误,因为我们只能访问此联合类型的所有类型里共有的属性或方法: function getLength(something: string | number): number{ return...//➖➖➖➖➖➖➖➖➖只读属性➖➖➖➖➖➖➖➖➖ interface Person { readonly id: number; name: string; age?

1.1K20

前端入门25-福音 TypeScript声明正文-TypeScript

拼写错误问题 而且,JavaScript 的全局变量会被作为全局对象的属性存在,而在 JavaScript 里对象的属性是允许动态添加的,这就会导致一个问题:当使用某变量,拼写错误时,js 引擎并不会报错...这段代码如果是用 TypeScript 来写: ? 这些基础的语法错误编译器甚至不用进入编译阶段,在开发者刚写完这些代码就能给出错误提示。...js 代码段,也就是说,你用 JavaScript 写和用 TypeScript 写,最后的代码都是一样的,区别在于,TypeScript 它有一个编译阶段,借助编译器可以在编译期就能发现可能的语法错误...赋值的时候,赋值的函数参数类型,返回值类型可以不显示声明,因为编译器可以根据函数体来自动推断,比如: let fun:(a:number)=>string = function (a) { return...问号表示该属性可有也可没有,可用 readonly 来表示该属性只读属性,那么在定义时初始化后就不能再被赋值。 ?

3.2K21
领券