TypeScript 基础知识总结(一)

最新推荐文章于 2025-06-22 01:00:51 发布

cbkting

最新推荐文章于 2025-06-22 01:00:51 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

分类专栏：个人笔记

本文链接：https://blog.youkuaiyun.com/cbkting/article/details/87657544

个人笔记专栏收录该内容

3 篇文章

订阅专栏

本文介绍了在VS Code中使用TypeScript的两种命令行输入方式，并详细讨论了类型相关的错误及解决方案，包括重载签名不兼容和参数类型不匹配的问题。提供了解决这些问题的实例，如更改变量名和指定函数参数及返回值类型。此外，还简单提及了TypeScript中的类(Class)概念，类是集合相同特性的方式，类似于JavaScript的闭包。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在vs code 开发工具中命令行输入:

第一种用法: 分开输入。先输入 tsc 文件名称.ts; 然后再输入 node 文件名称.js;
第二种用法: 使用&&一次输入。 tsc 文件名称.ts; && node 文件名称.js .

TypeScript 通过 tsc 文件名称.ts 命令编译生成 JavaScript ,然后使用命令: node 文件名称.js

类型

错误用法:

function print(str:string){

    if(typeof(str)=="string"){
        console.log(str);
    }

}

print(124); //编写中就提示错误
print("123ts")

如果出现如下错误:

Overload signature is not compatible with function implementation. 重载签名与函数实现不兼容。如代码:declare function print(): void;(翻译:声明函数print() 无效的.)
Overload signatures must all be ambient or non-ambient. 重载签名必须全部为环境或非环境。
Argument of type ‘1234’ is not assignable to parameter of type ‘string’. “1234”类型的参数不能分配给“string”类型的参数。

解决方案:

更改函数名称:print() -> pr();
在pr() 中输入正确类型;

如下代码:

//写法一:
function pr(str:string){
	if(typeof(str)=="string"){
        console.log(str);
    }
}

pr("123ts") 


//写法二:
function pr(str:string){
    console.log(str);
}

pr("123ts")

以四则运算为例,介绍类型, 注意:

参数有类型, 如: function add(parameter1: number, parameter2: number){...}
返回值也有类型, 如: function add(...):number {...};

如下代码:

//加法
function add(parameter1: number, parameter2: number):number {

    let additionResult = parameter1 + parameter2;
    return additionResult;

}

//减法
function sub(parameter1: number, parameter2: number):number {

    let subtractionResult = parameter1 - parameter2;
    return subtractionResult;

}

//乘法
function mul(parameter1: number, parameter2: number):number{

    let multiplicationResult:number = parameter1 * parameter2;
    return multiplicationResult;

}

//除法
function div(parameter1: number, parameter2: number):number {

    let divisionResult = parameter1 / parameter2;
    return divisionResult;
}


console.log(add(22, 11));
console.log(sub(22, 11));
console.log(mul(22, 11));
console.log(div(22, 11));

类(Class)

类就是把相同特性放在类里面.

class fruits {
    m_name: string;
    m_price: number;
    m_weights: string;


    //构造函数
    constructor(name: string, price: number, weights: string) {
        this.m_name = name;
        this.m_price = price;
        this.m_weights = weights;

    }

    //打印获取信息
    printf() {
        console.log("水果名称:" + this.m_name);
        console.log("价格:" + this.m_price);
        console.log("重量:" + this.m_weights);
    }
}

//传参并赋值给创建变量
var orange = new fruits("橘子", 15, "650g");
var apple = new fruits("苹果", 30, "1000g");


//该变量的结果打印出来
orange.printf();
apple.printf();

有点类似JavaScript 的闭包做法:

<script>
    function orange(index){

        var name = index;

        return function fruits(){

            console.log("水果名称:" + name);
        }

    }

    //接收返回值函数
    var result = orange('橘子')

    //打印返回值的结果
    console.log(result());

</script>