TypeScript 对比 JavaScript

本着学到哪里都记笔记的原则 浅说下这两种语言的区别 这段时间在学这两种语言的一些基本语法

先来看两段代码

目录

核心区别

详细说明（针对上面代码

总结

TS:

var customerFirstname: string = 'zhongxue';
var customerLastname: string = 'ye';
var customerAge: number = 17;  
// 明确声明为数字类型；如果尝试 customerAge = 'seventeen'会​​编译报错​
type customer = {firstname: string, lastname: string, active: boolean};
//定义了严格的对象结构，firstcustomer缺少对应参数会报错
var firstCustomer: customer = {firstname: 'zhongxue',lastname: 'ye',active: true
};// firstcustomer 输入"."后会弹出属性提示：firstname | lastname | active

JS:

var customerFirstname = 'zhongxue';
var customerLastname = 'ye';
var customerAge = 17;  
// 可以随时改变类型，后续 customerAge = 'seventeen'是合法的
// 调用时如果传错参数，直到运行时才报错
var firstCustomer = {firstname: 'zhongxue',lastname: 'ye',active: true
};

核心区别

首先要了解ts与js最根本的区别是前者是静态类型系统（编译时检查），而后者是动态类型系统（运行时检查）；在ts中定义变量时需要定义明确的变量类型，也可以通过type来自定义类型，能够在代码运行前就帮你发现了错误，而不是等到用户使用时才在浏览器中崩溃

详细说明（针对上面代码

特性	TypeScript 版本	JavaScript 版本	区别意义
​​变量类型注解​​	: string, : number等	无类型声明	TS 在编译时就能发现类型错误，JS 只能在运行时发现
​​自定义类型​​	使用 type关键字定义 customer类型	无等效语法	TS 可以预先定义数据结构，JS 只能靠开发者记住对象结构
​​对象结构检查​​	会检查 firstCustomer是否符合 customer类型	不检查对象结构	TS 能在写代码时就发现属性缺失或类型错误，JS 要到运行时才可能报错
​​代码提示​​	编辑器能基于类型定义提供智能提示	只能提供基础提示	开发体验提升，减少拼写错误和属性访问错误
​​代码可读性​​	类型信息让代码更自文档化	需要额外注释说明类型	新人更容易理解代码意图

总结

1. ​​错误更早发现​​

   • TypeScript：在写代码时（编译时）就能发现像 firstCustomer.actve = true（拼写错误）这样的问题

   • JavaScript：只能在运行时才发现错误

2. ​​更好的团队协作​​

   • TypeScript 的类型定义相当于一份"合同"，明确规定了数据结构

   • 新人接手代码时更容易理解

3. ​​代码更健壮​​

   • 避免意外的类型转换

   • 防止访问不存在的属性

有兴趣的可以自行了解下 目前博主在学的偏向js&python用于写自动化脚本的，这篇文章写的也是比较浅显。