TypeScript 类class与修饰符的详细使用教程

目录
  • 一、简介
  • 二、成员修饰符
    • 访问修饰符
    • 只读修饰符
    • 静态修饰符
  • 总结

一、简介

通过 class 关键字定义一个类,然后通过 new 关键字可以方便的生产一个类的实例对象,这个生产对象的过程叫 实例化,类的成员就是类中所有的属性和方法。

// 定义类
class Person {
  // 名称
  name: string
  // 年龄
  age: number
  // 构造函数
  constructor(name: string, age: number) {
    // 更新熟悉数据
    this.name = name
    this.age = age
  }
}
// 发送一个人的信息
function sendPerson (person: Person) {
  console.log(`姓名:${person.name},年龄:${person.age}`)
}
// 实例化对象
const p = new Person('dzm', 20)
sendPerson(p) // 名称:dzm,年龄:20

实例在new出来的时候,它实际是调用了类中的一个方法进行初始化,这个方法被叫做构造器,一般都会在类中显示地写上 constructor 方法,如果没有显示定义的 constructor,就会调用系统自带的 constructor 构造函数。

二、成员修饰符

访问修饰符的作用就是用于限制别人乱用类中的东西

访问修饰符

  • public:公开的,谁都能用(默认就是 public
  • private:私有的,仅类自己能使用,子类与外部都不能使用
  • protected:受保护的,仅类和类的子类能使用,外部不能使用
// 定义类
class Person {
  // 公开参数
  name: string
  // 公开参数
  public age: number
  // 私有参数
  private num:number = 10
  // 内部参数
  protected num1: number = 20
  // 构造函数
  constructor(name: string, age: number) {
    // 更新熟悉数据
    this.name = name
    this.age = age
  }
  // 发送个人信息
  public send() {
    console.log('发送成功1')
  }
  // 私有方法
  private post() {
    console.log('发送成功2')
  }
}

只读修饰符

readonly:只能读不能写

class Person {
  // 声明赋值
  readonly name = 'dzm'
}
let p = new Person()
console.log(p.name)
// 不能赋值
// p.name = 'xxx'

readonly 只能在 constructor 构造方法初始化时赋值,或者声明时赋值,之后都不能在修改值。

class Person{
  readonly name: string
  // 构造初始化赋值
  constructor(name: string) {
    this.name =  name
  }
}

静态修饰符

static:静态成员无需实例化,直接通过类名调用

// 定义类
class Person {
  // 公开参数
  name: string
  // 公开参数
  public age: number
  // 静态参数
  static num:number = 10
  // 构造函数
  constructor(name: string, age: number) {
    // 更新熟悉数据
    this.name = name
    this.age = age
  }
  // 发送个人信息
  static send() {
    console.log('发送成功')
  }
}
// 不需要实例化对象,通过类名就能进行访问
console.log(Person.num)
Person.send()

总结

1、上面总共分为三种类型修饰符:访问修饰符只读修饰符静态修饰符

2、修饰符是可选的,在没有写任何修饰符的情况下,默认为 public

3、同类型修饰符只能有一个,也就是上面 三种修饰符 可以组合起来修饰一个成员。

4、三种类型修饰符有先后顺序,分别是:访问静态只读,即:public/static/protectedstaticreadonly

到此这篇关于TypeScript 类class与修饰符的详细使用的文章就介绍到这了,更多相关TypeScript 类class内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • 简单聊聊TypeScript只读修饰符

    目录 前言 只读函数参数 如何更改函数 只读类属性 只读索引 总结 前言 在Typescript 2.0中,引入了readonly关键字,可以对类中的属性进行修饰,作用是:该属性被readonly修饰之后无法修改**(如需修改,在构造函数中可以对只读属性进行修改)**. 我们可以直接在interface和type中直接使用readonly. 我们来看一个简单的例子:我们定义一个User type type User={ readonly name : string; readonly age :

  • 详解JavaScript私有类字段和TypeScript私有修饰符

    JavaScript私有类字段和隐私需求 在过去,JavaScript 没有保护变量不受访问的原生机制,当然除非是典型闭包. 闭包是 JavaScript 中许多类似于私有模式(如流行的模块模式)的基础.但是,近年来 ECMAScript 2015 类被使用后,开发人员感到需要对类成员的隐私进行更多控制. 类字段提案(在撰写本文时处于第 3 阶段)试图通过引入私有类字段来解决问题. 让我们看看它们是什么样子的. 一个 JavaScript 私有类字段的例子 这是一个带有私有字段的 JavaScr

  • 详解TypeScript+Vue 插件 vue-class-component的使用总结

    首先 下载 npm install vue-class-component vue-property-decorator --save-dev 一梭子直接干: 其次,咱来说说它们的区别与联系: vue-property-decorator社区出品:vue-class-component官方出品 vue-class-component提供了Vue.Component等: vue-property-decorator深度依赖了vue-class-component,拓展出了更多操作符:@Prop.@

  • 深入理解JavaScript和TypeScript中的class

    前言 对于一个前端开发者来说,很少用到 class ,因为在 JavaScript 中更多的是 函数式 编程,抬手就是一个 function,几乎不见 class 或 new 的踪影.所以 设计模式 也是大多数前端开发者的一个短板. 最近在学习 Angular的过程中发现其大量的运用了 class,不得不佩服,Angular 确实是一个优秀的.值得深入研究的 框架. 本文将简单的介绍一下 JavaScript 和 TypeScript 中的 class. 基本概念 在介绍 class 之前,要先

  • TypeScript基础class类教程示例

    目录 class类 示例 构造函数 继承 class 类 类是面向对象语言的程序设计中的概念,是面向对象编程的基础. 类是创建对象的模板,是对现实生活中一类具有共同特征的事物的抽象 类的内部封装了属性和方法,用于操作自身的成员 示例 将每条狗看做一个对象,那他的属性就有 品种.颜色,方法(行为)舔.叫.吃. class Dog { breed: string; color: string; lick(): void { console.log(` 我仍认为我们作为一个舔狗的真正目的是为了拥有一份

  • TypeScript 学习笔记之 typeScript类定义,类的继承,类成员修饰符

    目录 1.类的定义 2.类的继承 3.修饰符 前言: typeScript 中的类与 ES6 中的类非常相似,如果不知道 ES6 中的类,建议先学习下 ES6 中的 class .本篇文章重点介绍 typeScript 中的类定义.继承以及修饰符. 1.类的定义 类描述了所创建的对象共同的属性和方法.typeScript 支持面向对象的所有特性,比如类.接口等. 在 typeScript 中定义类的时候,使用 class 关键字,类名首字母使用大写,类可以包含以下三个模块: ​字段​ - 字段是

  • TypeScript 类class与修饰符的详细使用教程

    目录 一.简介 二.成员修饰符 访问修饰符 只读修饰符 静态修饰符 总结 一.简介 通过 class 关键字定义一个类,然后通过 new 关键字可以方便的生产一个类的实例对象,这个生产对象的过程叫 实例化,类的成员就是类中所有的属性和方法. // 定义类 class Person { // 名称 name: string // 年龄 age: number // 构造函数 constructor(name: string, age: number) { // 更新熟悉数据 this.name =

  • C#类的访问修饰符用法分析

    本文详细分析了C#类的访问修饰符用法,分享给大家供大家参考.具体用法分析如下: 默认情况下,类声明为内部的,即只有当前工程中的代码才能访问它.可以用internal访问修饰符关键字显式指定,但这不是必须的,类在定义时默认为此类型的类.但是C# 方法默认访问级别: private. 方法或者属性的修饰符的访问级别如下图: 访问修饰符 意 义 public 访问不受限制,可以类内和任何类外的代码中访问 protected 可访问域限定于类内或从该类派生的类内 internal 可访问域限定于类所在的

  • 一文搞懂JAVA 修饰符

    Java语言提供了很多修饰符,主要分为以下两类: 访问修饰符 非访问修饰符 修饰符用来定义类.方法或者变量,通常放在语句的最前端.我们通过下面的例子来说明: public class ClassName { // ... } private boolean myFlag; static final double weeks = 9.5; protected static final int BOXWIDTH = 42; public static void main(String[] argum

  • 深入分析c# 封装和访问修饰符

    封装 被定义为"把一个或多个项目封闭在一个物理的或者逻辑的包中".在面向对象程序设计方法论中,封装是为了防止对实现细节的访问. 抽象和封装是面向对象程序设计的相关特性.抽象允许相关信息可视化,封装则使开发者实现所需级别的抽象. C# 封装根据具体的需要,设置使用者的访问权限,并通过 访问修饰符 来实现. 一个 访问修饰符 定义了一个类成员的范围和可见性.C# 支持的访问修饰符如下所示: public:所有对象都可以访问: private:对象本身在对象内部可以访问: protected

  • 详解Vue的sync修饰符

    1 .指令 指令即 Directive,从字面意思理解就是我告诉你要做什么,就是发送了一个指令,然后由接收指令的人去做就好了.在 Vue 中的指令有个统一好认的格式,就是以 v- 开头的就是指令,如: <div v-text="x"> </div> //v-text指定标签文本指令 <div v-on:click="add"> <div> //v-on事件绑定指令 但并不是所有的指令都以 v- 开头,对于一些简写,也是

  • 关于Java中修饰符的总结(fina除外)

    public/protected/private public表示公开,private表示私有,protected表示保护,什么都不写表示默认default. 方法: public protected default private √ √ √ √ 同一类中 √ √ √ × 同一包中 √ √ × × 子类中 √ × × × 不同包中 成员变量: 考虑的安全性和健壮性的问题,成员变量一般为私有,并对外提供一些public的方法修改成员变量,在修改的方法中对输入进行判断和控制. Private成员变

  • 详解Java修饰符

    Java语言提供了很多修饰符,主要分为以下两类: 访问修饰符 非访问修饰符 修饰符用来定义类.方法或者变量,通常放在语句的最前端.我们通过下面的例子来说明: public class className { // ... } private boolean myFlag; static final double weeks = 9.5; protected static final int BOXWIDTH = 42; public static void main(String[] argum

  • 枚举java语言中的修饰符组合的实例代码

    枚举java语言中的修饰符组合,代码如下所示: package model; /*22:37 2019/7/20*/ /* top class的修饰符组合 abstract final public * 2 * 2 warning: abstract final 冲突 最终,共有2*(2*2-1)=6种修饰符组合用于top class */ /* public abstract class PublicAbstractClass{} public final class PublicFinalC

随机推荐