写点什么

TypeScript 概述

作者:Emperor_LawD
  • 2022 年 5 月 02 日
  • 本文字数:1145 字

    阅读完需:约 4 分钟

TypeScript 概述

JavaScript 是什么

  • JS 是一种运行在客户端(比如:浏览器)中的编程语言,为网站提供动态交互特性,让网页动起来

  • 运行环境:

  • 浏览器

  • Node.js

  • 可以实现服务器端 / 桌面端编程等

TypeScript 是什么

  • TS 是 JavaScript 的超集(JS 有的 TS 都有)

  • 为 JS 添加了类型系统

    // TypeScript 代码:有明确的类型,即 : number(数值类型)    let age: number = 10;        // JavaScript 代码:无明确的类型    let age = 10;
复制代码
  • 还添加了 接口、枚举 等

  • 设计目标:开发大型项目

TypeScript 的特征

静态类型

类型系统按照“类型检查的时间”可分为静态类型和动态类型

  • 静态类型是指在编译阶段就能确定每个变量的类型,如果有错误,在编译的时候就会报错

  • TypeScript 是静态类型,ts 文件在运行前要先编译为 js 文件,在编译的时候就会进行类型检查

    let num: number = 1;    num.split(' ');    // 编译时会报错 Property 'split' does not exist on type 'number'(类型“number”上不存在属性“split”).
复制代码


  • 动态类型是指在运行阶段才会进行类型检查,如果有错误,在运行的时候才会报错

  • JavaScript 是动态类型,它是一种解释型语言,没有编译阶段

    var num = 1;    num.split(' ');    // 运行时会报错 
复制代码


弱类型

类型系统按照“是否允许隐式类型转换”可分为强类型和弱类型

  • 弱类型:数据类型可以忽略,可以不给变量指定类型

  • TypeScript 是 JavaScript 的超集,所以 TS 允许 JS 中所允许的所有操作,它和 JavaScript 一样都是弱类型

  • 注:TS 只是提前了类型检查的时间,并没有让系统本身变得更加严格

console.log(1 + '1');// 在TS和JS中运行结果相同,都为字符串 11
复制代码

TypeScript 代码运行

将 ts 文件转换为 js 文件,在 html 中引入 js 文件,即可运行

  • 新建 ts 文件,输入以下求和代码

  function sum(a: number, b: number) {      return a + b;  };    console.log(sum(1, 2));
复制代码


  • 打开终端,并输入 tsc 文件名.ts 单机回车

  • 新建一个 html 文件,使用 <script> 标签引入 js 文件

  <!DOCTYPE html>  <html lang="en">  <head>      <meta charset="UTF-8">      <meta http-equiv="X-UA-Compatible" content="IE=edge">      <meta name="viewport" content="width=device-width, initial-scale=1.0">      <title>Document</title>  </head>  <body>      <!-- 引入 js 文件 -->      <script src="n2_overview.js"></script>  </body>  </html>
复制代码


  • 在浏览器中运行 html 文件,即可在控制台查看到运行结果

优势

TypeScript 与 JavaScript 相比

  • 类型化思维方式,使得开发严谨,提前发现错误,减少改 Bug 时间

  • 类型系统提高了代码可读性,并使维护和重构代码更加容易

  • 补充了接口、枚举等开发大型应用时 JS 缺失的功能

  • Vue 3 源码使用 TS 重写,Angular 默认支持 TS,React 与 TS 完美配合

发布于: 刚刚阅读数: 2
用户头像

Emperor_LawD

关注

愿能如萤火一般,可以在黑夜里发一点光。 2021.05.19 加入

还未添加个人简介

评论

发布
暂无评论
TypeScript 概述_Emperor_LawD_InfoQ写作社区