TypeScript 基础类型

TypeScript 复制代码
//基础类型 string,number,boolean
const teacherName:string = 'chen lee';
const teacherAge:number = 28.0;
const isMale:boolean = true;
//数组
const numberArr:number[]=[1,2,3,4,5];
const stringArr:string[]=['1','2','3','4','5'];
const booleanArr:Array<boolean>=[true,false,true];
//对象类型
const user: {name:string,age:number} = {name:'dell',age:18};
const userOne: {name:string,age?:number} = {name:'dell'};

function union(id:string|number)
{
    if(typeof id ==='string')
    {
        console.log(id.toUpperCase());
    }
    else
    {
        console.log(id);
    }
}
union('asd');
type User = {name: string,age:number};
//type Employee = {name: string,age:number,salary:number};
const userTwo:User = {name:'dell',age:18};
const userThree:User = {name:'dell',age:18};
//any
function showMessage(message:any)
{
    console.log(message);
}
//函数类型
function abc(message:string):number
{
    return 1;
}
const def: (age:number)=>number = (age:number)=>{return 1;}
//接口类型Interface
interface Student
{
    age:number;
    sex?:string;
}
//继承
// interface OldStudent extends Student
// {
//     name: string;
// }
//const student:Student = {age:18,sex:'male'};
//const oldstudent:OldStudent = {age:18,sex:'male',name:'dell'};
interface Student
{
    name: string;
}
const student:Student = {age:18,sex:'male',name:'dell'};

//交叉类型
type Employee = User & {salary:number};
const employee:Employee = {name: 'string',age:13,salary:18};
//断言 Assersion
//const dom: HTMLElement = document.getElementById('#root');
//const dom1: undefined = document.getElementById('#root') as undefined;
//const dom2: undefined = <undefined>document.getElementById('#root');
const testString: string = 123 as any as string;

//字面量类型
const str:'ast'= 'ast';
function getPosition(position:'left'|'right'):string
{
    return position;
}

const truthy: true = true;
//
function request(url: string,method:'GET'|'POST'):string
{
    return 'sending request';
}
const params:{url:string,method:string}={url:'imooc',method:'POST'}
request(params.url,params.method as 'GET');
//null , undefined
//严格校验会报红
//const testObject:null = undefined;
//const testUndefined:undefined = null;
const testObject:undefined = undefined;
const testUndefined:null = null;
function checkNull(abc:string | null)
{
    if(typeof abc === 'string' )
    {
        console.log(abc.toUpperCase());
    }
    //console.log(abc!.toUpperCase());表示一定非null
}
//void类型
function getNumber():void//无返回值
{

}

tsconfig.json

bash 复制代码
{
    "compilerOptions":{
        "noImplicitAny":true,
        "strictNullChecks": true
    }
}

"noImplicitAny":true,//对类型转换做检查

"noImplicitAny": true 配置在 TypeScript 项目中,意味着‌禁止隐式使用 any 类型 ‌。当 TypeScript 编译器无法推断出某个变量、参数或属性的类型时,会‌报编译错误 ‌,而不是默认将其视为 any

核心作用

  • 强制显式类型声明‌:所有未标注类型的标识符必须明确指定类型,否则编译失败。
  • 提升代码安全性‌:避免因类型推断失败导致的潜在运行时错误。
  • 增强可维护性‌:代码意图更清晰,便于团队协作和长期维护。

"strictNullChecks": true//对null和undefined做检查

核心作用

  • 禁止隐式空值赋值 ‌:在严格模式下,nullundefined不能 ‌赋值给其他类型(如 stringnumber 等),除非显式声明为联合类型(如 string | null)‌‌。
  • 强制空值检查 ‌:访问变量属性前必须先判断其是否为 nullundefined,避免运行时错误‌‌。
  • 类型推断更精确 ‌:变量赋值为 null 会被推断为 null 类型,赋值为 undefined 会被推断为 undefined 类型,而非 any‌‌。
相关推荐
雪芽蓝域zzs11 小时前
第十六节:递归组件实现无限层级折叠侧边栏菜单
开发语言·javascript·ecmascript
神明不懂浪漫11 小时前
【第二章】库、表、增删改查操作
开发语言·数据库·经验分享·笔记
传奇开心果编程11 小时前
【Rust入门知识点学与练】第11课:HashMap 键值对集合
开发语言·学习·rust
yume_sibai12 小时前
03-Rust 函数式编程特性(闭包 + Iterator + Option/Result + 链式调用)
开发语言·后端·rust
奈斯先生Vector12 小时前
AIGC 视频生成实战:用 Kling Video 拆解文生视频、图生视频与完整工作流
开发语言·人工智能·windows·python·aigc·音视频
小玮看世界12 小时前
[Python]螺旋遍历 vs 最短路径:方向控制类算法的“同源异流”
开发语言·python·算法
OPEN-F12 小时前
ROS2系列教程:tf2坐标变换详解(C++/Python)
开发语言·c++·python
XR12345678812 小时前
医院基础网络改造升级选型深度解析
开发语言·网络·php
reasonsummer12 小时前
【办公类-146-05】20260901《一分园、二分园四大教育》(优化版:标题excle+复制AI文字+Python占位符录入)
开发语言·数据库·c#