ts的基础教程

前言：本教程需要读者具有一定的面向对象的基础技能

什么是ts？

typescript，简称ts，下文ts指的都是typescript不是the shy。直观来讲是强类型的js。 主要设记者之一安德森同时是c#之父，因此如果你有c#的基础，可能能很快掌握这门语言。

基础语法

特殊之处

• ts的变量申明很灵活例如：

  var a1 = 1;
  let a2 = 1;
  a3 =1;
  a4:number;//number类型变量，还没初始化
  a5!:number;//自动初始化的number类型变量
  

• 普通语言的类型一般有两种状态null与非null，而ts有三种null/undefined和正常的有实际值的状态。因此很多严谨的ts代码除了null check外还经常要检查undefined

  • 检查null，可以使用??运算符，比如

    var a = b ?? "this will be returned when b is null";
    

  • 检查undefined可以直接用if

    if(a){
        //当a不是undefined或者a是true的时候，这里的代码被执行
    }
    

• ts中任意变量都可以具有多种可能的类型，例如：

  a:number|string;//number或string类型变量
  

条件

if(condition){
    //statement
}else if(){

}else{

}

总体来说和其它主流语言差不多，但是需要注意的一点是，ts中比较相等的运算符是三等号===

if(a===b){

}

循环

while/for和其他主流语言几乎完全一样

引入库的语法

import axios from 'axios';
import "bulma/css/bulma.css";
import { Component, Prop, Vue } from 'vue-property-decorator';

导出类

export default class App extends Vue {
    //导出继承Vue的App类
}

export class App implements Interface {
    //导出实现Interface接口的App类
}

ts中的函数

声名方法很多种

function name(params:type) {
    //显式加上函数标签的方法
};
name1(params:type):void{
    //显式申明返回值类型的方法，和name1等效
}
function name2(params:type1|type2) {
    //有重载的方法
};
async function name3(params:type1|type2) {
    //异步方法
};
async function name4(callback:()=>void) {
    //接收一个函数作为参数的异步函数
};
async function name5() {
    name4(()=>{
        console.log('done!');
    });//传入lambda
    await name4(function(){
        console.log('done!');
    });//传入匿名函数，并且await 异步操作
};

结语

基础的内容就这么多，重点还是实操。一定不要一直看资料，只要懂了一点，直接上项目，看别人的代码，在此基础上修改， 看看造成的影响，这样学的才最快。

---

本文章使用limfx的vsocde插件快速发布