【typescript基础篇】(第一章)TS环境安装与初体验

TypeScript介绍

  • TS是是由微软2012年开发的一款开源的编程语言
  • TypeScript 是 Javascript 的超集,遵循最新的 ES6、Es5 规范。TypeScript 扩展了 JavaScript 的语法
  • 在js的基础上,为js添加了类型支持

设计目标

  • 遵循当前以及未来出现的ECMAScript规范
  • 开发大型应用,可以编译程纯JavaScript,编译出来的JavaScript可以运行在浏览器上
  • 成为跨平台的开发工具,TypeScript使用Apache作为开源协议,且能够再所有主流的操作系统上安装和执行

TS优势

  • 更早的发现错误
  • 任何位置都有代码提示,增加开发效率
  • 类型系统提升了代码的可维护性,重构更容易
  • 使用最新的ECMAScript语法,最新
  • ts类型推断机制,降低成本

TS劣势

  • 短期投入到工作可能增加开发成本
  • 和有些库的结合不是很完美
  • 学习需要成本,需要理解接口,泛型,类型等知识
  • 集成到自动构建流程中需要额外的工作量

TS与JS的区别

JavaScript TypeScript
动态语言 具有静态语言的特点
编译性语言运行时报错 编译期间报错
弱类型语言,没有类型 强类型语言,类似java, C++等,定义时指明类型
不支持模块、接口、泛型 支持模块、接口、泛型
基本数据类型和引用数据类型 更多的基本数据类型和引用数据类型,如any, never, enum等
在浏览器中直接执行 编译为js后才能在浏览器进行执行

TS环境安装与初体验

安装

js 复制代码
npm install -g typescript
// or
cnpm install -g typescript
// or
yarn global add typescript

运行

js 复制代码
// 编译生成js文件
tsc 文件名称.ts
// 监听文件变化
tsc --watch  

js缺陷的演示

js 复制代码
/* 
  1.没有对类型进行检测
  2.没有对是否传参进行检测
*/
function test(msg) {
  console.log(msg.length);
}

test("邱淑贞") // 可以正常使用
test(666) // undefine
test() // error

采用TS书写同样的代码,我们可以看到,编译器非常友好的对我们进行了提示

ts 复制代码
function test(msg:string) {
  console.log(msg.length);
}

test("邱淑贞") // 可以正常使用
test(666) // 编译不通过
test() // 编译不通过
相关推荐
好_快33 分钟前
Lodash源码阅读-nth
前端·javascript·源码阅读
maybe啊38 分钟前
js 使用 Web Workers 来实现一个精确的倒计时,即使ios手机锁屏或页面进入后台,倒计时也不会暂停。
开发语言·前端·javascript
好_快40 分钟前
Lodash 源码阅读-baseNth
前端·javascript·源码阅读
好_快42 分钟前
Lodash源码阅读-join
前端·javascript·源码阅读
子洋44 分钟前
Chroma+LangChain:让AI联网回答更精准
前端·人工智能·后端
好_快1 小时前
Lodash源码阅读-isIndex
前端·javascript·源码阅读
好_快1 小时前
Lodash源码阅读-reverse
前端·javascript·源码阅读
Gazer_S2 小时前
【基于 SSE 协议与 EventSource 实现 AI 对话的流式交互】
前端·javascript·人工智能·交互
银迢迢3 小时前
如何创建一个Vue项目
前端·javascript·vue.js
几何心凉6 小时前
如何解决Vue组件间传递数据的问题?
前端·javascript·vue.js