首页 > 编程语言 >TypeScript Vs JavaScript 区别

TypeScript Vs JavaScript 区别

时间:2023-06-05 22:57:12浏览次数:49  
标签:TypeScript val res JavaScript TS JS Vs let test

一、观察

1. JS 平常的复制类型

let val;
val = 123;
val = "123";
val = true;
val = [1, 3, 5];

注意点:
由于JS是弱类型的, 所以只要定义了一个变量, 就可以往这个变量中存储任意类型的数据
也正是因为如此, 所以会给我们带来一个问题

2. 假设a是一个数组, b是一个数值

function test(a, b) {
    return a.length + b;
}
> let res = test([1, 3, 5], 10);
console.log(res);
上面会正常的输出 : 13 

3. 好这只是我们的期望a是数组假如?

> let res = test(1, 10);
console.log(res);
上面则会输出什么呢?

二、问题

经过我们的小例子可以看出JS是不严格的未在编写时候就提示这里是错误的!!!

1. TS

安装我们的TS 提前要有node环境哦

打开命令行安装 npm install typescript -g 全局安装一下

image-20230605221327111

它会安装一个 tsc的编译工具 就和less sass一样编译成可运行的js文件

2.体验TS

创建02-体验.ts文件

注意点: 由于TS 并不是一门新的语言,而是对JS对扩展, 所以我们可以在TS文件当中直接编写JS代码

let val: number; // 定义指定参数类型
// 数字
val = 123;
// 报错
val = "123";
val = true;
val = [1, 3, 5]

image-20230605222053376

1. 严格的TS

期望a是一个数组, b是一个数值

// 定义限制any[]为数组类型 number 数字
function test(a:any[], b:number) {
    return a.length + b;
}

// 正确
> let res = test([1,3,5], 10);
console.log(res);

// 直接编译器提示错误
let res = test(1, 10);
console.log(res);

image-20230605223115670

运行02-体验TS.ts

利用我们刚刚下载的TS插件当中给我们安装了一个tsc的东西

image-20230605223419409

编译成功后

image-20230605223523398

编译错误代码

image-20230605223739173

提示期望得到一个数组,这样子TS就帮助弱类型变成强类型了

标签:TypeScript,val,res,JavaScript,TS,JS,Vs,let,test
From: https://www.cnblogs.com/Yangbuyi/p/17459170.html

相关文章

  • TypeScript开篇
    1.什么是TypeScript(TS)?Typescript为JS带来了类型能力,如今已被越来越多的大型前端项目选用。Typescript的出现大大改善了开发体验,增强了代码的可维护性和稳定性。TypeScript简称TSTS和JS之间的关系其实就是Less/Sass和CSS之间的关系就像Less/Sass是对CSS进行扩展一样,T......
  • vscode技巧----屏蔽python类型错误提示
    有一段python代码如下:fromwin32com.shellimportshellfromwin32com.shellimportshellcon结果出现类型错误的提示:在网上搜了一些方法都没有解决,而实际运行代码时,又不会出错,所以干脆就把这个告警提示屏蔽掉即可,如下所示:fromwin32com.shellimportshell......
  • win10,vs2015深度学习目标检测YOLOV5+deepsort C++多目标跟踪代码实现,源码注释,拿来即
    int8,FP16等选择,而且拿来即用,自己再win10安装上驱动可以立即使用,不用在自己配置,支持答疑。自己辛苦整理的,求大佬打赏一顿饭钱。苦苦苦、平时比较比忙,自己后期会继续发布真实场景项目;欢迎下载。优点:1、架构清晰,yolov5和sort是分开单独写的,可以随意拆解拼接,都是对外接口。2、支持答疑......
  • 文心一言 VS 讯飞星火 VS chatgpt (32)-- 算法导论5.2 4题
    四、利用指示器随机变量来解如下的帽子核对问题(hat-heckproblem):n位顾客,他们每个人给餐厅核对帽子的服务生一顶帽子。服务生以随机顺序将帽子归还给顾客。请问拿到自己帽子的客户的期望数是多少?文心一言:我们可以将这个问题转化为求解在指示器随机变量基础上的期望值。已知......
  • 如何让VSCode格式化代码时运算符两边不要添加空格
    很多格式化软件都是默认运算符两边加空格的,没给奇葩的人留一点选择的余地,经过自己的一番摸索终于找到了VSCode格式化代码时运算符两边不要添加空格的方法。之前在一个帖子上看到的,VSCode中针对C语言的代码格式化配置_vscode格式化c代码_booksyhay的博客-CSDN博客:https://blog.csdn......
  • 文心一言 VS 讯飞星火 VS chatgpt (32)-- 算法导论5.2 4题
    四、利用指示器随机变量来解如下的帽子核对问题(hat-heckproblem):n位顾客,他们每个人给餐厅核对帽子的服务生一顶帽子。服务生以随机顺序将帽子归还给顾客。请问拿到自己帽子的客户的期望数是多少?文心一言:我们可以将这个问题转化为求解在指示器随机变量基础上的期望值。已知有n位......
  • http协商缓存VS强缓存
      本文主要讲解浏览器端的缓存,缓存的作用是不言而喻的,能够极大的改善网页性能,提高用户体验。1、浏览器缓存缓存这东西,第一次必须获取到资源后,然后根据返回的信息来告诉如何缓存资源,可能采用的是强缓存,也可能告诉客户端浏览器是协商缓存,这都需要根据响应的header内容来决定的......
  • 记录--JavaScript 中有趣的 9 个常用编码套路
    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助1️⃣set对象:数组快速去重常规情况下,我们想要筛选唯一值,一般会想到遍历数组然后逐个对比,或者使用成熟的库比如lodash之类的。不过,ES6带来了一个新玩意儿!它引入了一个全新的对象类型:Set!而且,如果结合上...展开运算符......
  • 详解JavaScript中的__proto__和prototype
    目录一、JS的对象创建方法二、双对象法则三、__proto__和prototypeprototype是什么?__proto__又是什么?对于JS来说,__proto__和prototype的区别是个绕不开的话题。本文就试图从它们的根本上说清楚它们是什么,又有什么区别,所以本文会从JS的对象开始说起,以其期待把本文的主题......
  • Javascript之深入浅出递归思想
    Javascript之深入浅出递归思想 “递归”在生活中的一个典例就是“问路”。如图小哥哥进入电影院后找不到自己的座位,问身边的小姐姐“这是第几排”,小姐姐也不清楚便依次向前询问,问至第一排的观众后依次向后反馈结果,“我是第一排”,“我是第二排”,···,最终确定自己座位所在排数......