在小白眼里TypeScript对于JavaScirpt的意义

2,276 阅读2分钟

本人为一名前端初学者,刚刚接触TypeScript,如果有任何理解错误或者不准确的地方,烦请各位大佬不吝赐教。

JavaScript的缺点

JavaScript是一个弱类型语言,为什么这么说呢,举一个简单的例子

let num = "123";
console.log(typeof(num));

num = 1;
console.log(typeof(num));

num = true;
console.log(typeof(num));

通过node执行以上代码可得到以下输出结果:

由此可见,即使是定义的同一个num,他的数据类型也可以是多种多样的。 接下来我们举一个简单的例子,写一个两数求和的函数:

const add = function(num1,num2){
    if (arguments.length < 2){
        throw new Error('请传递两个参数')
        return ;
    }
    if(typeof num1 != 'number' || typeof num2 != 'number'){
        throw new Error('参数类型有误');
        return;
    }
    return num1 + num2;
}
console.log(add(1,5));

我们尝试输出

我们虽然能得到正确的结果,但是这个函数的计算部分仅仅只有

const add = function(num1,num2){
    return num1 + num2;
}
console.log(add(1,5));

如果不写上面繁琐的条件的话,我们稍微修改一下函数的输入数据

const add = function(num1,num2){
    return num1 + num2;
}
console.log(add(1,'a'));

输出结果如下

很显然这不是我们想要的结果。

TypeScript对于JavaScirpt的改进

还是一个两数相加的函数,我们用typescript来写的话会是怎样

const nums = (num1:number ,num2:number):number => {
    return num1 + num2;
}
console.log(nums(1,5));

我们尝试修改错误的参数时,ts给我们以下结果:

ts会及时报错,因为在ts的代码中早就给参数和返回值固定了数据类型为number。

在终端执行以下代码(此操作需要npm安装typescript)

PS D:\lesson\js\add> tsc .\2.ts

执行之后会在同目录下生成一个同名的js文件:

var nums = function (num1, num2) {
    return num1 + num2;
};
console.log(nums(1,5));

输出结果为

小结

在我看来TypeScript为JavaScript的优化版,但是其本质还是JavaScript,他将一些因为JavaScript自身缺点而产生的繁琐的问题变得简单。