TS--类(class)

一、基本知识

        含义:它是用来创建具有相似属性和行为的对象的一个模板或蓝图。类定义了对象的属性(成员变量)和行为(成员函数),并通过创建对象来实例化类。对象是具有类类型的变量

        类与对象的关系:(1)类是对象的抽象,而对象是类的剧吐实例

                                     (2)类是抽象的,不占用内存,而对象是具体的,占用存储空间

                                     (3)类是用于创建对象的规划,抽象

        

二、类

1-1.类

        用关键字class来定义类,类中的成员个数可以是0-n个:可以放的有字段(属性)、方法(函数)

        格式:添加可选属性方法和前面一样的用“?“

        

                81行:创建一个类

                82-83:添加属性name、color类型都为string

                84:添加属性age并给age赋初始值

                85:构造函数:用于初始化对象的属性,而构造函数里面的成员用于定义对象的行为

                86-88中的this是下面的Cat中传入的值

                91:创建一个对象cat

                92:打印cat

                

三、对象和内存

  1. new多次本质上是创建了多个了对象, 只有创建了对象,才能使用对象访问对象的字段或方法;

  2. 对象在堆中,计算机堆中内存无名字,只能通过地址使用之,堆中对象地址通过hash后得到引用值,引用类型变量保存的就是引用值;

  3. 每个对象都有唯一引用, 只能通过对象的引用使用对象, new 会返回对象的引用(this);

  4. 当类中定义了属性,该类的每个对象都会独立开辟出属性成员,当前对象独享;

  5. 创建对象时,方法不会被开辟出来,同一个类的方法被所有该类对象共用(原型和原型链);

  6. 同一对象可被多个变量引用,当一个对象没有引用时,对象的生命就被GC(拉圾回收机制)管理了, 当对象销毁时,对象中独享的字段成员也会随之销毁;

  7. 只有类不能做事情,类的对象才有用, 类成员(静态成员例外)

四、this:和js中的this用法一样,谁调用,this就指向谁

五、构造函数(constructor)

        含义:构造函数是类中的一种特殊方法,它在创建类的实例时自动调用,用于初始化对象的属性和执行其他必要的操作。可以有0-n个参数,构造函数没有返回值,也不用声明返回值类型

        

六、静态方法

        含义:使用 static 修饰符修饰的方法称为静态方法,它们不需要实例化,而是直接通过类名来调用。

                

        

七、存取器

        含义:允许我们通过 getter 和 setter 方法来控制对类属性的访问和赋值操作

        格式:

八、继承(extends)

        含义;将公共部分封装到一个类中,要使用的时候直接用extends来即可

        格式:

class animal {
    name: string
    age: number
}
class dog extend animal{//此时dog类中在有了play着一个属性的同时,还拥有了animal类中的所有属性
    play: boolean

}

注:1.子类先执行,在执行子类的过程中运行父类

        2.一个子类只能继承一个父亲,而一个类可以有多个子类。子类也可以作为别的类的父类

        3.子类继承父类后并不影响父类的使用

        4.子类对象可以访问从直接父类或间接父类继承下来的成员(父母的父母的父母。。。。)

九、super

        含义:用于访问父类(基类)的方法和属性的关键字

        与this相比:super(范围小一些)主要访问父类对象,this(范围打一下)访问子类对象,也可以访问父类对象。通常用this来访问数据,super修改父类成员

  1. 如果派生类(自己创建的类没有自己的构造函数,则会使用默认的构造函数,并在其中隐式调用父类的构造函数。
  2. 如果派生类具有自己的构造函数,则必须在派生类的构造函数中使用 super() 来调用父类的构造函数。若父类里面什么也没有,子类的构造函数中也必须使用super()
  3. 在构造函数中使用 super() 调用父类的构造函数时,必须确保它是构造函数中的第一条语句。

        

十、访问权限修饰符

修饰符分类:public(公用的)、protected(受保护的)、private(私有的)

修饰符当前内部子类内部对象
public可以可以可以
protected可以可以不可以
private可以不可以不可以

1.public(公用的)

        含义:被public修饰的成员(字段和方法)在任何地方都能被访问

2.protected(受保护的)

        含义:被修饰的成员可以在所属类内部和子类中能被访问,在外部(对象)无法访问。

3.private(私有的)

        含义:被修饰的成员只能在该成员所属类内部被访问,在外部无法访问。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
01Typescript介绍 、Typescript安装、Typescript开发工具(15分51秒).rar 02 Typescript 中的数据型 boolean 数字型 number型 string型 array型元组型 (tuple)枚举型 (enum) (上) (20分29秒).rar 03 Typescript中的数据型 任意型 (any) null 和 undefined void型 never型 (下) (16分6秒).rar 04 Typescript中的函数 函数的定义 可选参数 默认参数 剩余参数 函数重载 箭头函数 (31分50秒).rar 05 Typescript中的 Es5中的和静态方法 继承 (原型链继承、对象冒充继承、原型链+对象冒充组合继承) (20分40秒).rar 06 Typescript中的 的定义 继承 里面的修饰符 (上) (29分4秒).rar 07 Typescript中的 中的静态属性 静态方法 抽象 多态 (下) (27分52秒).rar 08 Typescript中的接口的用途 以及属性型接口 (19分46秒).rar 09 Typescript中的属性型接口【案例】 定义Ajax请求数据的接口 ts封装ajax (8分).rar 10 Typescript中的函数型口 【案例】 加密方法约束 (5分11秒).rar 11 Typescript中的可索引接口 型接口 (12分2秒).rar 12 Typescript中接口扩展、接口的继承 (7分19秒).rar 13 Typescript中的泛型 泛型变量 泛型 (22分54秒).rar 14 Typescript的泛型接口 泛型接口 (8分42秒).rar 15 Typescript泛型 - 把作为参数型的泛型 (21分47秒).rar 16 Typescript 型、接口、 、泛型 综合使用--Typescript封装统一操作Mysql Mongodb Mssql的底层库 (14分31秒).rar 17 Typescript 模块 以及模块化封装DB库 封装似Mongoose风格的库 (25分22秒).rar 18 命名空间 命名空间块化 (11分35秒).rar 19 装饰器定义 装饰器 属性装饰器 装饰器工厂 (23分17秒).rar 20 装饰器 方法装饰器 方法参数装饰器 装饰器的执行顺序 (28分39秒
在Vue 3中,使用TypeScript时,v-for与ref组合式API的型问题可以通过以下步骤解决。 首先,根据提供的代码片段,我们可以看到在v-for循环中使用了ref。为了解决型问题,我们需要定义一个型myType,它可以是ComponentPublicInstance、Element或null。然后,我们可以使用ref创建一个divs变量,型为Array<HTMLDivElement>,并初始化为空数组。接下来,我们定义一个名为setRef的函数,它接受一个参数el,并将el型转换为HTMLDivElement,并将其推入divs.value数组中。因此,我们可以确保divs数组中的元素都是HTMLDivElement型。 其次,根据引用和引用提供的tsconfig.json配置,我们可以看到在target字段中使用了不同的值。在引用中,使用了"target": "es2015",而在引用中,使用了"target": "es5"。为了解决这个问题,我们可以将tsconfig.json文件中的目标字段(target)设置为"es2015"。 综上所述,要解决vue3 ts中v-for与ref组合式API的型问题,需要注意以下几点: 1. 定义适当的型,如myType,以确保v-for循环中的元素与ref的型匹配。 2. 使用ref创建一个数组,并确保数组中的元素具有正确的型。 3. 在tsconfig.json中将目标(target)字段设置为"es2015",以解决JS API版本太低的问题。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [vue3+ts中,v-for与ref组合式API型问题](https://blog.csdn.net/qq_36081714/article/details/127316368)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *2* *3* [vue3+ts使用v-for出现unknown问题](https://blog.csdn.net/Heartbroken_man/article/details/123096263)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值