Typescript学习笔记(2.0)

ts编译选项

tsc  app.ts -w  

参数-w,就是对app.ts进行监视,每次该文件改变时就会自动编译

**:任意目录

*:任意文件

接口

接口用来定义一个类结构,用来定义一个类中应该包含哪些属性和方法,同时接口也可以当做类型声明去使用。

interface MyInterface{

name:string

age:number

}

使用此接口:const obj:MyInterface={

name:'mez',

age:11}

注意:接口是可以重复声明的。

interface MyInterface{

gender:string

}

这样两个同名接口存在的话等价于:

interface MyInterface{

gender:string

name:string

age:number

}

接口可以再定义类的时候去限制类的结构,接口中的所有属性都不能有实际的值,所以说,接口只考虑对象的接口,而不考虑其值,在接口中所有的方法都是抽象方法。

interface myTest{

name:string;

sayHello():void;

}

定义类时,可以使类去实现一个接口

class MyClass implements myTest{

name:string;

constructor(name:string){

this.name=name;

}

sayHello(){

console.log('大家好~~')

}

}

interface和abstract是TS中独有的,在编译后就看不到了。

属性的封装

(function(){
//定义一个表示人的类
class Person{
//可以用下划线的方式
//TS可以再属性钱添加属性的修饰符
//public:public修改的属性是可以任意修改的
//private:私有属性,只能再类内部进行修改
//通过再类中添加方法使得私有属性可以被外部访问
//protected:受保护的属性,只能在当前类和当前类中的子类中进行访问
private _gender:string;
name:string;
age:number;
constructor(name:string,age:number){
this.name=name
this.age=age
}
//getter方法用来读取属性
//setter方法用来修改属性
//定义方法,用来获取gender属性
getGender(){
return this._gender
}
//定义方法,用来设置gender属性
setGender(value:string){
//判断gender是否合法
if(value=='男' || value=='女'){this._gender=value
}}
}
const per =new Person(name:'孙悟空',age:18)//现在属性是再对象中设置的,可以任意的被修改
//比如
person.name='mez';//但是会存在一个问题,name和age都可以修改,但是当存在不可控的数据时,是非常危险的//TS中设置getter方法的方式
get gender(){
return this._gender
}
//这样的话就可以直接使用.gender即可set gender(value:string){
this._gender=value
}
//可以直接执行
per.gender='男'//可以直接将属性定义在构造函数中
class C{
constructor(public name:string){}
}
//等价于
class C{
constructor(name:string){
this.name=name
}
}
})()

泛型

//在不知道参数的类型时,就可以使用泛型function fn(a:  ??): ?? {
return a}//定义函数或类时,遇到不明确的就可以使用泛型
function fn<T>(a:T):T{return a;
}//只有在函数执行的时候才能确定T的类型//可以直接调用具有泛型的函数
fn(a:10)  //此时number赋值给了T   //类型推断为numberfn<string>(a:'hello')  //手动指定类型,防止在不能自动推断出类型的情况function fn2<T,K>(a:T,b:K):T{
console.log(b);
return a}fn2<number,string>(a:123,b:'hello')interface Inter{
length:number;
}
//T extends Inter  表示泛型T必须是Inter实现类
function fn3<T extends Inter>(a:T):number{return a.length;
}
fn3('123')//不正确
fn3(123)//正确class Myclass<T>{
name:T;
constructor(name:T){
this.name=name
}}
const mc=new Myclass<string>(name:'aaa')

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Profinet与以太网Ethernet的区别

在工业自动化和网络通信领域&#xff0c;Profinet和以太网Ethernet是两种常见的通信协议。尽管它们都基于以太网技术&#xff0c;但在技术规范、应用领域、通信速度和实时性、系统兼容性和互操作性以及数据处理和网络管理等方面存在显著差异。 一、技术规范和应用领域 以太网 …

爬虫基础之Web网页基础

在探讨爬虫技术的深入应用之前&#xff0c;了解Web网页的基础知识是至关重要的。Web网页是互联网上的基本构成单元&#xff0c;而爬虫则是与这些网页交互的自动化程序。本文将介绍Web网页的基础知识&#xff0c;包括HTML、CSS、JavaScript以及它们在爬虫技术中的角色。 HTML&a…

基于微信小程序的课堂考勤系统的设计与实现(论文+源码)_kaic

基于微信小程序的课堂考勤系统的设计与实现 摘 要 在高校教育普及的今天&#xff0c;学生人数日益增多&#xff0c;为保证课堂质量&#xff0c;教师多要在课前进行考勤。因此本设计提出基于微信小程序的课堂考勤系统&#xff0c;增加了定位功能&#xff0c;避免了“假打卡”…

前端开发知识(一)-html

1.前端开发需掌握的内容&#xff1a; 2.前端开发的三剑客&#xff1a;html、css、javascript Vue可以简化JavaScpript流程。 Element&#xff08;饿了么开发的&#xff09; &#xff1a;前端组件库。 Ngix&#xff1a;前端服务器。 3.前端开发工具&#xff1a;vscode 1)按…

基于Java+SpringBoot+Vue的学生心理咨询评估系统

前言 ✌全网粉丝20W,csdn特邀作者、博客专家、CSDN[新星计划]导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ &#x1f345;文末获取项目下载方式&#x1f345; 哈喽兄弟们&#xff0c;好久不见哦&#xff5…

乐尚代驾六订单执行一

加载当前订单 需求 无论是司机端&#xff0c;还是乘客端&#xff0c;遇到页面切换&#xff0c;重新登录小程序等&#xff0c;只要回到首页面&#xff0c;查看当前是否有正在执行订单&#xff0c;如果有跳转到当前订单执行页面 之前这个接口已经开发&#xff0c;为了测试&…

【MySqL数据库的基本语法】

SQL语言&#xff1a;结构化查询语言 DDL&#xff1a;数据定义语言&#xff08;create创建、drop丢弃、删除、alter修改&#xff09; DML&#xff1a;数据操纵语言&#xff08;insert添加、update、delete&#xff09; DQL&#xff1a;数据查询语言&#xff08;select、show、…

Linux嵌入式学习——数据结构——线性表的链式结构

线性表的链式存储 解决顺序存储的缺点&#xff0c;插入和删除&#xff0c;动态存储问题。 特点&#xff1a; 线性表链式存储结构的特点是一组任意的存储单位存储线性表的数据元素&#xff0c;存储单元可以是连续的&#xff0c;也可以不连续。可以被存储在任意内存未被占…

四、单线程多路IO复用+多线程业务工作池

文章目录 一、前言1 编译方法 二、单线程多路IO复用多线程业务工作池结构三、重写Client_Context类四、编写Server类 一、前言 我们以及讲完单线程多路IO复用 以及任务调度与执行的C线程池&#xff0c;接下来我们就给他结合起来。 由于项目变大&#xff0c;尝试解耦项目&#…

47.简易电压表的设计与验证(2)

&#xff08;1&#xff09;Verilog 代码&#xff1a; module adc_collect(input clk ,input reset_n ,input [7:0] adc_data ,output clk_adc );wire clk_adc_a ;…

chrome 插件:content-script 部分逻辑在页面无法生效,可考虑插入 script 到页面上

背景: 某页面有个输入框, 用的应该是什么库里的组件, 直接修改内容不生效/机制不明确, 于是使用 paste event 粘贴到输入框, 结果发现也不行 定位: 使用 mutationObserver , 发现事件确实触发了, 输入框内容变了, 但马上又变回来了, 于是怀疑是输入框组件有做 mutationObers…

软考上岸后,我过上了周末双休的生活

很多人说这个证书考了没用&#xff0c;但在我周围的一些企业是很认可的&#xff0c;我也在考了这个证之后&#xff0c;开始换工作&#xff0c;薪资涨了2倍不说&#xff0c;还可以从事项目管理的工作&#xff0c;算是达到了职业目标。 况且这个证书还能落户&#xff0c;像有一些…

提交高通量测序处理数据到 GEO --- 操作流程

❝ 写在前面 由于最近在提交课题数据到 NCBI 数据库&#xff0c;整理了相关笔记。本着自己学习、分享他人的态度&#xff0c;分享学习笔记&#xff0c;希望能对大家有所帮助。推荐先按顺序阅读往期内容&#xff1a; 1. 提交高通量测序数据到 GEO --- 说明书 2. 提交高通量测序原…

基于机器学习的二手房价格分析与预测设计与实现

概述 随着西安房地产市场的不断发展和变化&#xff0c;对二手房价格的准确预测变得至关重要。本研究旨在利用机器学习技术对西安市二手房价格进行深入分析与预测&#xff0c;通过对原始数据进行数据预处理和特征提取&#xff0c;以构建有效的预测模型。通过数据分析和可视化&a…

LabVIEW学习-LabVIEW处理带分隔符的字符串从而获取数据

带分隔符的字符串很好处理&#xff0c;只需要使用"分隔符字符串至一维字符串数组"函数或者"一维字符串数组至分隔符字符串"函数就可以很轻松地处理带分隔符地字符串。 这两个函数所在的位置为&#xff1a; 函数选板->字符串->附加字符串函数->分…

第13周 简历职位功能开发与Zookeeper实战

第13周 简历职位功能开发与Zookeeper实战 本章概述1. Mysql8窗口函数over使用1.1 演示表结构与数据1.2 案例1:获取男女总分数1.3 案例2****************************************************************************************本章概述 1. Mysql8窗口函数over使用 参考案例…

从零开始学习机器学习,掌握AI未来的关键!

从零开始学习机器学习 1. 介绍1.1 人工智能&#xff08;AI&#xff09;概述1.2 机器学习在人工智能中的应用1.3 机器学习基础概念 2. 监督学习2.1 什么是监督学习2.2 回归分析2.3 分类问题2.4 模型评估和选择 3. 无监督学习3.1 什么是无监督学习3.2 聚类算法3.3 降维技术 4. 深…

Elasticsearch 7.x入门学习-Java API操作

1 创建项目 在idea开发工具中创建Maven项目 修改 pom 文件&#xff0c;增加 Maven 依赖关系 <dependencies><dependency><groupId>org.elasticsearch</groupId><artifactId>elasticsearch</artifactId><version>7.8.0</versi…

C语言 | Leetcode C语言题解之第268题丢失的数字

题目&#xff1a; 题解&#xff1a; /* 求和运算 */ /* 对[0,n]求和, 减去数组每个元素, 得出丢失的元素 */ int missingNumber(int* nums, int numsSize){int i;int sum numsSize;for (i 0; i < numsSize; i) {sum i - nums[i];}return…

每天五分钟计算机视觉:目标检测模型从RCNN到Fast R-CNN的进化

本文重点 前面的课程中,我们学习了RCNN算法,但是RCNN算法有些慢,然后又有了基于RCNN的Fast-RCNN,Fast R-CNN是一种深度学习模型,主要用于目标检测任务,尤其在图像中物体的识别和定位方面表现出色。它是R-CNN系列算法的一个重要改进版本,旨在解决R-CNN中计算量大、速度慢…