【朝夕教育】《鸿蒙原生应用开发从零基础到多实战》003-TypeScript 中的类

标题详情
作者简介愚公搬代码
头衔华为云特约编辑,华为云云享专家,华为开发者专家,华为产品云测专家,CSDN博客专家,CSDN商业化专家,阿里云专家博主,阿里云签约作者,腾讯云优秀博主,腾讯云内容共创官,掘金优秀博主,亚马逊技领云博主,51CTO博客专家等。
近期荣誉2022年度博客之星TOP2,2023年度博客之星TOP2,2022年华为云十佳博主,2023年华为云十佳博主,2024年华为云十佳博主等。
博客内容.NET、Java、Python、Go、Node、前端、IOS、Android、鸿蒙、Linux、物联网、网络安全、大数据、人工智能、U3D游戏、小程序等相关领域知识。
欢迎👍点赞、✍评论、⭐收藏

文章目录

  • 🚀前言
  • 🚀一、TypeScript 中的类
    • 🔎1.传统构造函数与原型链
      • 🦋1.1 构造函数
      • 🦋1.2 原型方法
      • 🦋1.3 特点:
    • 🔎2.ES6 类
      • 🦋2.1 基本语法
      • 🦋2.2 特点:
    • 🔎3.继承
      • 🦋3.1 基类与派生类
      • 🦋3.2 关键点:
    • 🔎4.访问修饰符(TypeScript 特性)
      • 🦋4.1 示例:
    • 🔎5.类类型约束
    • 🔎6.类实现接口
      • 🦋6.1 单接口实现
      • 🦋6.2 多接口实现
      • 🦋6.3 接口优势:
    • 🔎7.传统方式 vs ES6 类
    • 🔎8.常见注意事项


🚀前言

在当今的应用开发中,TypeScript凭借其静态类型和面向对象编程的特性,成为了越来越多开发者的首选语言。而在鸿蒙原生应用开发中,掌握TypeScript中的类的使用,不仅能提升我们的开发效率,还能帮助我们构建更加稳健和可维护的应用程序。

本文将重点介绍TypeScript中的类的基本概念和高级特性,从类的定义、构造函数,到继承、多态等内容,逐步带领你深入理解面向对象编程的思想。通过实际案例,我们将展示如何在鸿蒙原生应用中灵活运用类,提高代码的复用性和可读性。

🚀一、TypeScript 中的类

🔎1.传统构造函数与原型链

🦋1.1 构造函数

function Cat(name, color) {
  this.name = name;
  this.color = color;
}

🦋1.2 原型方法

Cat.prototype.type = '动物';
Cat.prototype.eat = function() {
  console.log("吃老鼠");
};

var cat1 = new Cat("大明", "黄色");

🦋1.3 特点:

  • 通过 new 关键字实例化对象
  • 属性和方法可定义在构造函数或原型上
  • 原型链实现继承

🔎2.ES6 类

🦋2.1 基本语法

class Cat2 {
  name: string;   // TypeScript 类型声明
  color: string;

  constructor(name: string, color: string) {
    this.name = name;
    this.color = color;
  }

  eat() {
    console.log("吃老鼠");
  }

  sayName(): string {
    return `My name is ${this.name}`;
  }
}

const cat3 = new Cat2("小小明", "黑色");

🦋2.2 特点:

  • class 为语法糖,本质仍为原型链
  • 方法无需 function 关键字
  • 方法间无需逗号分隔

🔎3.继承

🦋3.1 基类与派生类

class Animal {
  name: string;

  constructor(name: string) {
    this.name = name;
  }

  eat(): string {
    return "吃骨头";
  }
}

class Dog extends Animal {
  constructor(name: string) {
    super(name); // 必须调用父类构造函数
  }

  sayHi(): string {
    return `${this.name}, ${this.eat()}`;
  }
}

const d = new Dog('Tom');
console.log(d.sayHi()); // "Tom, 吃骨头"

🦋3.2 关键点:

  • extends 实现继承
  • super() 必须在使用 this 前调用

🔎4.访问修饰符(TypeScript 特性)

修饰符访问范围
public默认,任意位置可访问
private仅类内部可访问
protected类内部及子类可访问

🦋4.1 示例:

class Animal3 {
  public name: string;
  constructor(name: string) {
    this.name = name;
  }
}

class Animal4 {
  protected name: string;
  constructor(name: string) {
    this.name = name;
  }
}

🔎5.类类型约束

class Animal5 {
  name: string;

  constructor(name: string) {
    this.name = name;
  }

  sayHi(): string {
    return `My name is ${this.name}`;
  }
}

let s4: Animal5 = new Animal5('Jack');
console.log(s4.sayHi());

🔎6.类实现接口

🦋6.1 单接口实现

interface Animal6 {
  name: string;
  action(): string;
}

class Dog2 implements Animal6 {
  name: string;

  constructor(name: string) {
    this.name = name;
  }

  action(): string {
    return '摇尾巴';
  }
}

🦋6.2 多接口实现

interface Alarm {
  alert(): void;
}

interface Light {
  lightOn(): void;
  lightOff(): void;
}

class Car implements Alarm, Light {
  alert() {
    console.log('警报声');
  }

  lightOn() {
    console.log('开灯');
  }

  lightOff() {
    console.log('关灯');
  }
}

🦋6.3 接口优势:

  • 实现多态性
  • 允许多个不同类共享相同行为
  • 典型场景: 类与 类都可实现 报警 接口

🔎7.传统方式 vs ES6 类

特性传统方式ES6 Class
构造函数function 函数constructor 方法
方法定义需通过原型添加类内直接定义
继承手动操作原型链extends 关键字
代码可读性较低接近传统 OOP 语法

🔎8.常见注意事项

  1. 类方法中的 this 指向实例对象
  2. TypeScript 类型声明需显式标注
  3. 实现接口时必须实现全部成员
  4. private/protected 为 TypeScript 特性
  5. 类不可继承多个父类(可通过接口实现多特性)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/978611.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

手机大厂如何处理安卓分屏退出后最近任务显示一半问题?

背景: 近来在有学员朋友在群里讨论到了一个分屏退出后,在桌面最近任务中的卡片显示异常问题,虽然他的问题和目前市场上的最近任务显示一半情况不一样。但是这里也刚好启发了群里vip学员们对这个最近任务对分屏task只显示一半画面问题进行相关…

Spring Cloud——路由网关Zuul

??? 哈喽!大家好,我是【一心同学】,一位上进心十足的【Java领域博主】!??? 【一心同学】的写作风格:喜欢用【通俗易懂】的文笔去讲解每一个知识点,而不喜欢用【高大上】的官方陈述。 【一心同学】博客…

WorldQuant Brain的专属语言——Fast Expression

使用brain需要的编程语言 在使用BRAIN平台时往往不需要事先有编码背景,因此小白也能很快对其上手,但有经验的程序员来讲,该平台暂时没有禁止API通信低强度进行时的程序化访问(但是非常不好意思😣怎么访问我没找到&…

人大金仓KCA | 对象访问权限入门

人大金仓KCA | 对象访问权限入门 一、知识预备1. 对象的分类2. 对象访问权限概述3. 级联授权4. 权限描述符5. 使用EasyKStudio查看用户权限 二、案例实施1. 用户授权综合案例2. 对象的创建者默认就是对象的所属主3. 该表对象的所属主4. 对象属主的权限设置5. 授权普通用户访问对…

StrokesPlus【电脑鼠标键盘手势软件】v0.5.8.0 中文绿色便携版

前言 StrokesPlus.net是一个超方便的手势识别软件,它能帮你用手势来代替鼠标和键盘操作。用起来既简单又灵活,功能还特别强大。 操作起来非常简单,它有好多实用的功能,比如智能识别你写的字、设定手势操作的区域、模拟鼠标的各种…

springBoot统一响应类型3.1版本

前言: 通过实践而发现真理,又通过实践而证实真理和发展真理。从感性认识而能动地发展到理性认识,又从理性认识而能动地指导革命实践,改造主观世界和客观世界。实践、认识、再实践、再认识,这种形式,循环往…

DDD 架构之领域驱动设计【通俗易懂】

文章目录 1. 前言2. MVC 对比 DDD3. DDD 分层架构4. 完整业务流程 1. 前言 官方回答:DDD是一种应对复杂业务系统的设计方法,通过将软件设计与业务领域紧密结合,帮助开发人员构建清晰、可维护的领域模型。在复杂的业务系统中,它能…

LeetCode 889.根据前序和后序遍历构造二叉树

题目: 给定两个整数数组,preorder 和 postorder ,其中 preorder 是一个具有 无重复 值的二叉树的前序遍历,postorder 是同一棵树的后序遍历,重构并返回二叉树。 如果存在多个答案,您可以返回其中 任何 一…

SSM共享充电宝系统

🍅点赞收藏关注 → 添加文档最下方联系方式咨询本源代码、数据库🍅 本人在Java毕业设计领域有多年的经验,陆续会更新更多优质的Java实战项目希望你能有所收获,少走一些弯路。🍅关注我不迷路🍅 项目视频 SS…

Android 常用命令和工具解析之存储相关

1 基本概念 2 命令解读 2.1 adb shell df df 命令主要用于需要检查文件系统上已使用和可用的磁盘空间的数量。如果没有指定文件名,则显示在当前所有挂载的文件系统上可用的空间。其原理是从proc/mounts 或 /etc/mtab 中检索磁盘信息。 注意:df命令并…

51单片机编程学习笔记——LED原理图

大纲 概览LED电路图Resistor Pack3位数电阻表示法VCC 在《51单片机编程学习笔记——编译代码点亮LED》一文中,我们通过下面这段代码点亮了D1和D2两个LED灯。 sbit LED1P2^0; //将P2.0管脚定义为LED1 sbit LED2P2^1; //将P2.1管脚定义为LED2 …… LED10; LED20;那么…

测试的BUG分析

在了解BUG之前,我们要先了解软件测试的生命周期,因为大多数BUG都是在软件测试的过程中被发现的 软件测试的生命周期 在了解 软件测试的生命周期 之前,我们要先了解 软件的生命周期 ,虽然他们之间只差了两个字,但是差距还是很大的 首先是 软件生命周期 ,这个是站在 软件 的角…

vue3+ts实现动态下拉选项为图标

功能&#xff1a;实现可配置项&#xff0c;下拉选项为图标&#xff0c;如图&#xff1a; 代码如下&#xff1a; <el-select v-model"BuyVolAcc" size"small" style"width: 100%" class"icon-selector"><el-option v-for&qu…

C语言(15)-------------->一维数组

这篇文章介绍的是数组的定义、创建、初始化、使用&#xff0c;在数组中输入内容并输出数组中的内容&#xff0c;并探讨了数组在内存中的存储。里面有些内容建议大家参考下面的一些文章&#xff0c;有助于加深大家对于C语言的理解&#xff1a; C语言&#xff08;2&#xff09;-…

RISCV指令集解析

参考视频&#xff1a;《RISC-V入门&进阶教程》1-4-RV32I基本指令集&#xff08;1&#xff09;_哔哩哔哩_bilibili privilege是特权指令集&#xff0c;有点系统调用的感觉&#xff0c;要走内核态。unprivilege指令集有点像普通的函数调用。

2.27 链表中等 817

817. Linked List Components class Solution { public:int numComponents(ListNode* head, vector<int>& nums) {// 将 nums 存储到一个 unordered_set 中&#xff0c;方便 O(1) 查找unordered_set<int> numSet(nums.begin(), nums.end());int count 0;bool …

NFC拉起微信小程序申请URL scheme 汇总

NFC拉起微信小程序&#xff0c;需要在微信小程序开发里边申请 URL scheme &#xff0c;审核通过后才可以使用NFC标签碰一碰拉起微信小程序 有不少人被难住了&#xff0c;从微信小程序开发社区汇总了以下信息&#xff0c;供大参考 第一&#xff0c;NFC标签打开小程序 https://de…

rustdesk远程桌面自建服务器

首先&#xff0c;我这里用到的是阿里云服务器 centos7版本&#xff0c;win版客户端。 准备工作 centos7 服务器端文件&#xff1a; https://github.com/rustdesk/rustdesk-server/releases/download/1.1.11-1/rustdesk-server-linux-amd64.zip win版客户端安装包&#xff1…

ERROR “GET /mobiles/13344444444/count/ HTTP/1.1“ 500 63503

背景&#xff1a; 美多的&#xff0c;这个问题我不知道那个老师为啥没讲&#xff0c;我直接去看了他的源码发现可恶&#xff0c;直接啥也没有&#xff0c;关键是他竟然跑的通 早知道用postman代替这个该死的刷新就好了&#xff0c;我写了差不多20多次 view.py的 class Mobile…

LabVIEW 项目长时间稳定运行注意事项

利用 LabVIEW 开发的上位机显示界面通过网络与数字板实现数据通讯&#xff0c;运行一周左右会出现一次数据掉线&#xff08;数据采集不上来&#xff09;&#xff0c;需重新 Connect 才能恢复的问题。 出现这种情况&#xff0c;可能是以下几方面原因导致&#xff1a; 网络通讯方…