• TS-2:类型注释与类型推断、函数参数的定义与返回类型的定义、对象成员与数组成员的定义方法、类型别名与类别名


    类型注释与类型推断

    类型注释和类型推断是ts对变量的数据类型两种解析方式

    1. 类型注释:

    类型注释是指开发者在定义一个变量时预先声明这个变量的数据类型,TS会以此来判断该变量的数据类型是否正确

    //开发者声明了一个值为string类型的变量
    let publicStr : string = 'hello,TS'
    
    1. 类型推断:

    类型推断是指开发者本身并不显式声明一个变量的数据类型,而是由TS在最终计算后得出这个变量的数据类型

    //开发者非显式声明了一个值为string类型的变量
    let privateStr = 'hello,TS'  //此时privateStr被认为是string类型
    

    函数参数的定义与返回类型的定义

    1. 函数参数的定义:

    同变量的定义。

    function say(paramStr:string,paramBool:boolean,paramNumber:number,{objParamStr,objParamNumber}:{objParamStr:string,objParamNumber:number}){
      console.log(paramStr,paramBool,paramNumber,objParamStr,objParamNumber)
    }
    say('爱丽丝',true,111,{objParamStr:'想吃糖',objParamNumber:11})    
    
    1. 函数返回参数的定义

    传统js函数中,在没有return关键字的情况下会返回undefined类型,如果有return关键字的话会返回return后的变量的数据类型

    //传统js没有return会返回undefined
    const sayHi = ()=>{
          console.log('hello')     
    }
    console.log(typeof sayHi()) //undefined
    //有return  返回return后的变量的数据类型
    const cry = ()=>{
          return 'cry'
    }
    console.log(typeof cry()) //string
    

    TS中对于函数返回值有了新的解释:

    1. 如果要求有返回值,在函数定义时就需声明该返回值的数据类型
          //速记: fn():【函数的返回类型】{}
    function  add(n1:number,n2:number):number{
          return n1 + n2   //此时返回的必须是数字类型  
    }
    
    1. 如果没有返回值时,可以声明为void类型
    function sayHi():void{
          console.log('hi,爱丽丝')
    }
    
    
    1. 对于可能的死循环或者可能会中途跳出函数本身的,可以声明为never类型
    function forever():never{
          throw new Error('函数到此终止')
          console.log('永远不会执行到这里')
    }
    
    

    对象成员与数组成员的定义

    1. 对象成员

    速记法: let obj:{k1:type1,k2:type2} = {k1:v1,k2:v2}

    let alice :{
        isFond:boolean,
        age: number
    } = {
        isFond : true,
        age:18
    }
    
    1. 数组成员

    成员内单一数据类型的,需在变量后添加数据类型

    速记法:let arr:(type1 | type2 | type3)[] = [item2,item2,item3]

    成员内有复合数据类型的(如object):
    let arr4 :(boolean | string | number | {obj:string,age:number})[] = [true,'爱丽丝',3,{obj:'爱吃糖',age:19}]

    类型别名与类别名

    1. 类型别名:

    类型别名:用于自定义一组类型集合,类似于css中声明共有class

    //速记法
    type typeName = {
         key1 : type1,
         key2 : type2
    }
    //举个栗子
    
    //声明一个类型别名:
    type person = {
        name : string,
        age : number
    }
    //使用这个别名
    let alice :person = {
      name : 'nobody',
      age : 18
    }
    
    
    1. 类别名

    类别名其实就是类而已,只不过也可以用在这里

    class Person {
       name : string ;
       age : number ; //定义时要加分号而不是逗号
    }
    //使用这个类声明
    let alice:Person = {
          name : '爱丽丝' , //使用时需要加逗号而不是分号
          age : 18 
    }
    

    未完待续

    作者:致爱丽丝
    本文版权归作者和博客园共有,欢迎转载,但必须在文章页面给出原文链接并标名原文作者,否则保留追究法律责任的权利。
  • 相关阅读:
    HBase 高性能加入数据
    Please do not register multiple Pages in undefined.js 小程序报错的几种解决方案
    小程序跳转时传多个参数及获取
    vue项目 调用百度地图 BMap is not defined
    vue生命周期小笔记
    解决小程序背景图片在真机上不能查看的问题
    vue项目 菜单侧边栏随着右侧内容盒子的高度实时变化
    vue项目 一行js代码搞定点击图片放大缩小
    微信小程序进行地图导航使用地图功能
    小程序报错Do not have xx handler in current page的解决方法
  • 原文地址:https://www.cnblogs.com/hjk1124/p/14289359.html
Copyright © 2020-2023  润新知