ts 详解

ts简介

ts 全称是 TypeScript
TypeScript 可以理解为是 JavaScript 的扩展,扩展了 js 的语法,因此我们可以在 ts 中继续写 js 的代码而不回报错

TypeScript 又叫做静态的 JavaScript,不能直接引入到 html 中,不能直接被浏览器识别,需要经过 ts 转换器或者是 babel 转化后才能使用

如何理解静态语言和动态语言

类型系统按照类型检查的时机来分类,分为动态类型和静态类型,动态是在运行时候才检查数据类型,静态是在编译时候检查数据类型

1 静态语言是在编译期间就会做数据类型的检查,也就是要在写代码的时候就声明变量的数据类型。大部分的后台语言比如 java,php 等以及我们要学的 ts 都是静态的。
2 动态语言是指在运行期间才会去做类型检查的语言,也就是说动态语言声明的时候不需要指定数据类型。比如 javascript 和 python 都是动态的。

列子说明

//单属性
let a:Number=18
let b:symbol=Symbol()
console.log(b,"asdasd");
let c:number=15

//单属性多类型
let timer:null|number=null
type s =string
const ss:s='abc'

//数组两种方式
let numArr:number[]=[1,2,3]
let strArr:Array<string>=['1','2','3']
//函数
function add(a:string,b:number):any{
    
    
    return a+b
}
//箭头函数
const fun=(a:number=1,b:number=1):any=>{
    
    
    return a+b
}
fun(1,1)
//函数简写
type Fn=(ni:number,n2:number)=>number
const fun3:Fn=(a,b)=>{
    
    
    return a+b
}
//可选参数
function fun8( a?:number,b?:number){
    
    
    console.log(111);  
}
function fun88( a:number,b:number){
    
    
    console.log(111);  
}
fun8()
fun8(1,2)
fun8(1,2)


// 对象   
// const 对象名: {
    
    
//     属性名1:类型1,
//     属性名2?:类型2,
//     方法名1(形参1: 类型1,形参2: 类型2): 返回值类型,
//     方法名2:(形参1: 类型1,形参2: 类型2) => 返回值类型
//   } = { 属性名1: 值1,属性名2:值2  }
//l类型别名Type

type obj={
    
    
    a:string,
    b?:number,
    fun10():void
}
let obj1:obj={
    
    
    a:'1',
    b:18,
    fun10(){
    
    }
}

//两种形式描述对象 1:类型别名 type   2:接口 interface

//interface声明接口
interface obj2{
    
    
    name:string,
    price:number,
    fun11:()=>string
}
//利用声明得接口名称作为变量的名称
const good1:obj2={
    
    
    name:'1',
    price:200,
    fun11:function(){
    
    
        return '1'
    }

}
const good2:obj2={
    
    
    name:'1',
    price:200,
    fun11:function(){
    
    
        return '1'
    }

}

//接口得继承
//注意:在日常开发中   如果两个接口之间又相同得属性或者方法,可以将(公共得属性或者方法抽离出来,通过继承extends实现复用)语法:
 interface obj3{
    
    
    a:number,
    b:number,
 }
//  interface obj4{
    
    
//      a:number,
//      b:number,
//      c:number
//  }

//obj4利用继承

interface obj4 extends obj3{
    
    
    c:number
}//这样obj4就用了obj3得属性或者方法(obj4用 a b c 三个属性)

猜你喜欢

转载自blog.csdn.net/weixin_48466991/article/details/129117595
ts