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

为什么typescript在将公共参数编译成构造函数后会产生重复赋值?

TypeScript在将公共参数编译成构造函数后会产生重复赋值的原因是因为在构造函数中,TypeScript会自动为每个类的实例创建一个新的成员变量,并将传入的参数赋值给这个成员变量。这样做的目的是为了确保每个实例都有自己的参数副本,避免不同实例之间的参数相互影响。

然而,如果在类的构造函数中使用了公共参数,并且在类的其他方法中也使用了这个参数,那么在每次调用这个方法时,TypeScript会将参数重新赋值给成员变量,导致重复赋值的问题。

为了解决这个问题,可以将公共参数声明为类的成员变量,而不是在构造函数中重新赋值。这样,在类的其他方法中使用这个参数时,就不会产生重复赋值的情况。

另外,如果希望在构造函数中使用公共参数,并且不希望出现重复赋值的情况,可以使用readonly修饰符来声明参数,将其设置为只读属性。这样,在构造函数中赋值后,就无法再对其进行修改,避免了重复赋值的问题。

总结起来,TypeScript在将公共参数编译成构造函数后会产生重复赋值的问题是因为为了确保每个实例都有自己的参数副本,而在构造函数中重新赋值。解决这个问题的方法是将公共参数声明为类的成员变量,或者使用readonly修饰符来声明参数。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

初探 TypeScript函数基本类型泛型接口类内置对象

: 参数类型和返回值类型; TypeScript 的类型定义中, => 用来表示函数的定义,左边是输入类型,需要用括号括起来,右边是输出类型,和 ES6 的箭头函数不一样 可选参数和默认参数 TypeScript...let myIdentity1:{ (arg:T):T} = identity 复制代码 可以使用带有调用签名的对象字面量来定义泛型函数,我们可以将对象字面量拿出来作为一个接口,一个泛型参数当做整个接口的一个参数...,他必须调用 super() ,他会执行基类函数构造函数里访问 this 的属性前,一定要调用 super() 。...readonly 关键字属性设置为只读,只读属性必须在声明或者构造函数里被初始化 TypeScript 使用的是结构性类型系统,当我们比较两种不同的类型的时候,如果类型成员是兼容的,我们就认为他们类型是兼容的...促使我学 TypeScript 最主要的原因是对代码有着严格的要求,某些将来可能会出现的 bug 扼杀在摇篮里。

7.3K31

盘点前端面试常见的15个TS问题,你能答对吗?

而且TypeScript不存在跟浏览器不兼容的问题,因为在编译时,它产生的都是JavaScript代码。 2 TypeScript 和 JavaScript 的区别是什么?...Typescript 是 JavaScript 的超集,可以被编译成 JavaScript 代码。 用 JavaScript 编写的合法代码, TypeScript 中依然有效。...TS 支持可选参数, JS 则不支持该特性。 TS 支持静态类型,JS 不支持。 TS 支持接口,JS 不支持接口。 3 为什么要用 TypeScript ?...TypeScript里允许开发者现在就使用这些特性,并且编译后的JavaScript可以在所有主流浏览器和平台上运行, 7 什么是构造函数构造函数作用是什么? 构造函数 ,是一种特殊的方法。...主要用来创建对象时初始化对象, 即为对象成员变量赋初始值,总与new运算符一起使用在创建对象的语句中。而TypeScript构造函数用关键字constructor来实现。

3.4K40

TypeScript基础(四)扩展类型 - 类

引言--TypeScript是一种静态类型的编程语言,它是JavaScript的超集,可以编译成纯JavaScript代码。...TypeScript引入了类的概念,使得开发者可以使用面向对象的方式来编写代码。本文介绍TypeScript的类、继承、访问修饰符和访问器的用法。...TypeScript中,可以使用关键字class来定义一个类。类可以包含属性(成员变量)和方法(成员函数)。...构造函数是一种特殊类型的方法,创建对象时被调用。在上面的例子中,我们使用关键字constructor定义了一个构造函数,并在其中接收一个参数并将其赋值给属性name。...子类的构造函数中,我们使用关键字super()调用父类的构造函数,并传递相应的参数。这样可以确保父类中定义的属性得到正确地初始化。

31130

学会这15个TS面试题,拿到更高薪的offer

而且TypeScript不存在跟浏览器不兼容的问题,因为在编译时,它产生的都是JavaScript代码。 2 TypeScript 和 JavaScript 的区别是什么?...Typescript 是 JavaScript 的超集,可以被编译成 JavaScript 代码。 用 JavaScript 编写的合法代码, TypeScript 中依然有效。...TS 支持可选参数, JS 则不支持该特性。 TS 支持静态类型,JS 不支持。 TS 支持接口,JS 不支持接口。 3 为什么要用 TypeScript ?...TypeScript里允许开发者现在就使用这些特性,并且编译后的JavaScript可以在所有主流浏览器和平台上运行, 7 什么是构造函数构造函数作用是什么? 构造函数 ,是一种特殊的方法。...主要用来创建对象时初始化对象, 即为对象成员变量赋初始值,总与new运算符一起使用在创建对象的语句中。而TypeScript构造函数用关键字constructor来实现。

3.7K50

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

使用 TypeScript 2.0,类型检查器会分析语句和表达式所有可能的控制流,在任何指定的位置对声明为联合类型的局部变量或参数产生最可能的具体类型(缩小范围的类型)。...同样由于进行了相同的控制流分析,因此以下函数 TypeScript 2.0 也可以正确进行了类型检查: function composeCommand(command: string | string...string,那么函数总是 if 语句中提前返回。...由于提前的退出行为,command 参数的类型 if 语句之后被限制为string[]。因此,对 join 方法的调用正确地检查类型。...使用 readonly 标记的属性只能在初始化期间或从同一个类的构造函数中分配,其他情况一律不允许。 来看一个例子。

2K10

TypeScript其实并不难!(建议收藏)❤

node环境 01 TypeScript开发环境的构建 安装node,安装完之后cmd查询 node npm版本号 显示版本号则说明安装成功 终端输入 npm install typescript...-g 安装成功之后输入如下命令,查看版本号 tsc --version 终端输入如下命令进行初始化 npm init -y 成功之后会出现package.json文件。...tsc --init 这个文件是我们写ts文件之后如何编译成为js文件的一个配置文件 接下来我们终端输入以下命令 npm install @types/node --dev-save 它是我们的开发环境中使用的...函数名与变量名是一样的(都需要遵循加类型的规则) 函数参数可有可无 如果参数有多个,用逗号隔开 形参(形式上的参数)和实参(真实传递的参数) 可选参数函数 function...'草莓'] let arr4:Array=[true,false,false] 构造函数赋值法(构造函数:用new来赋值) let arr1:number[]=new Array

1.6K20

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

正文-TypeScript 今天来讲讲有 Java 基础转 JavaScript 的福音:TypeScript 为什么学习 TypeScript 如果学习 JavaScript 之前已经有了 Java...那么面向对象的编程中,自定义了某个对象,并赋予它一定的属性和行为,这样的描述 Java 里很容易实现,但在 JavaScript 里却需要通过定义构造函数,对构造函数的 prototype 操作等处理...WebStrom 配置 TypeScript 编写的 ts 文件编译成 js 文件有两种途径,一是借助命令,二是借助开发工具。...但赋值的时候,赋值函数参数类型,返回值类型可以不显示声明,因为编译器可以根据函数体来自动推断,比如: let fun:(a:number)=>string = function (a) { return...还有很多细节的方面,比如在构造函数参数前面加上权限修饰符,此时这个参数就会被当做成员变量来处理,可以节省掉赋值的操作; 比如在 TypeScript 里,类还可以当做接口来使用。

3.2K21

TypeScript--deno前置学习

必须存储number类型的数据 let arr5:number[] = [1,2,true] (2)构造函数赋值 TypeScript 中使用 Array 这个引用类型来表示数组的,那么每一个数组都是...那么,我们创建数组的时候也可以使用构造函数来进行赋值。...1.不传递任何参数 构造函数中不传递参数时,Date()构造函数根据当前日期和时间创建一个Date对象。我们看下面的例子理解一下。...1.构造函数构造函数中可以传一个参数,也可以传递两个参数。一个是字符串描述,另一个是修饰符,比如g是全局修饰符,i是忽略大小写,m是多行模式。...constructor为构造函数构造函数的主要作用是给类中封装的属性进行赋值

2.6K20

TypeScript 常用知识总结

TypeScript 设计目标是开发大型应用,它可以编译成纯 JavaScript,编译出来的 JavaScript 可以运行在任何浏览器上。...JavaScript 代码可以无需任何修改的情况下与 TypeScript 一同工作,同时可以使用编译器 TypeScript 代码转换为 JavaScript。...这意味着声明为 never 类型的变量只能被 never 类型所赋值函数中它通常表现为抛出异常或无法执行到终止点(例如无限循环) 变量不要使用 name 否则会与 DOM 中的全局 window 对象下的...name 属性出现了重名 类继承使用关键字 extends,子类除了不能继承父类的私有成员(方法和属性)和构造函数,其他的都可以继承。...剩余参数 有一种情况,我们不知道要向函数传入多少个参数,这时候我们就可以使用剩余参数来定义。 剩余参数语法允许我们一个不确定数量的参数作为一个数组传入。

1.8K30

【Vue3+TypeScript】CRM系统项目搭建之 — 关于拥抱 TypeScript 这件事【下】

TypeScript 的类型检测其实最主要的针对并不是变量,而是函数。因为 JavaScript 中的函数时不考虑参数的类型和个数的。...当一个 unknown 类型的变量想要赋值给其它变量的时候,可以赋值之前做一个类型判断。...,this就表示当前的实例 构造函数中,当前对象就是当前新建的那个对象,可以通过this向新建的对象中添加属性 class Dog { name: string; age: number...super 关键字 子类中 super 就代表当前类的父类 由于子类中可能是需要额外定义其它类属性的,因此会用到了 constructor 构造函数,因此需要使用到 super 关键字来对父类进行调用...,子类构造函数中必须对父类进行调用 super(name); // => 调用父类的构造函数 } sayHello() {

8110

Typescript 使用日志(干货)

类中使用方式和在变量中类似,只是提供了一些专门为类设计的静态属性、静态方法、成员属性、构造函数中的类型等。...•对象中的兼容•函数返回值兼容•函数参数列表兼容•函数参数结构兼容•类中的兼容•泛型中的兼容 Typescript 中是通过结构体来判断兼容性的,如果两个的结构体一致,就直接兼容了,但如果不一致,Typescript...// 如果函数中的所有参数,都可以赋值目标中找到,就能赋值 let fun1 = function (a: number, b: string) {}; let fun2 = function (a:...所以,函数参数类型应该是逆变的。 2、为什么 Typescript 中的函数参数也是协变呢?...•Partial, T 中的类型都变为可选。•Exclude,从 T 中剔除可以赋值给 U 的类型。•Extract,提取 T 中可以赋值给 U 的类型。

2.5K10

【文末送书】Typescript 使用日志

类中使用方式和在变量中类似,只是提供了一些专门为类设计的静态属性、静态方法、成员属性、构造函数中的类型等。...•对象中的兼容•函数返回值兼容•函数参数列表兼容•函数参数结构兼容•类中的兼容•泛型中的兼容 Typescript 中是通过结构体来判断兼容性的,如果两个的结构体一致,就直接兼容了,但如果不一致,Typescript...// 如果函数中的所有参数,都可以赋值目标中找到,就能赋值 let fun1 = function (a: number, b: string) {}; let fun2 = function (a:...所以,函数参数类型应该是逆变的。 2、为什么 Typescript 中的函数参数也是协变呢?...•Partial, T 中的类型都变为可选。•Exclude,从 T 中剔除可以赋值给 U 的类型。•Extract,提取 T 中可以赋值给 U 的类型。

2.8K10

【TS 演化史 -- 17】各文件的JSX工厂 、有条件类型和映射类型修饰符

Preact 使用函数h创建虚拟 DOM 元素,这就是为什么咱们h指定为JSX工厂名称的原因。 我们还需要从preact包中导入h,以便它在模块中可用。...TypeScript 一个长期存在的特性要求是能够提取给定函数的返回类型。下面是ReturnType类型的简化版本,该类型是lib.es5.d.ts中预定义的。...预定义的有条件类型 TypeScript 2.8 lib.d.ts里增加了一些预定义的有条件类型: Exclude -- 从T中剔除可以赋值给U的类型。...这就是为什么B类型解析为[any],即具有一个元素的元组的原因。...InstanceType InstanceType类型提取构造函数类型的返回类型,它相当于构造函数的ReturnType。

2.5K20

TypeScript不学?你养我啊

了解TypeScript TypeScript,Type(类型),也就是说它与JavaScript相比更加注重类型,Script则说明TypeScriptJavaScript基础上实现的。...let bool = true; bool = 123 函数 js中函数是不考虑参数的类型和个数的。...function sum(a+b){ return a+b } 函数参数类型声明 我们给参数类型声明为数值,如果我们传参时赋值了字符串,就会报错。...如果返回值类型赋值为字符串那么就会报错。 字面量 像是常量 如下,冒号后直接跟值这种情况就是字面量。此时a只能被赋值为10,此时像是const常量了。...那么没有返回值的函数怎么写呢 function fn():boolean{ return true } 当然你什么不写也不会错 function fn(){ } 因为什么都不写的时候,Ts自动检测为

88420

组合类型与类型保护_TypeScript笔记9

/lib/lib.es2015.core.d.ts) Date构造函数接受一个number或string或Date类型的参数,对应类型为number | string | Date 联合类型A | B要么是...,此时左侧类型会被缩窄到: 该类实例的类型(构造函数prototype属性的类型) (构造函数存在重载版本时)由构造函数返回类型构成的联合类型 例如: // Case1 该类实例的类型 let x; if...// y从any缩窄到RegExp | Date y; } P.S.关于instanceof类型保护的更多信息,见4.24 Type Guards P.S.另外,class具有双重类型含义,TypeScript...但这仅在TypeScript的编译时成立,与JavaScript运行时概念有冲突: class A {} class B extends A {} // 构造函数prototype属性是父类实例,其类型是父类实例的类型...: () => void; } // 自定义类型保护,参数类型any缩窄到RequestOptions function isValidRequestOptions(opts: any): opts

1.6K20

TS核心知识点总结及项目实战案例分析

今天笔者复盘一下typescript在前端项目中的应用,至于为什么要学习typescript,我想大家也不言自明,目前主流框架vue和react以及相关生态的内部构建大部分都采用了typescript...本文通过介绍ts的核心知识点以及实际案例来带大家轻松掌握typescript。 概要 任何语言的学习都要有学习和思考体系,前端也不例外,笔者按照如下图所示结构来进行讲解: ?...和js的class一致, typescript的类有公共,私有与受保护的修饰符....必须在派生类中实现 } class AccountingMyAbstract extends MyAbstract { constructor() { super('小徐'); // 派生类的构造函数中必须调用...TypeScript里我们可以参数名旁使用 ?实现可选参数的功能。具体案例如下: function createName(firstName: string, lastName?

1.6K10
领券