Angular&TypeScript

Angular&TypeScript

博客首页：蔚说的博客
欢迎关注点赞收藏⭐️留言
作者水平很有限，如果发现错误，求告知，多谢！
有问题可私信交流！！！
（达内教育学习笔记）仅供学习交流

TS简介

TypeScript是JavaScript类型的超级，他可以编译成纯的JavaScript。TypeScript可以在任何浏览器，任何计算机和任何操作系统上运行，并且是开源的。
Angular从V2.x开始使用TS编写；Vue.js从V3开始使用TS编写；
中文网：https://www.tslang.cn/

浏览器不支持TS，其使用步骤：
1.下载TS的编译器

npm i -g typescript

2.编写.ts文件，使用编译器转化为.js

tsc hello.ts

//得到hello.js
使用Ts学习手册：https://www.tslang.cn/docs/home.html
TS学习手册直通车

TS的扩展特性：

• TS是强类型语言—js是弱类型语言
  强类型语言的特点：变量，形参，函数都要声明类型
  uname：string
  f1(n1:number):boolean{
  return ture
  }
  常用的数据类型关键字：string、number、boolean、any、number[]、Object、Date、Void
• TS对属性和方法成员定义三种访问修饰符，限制外界访问权限
  private：私有的，私有成员只能在本类内部使用

class User {
    private age:number = 20
    setAge(age:number){
        if(age <= 18 || age >= 60){
            console.log('非法的年龄')
        }else{
            this.age = age
            console.log(this.age)
        }
    }
}
let U2 =new User();
U2.setAge(20)

protect：被保护的，私有成员只能在本类内部和子类内部使用

class Emp{
    protected ename:string =''
    private salary:number = 20
}
class Coder extends Emp{
    lang:string = ''
    override ename = 'tom'
}

public：公共的，公共成员在本类以及外部使用
提示：一般的，class内的属性不应该让外部随便访问，通常设置为private，方法一般允许被访问为public。

访问修饰符的特殊用法

下述两种写法的作用相同：
第一种：

class Student{
    private sname:string = ''
    //构造方法
    constructor(sname:string){
        this.sname = sname
    }
}

第二种：
声明私有方法的一种简写方法

class Student{
   //简写方法（只有构造方法可以这样写）
   constructor(private sname:string){
   }
}

面向对象编程-class和interface

interface ：接口，是一种特殊的类，规范“要求某个class必须具备XXX方法”如管道类必须实现transform方法

//使用接口要求小汽车必须提供start和stop两个方法
interface Runnable{
    start():any;//接口的方法没有主题
    stop():any
}
//类不能继承接口但是类可以实现接口
class Car implements Runnable{
    start(){
        //接口的实现者必须要提供指定的方法，要有主体
    }
    stop(){

    }

装饰器

装饰器是一种特殊类型的声明，它能够被附加到类声明，方法， 访问符，属性或参数上。 装饰器使用 @expression这种形式，expression求值后必须为一个函数，它会在运行时被调用，被装饰的声明信息做为参数传入。