一、TypeScript语言简单说明

简单说明

TypeScript 是微软2012年推出的一种编程语言,属于 JavaScript 的超集,可以编译为 JavaScript 执行。它最大特点是强大的类型系统和对ES6的支持,TypeScript托管于GitHub上面

TypeScript代码,通过编译可以转换为纯正的 JavaScript代码,且编译出来的 JavaScript代码能够运行在任何浏览器上。TypeScript 的编译工具也可以运行在任何服务器和任何系统上。

设计目标

TypeScript从一开始就提出了自己的设计目标,主要如下:

  • 遵循当前以及未来出现的ECMAScript规范
  • 为大型项目提供构建机制(通过Class 、接口和模块等支撑)。
  • 兼容现存的JavaScript代码,即任何合法的JavaScript程序都是合法的typeScript程序。
  • 对于发行版本的代码没有运行开销。(使用过程可以简单划分为程序设计阶段和执行阶段)。
  • 成为跨平台的开发工具,TypeScript使用Apache作为开源协议,且能够在所有主流的操作系统上安装和执行。

TypeScript的优势

❏ 拥有活跃的社区支持和生态

❏ 增加了代码的可读性和可维护性

❏ 拥抱 ES6 规范,也支持ES7 草案的规范

❏ TypeScript本身非常包容,兼容所有现行的JavaScript代码

TypeScript的劣势

❏ 短期投入到工作可能增加开发成本

❏ 集成到自动构建流程中需要额外的工作量

❏ 学习需要成本,需要理解接口、Class、泛型等知识

关于TypeScript更多信息,请参考TypeScript官网TypeScript中文网站TypeScript Github托管仓库

二、开发环境和工具支持

命令行工具

安装命令:$ npm install -g typescript

-g表示全局安装,上面的命令执行后会在全局环境下安装 tsc 命令。

查看版本信息命令:$ tsc --version

可以通过$ tsc --help来查看tsc使用帮助,通过$ tsc --version命令来查看tsc版本验证是否安装成功,当前最新的版本为Version 2.9.1,安装成功后我们就可以在任何地方来执行 tsc 命令了。

typeScript文件的后缀为.ts。

我们可以通过在命令行中输入$ tsc xxx.ts命令来把文件编译为JavaScript文件,上述命令中xxx为对应文件的名称,编译完成后将得到xxx.js文件。

编辑器使用

主流的编辑器都支持 TypeScript。下面列出推荐的编辑器(点击获取编辑器或IDE对TypeScript的支持)

Atom 21世纪黑客文本编辑器(拥有众多强大插件)

WebStorm 强大的前端开发编辑器

Visual Studio Code 内置了TypeScript支持,且本身也由TypeScript实现。

三、TypeScript组件

TypeScript语言内部被划分为三层,每层又被一次划分为子层或者是组件。

TypeScript语言内部的每一层都有自己不同的用途。

语言层:实现所有TypeScript的语言特性。

编译层:执行编译和类型检查操作,并把代码转换为JavaScript。

语言服务层:生成信息以帮助编辑器或其它开发工具提供更好的辅助特性。

VS是Microsoft's Visual Studio的缩写,意所有微软产品的官方一体化开发工具。

前端开发系列040-基础篇之TypeScript简单介绍的更多相关文章

  1. openresty开发系列13--lua基础语法2常用数据类型介绍

    openresty开发系列13--lua基础语法2常用数据类型介绍 一)boolean(布尔)布尔类型,可选值 true/false: Lua 中 nil 和 false 为"假" ...

  2. 从0到1用react+antd+redux搭建一个开箱即用的企业级管理后台系列(基础篇)

    背景 ​ 最近因为要做一个新的管理后台项目,新公司大部分是用vue写的,技术栈这块也是想切到react上面来,所以,这次从0到1重新搭建一个react项目架子,需要考虑的东西的很多,包括目录结构.代码 ...

  3. 前端开发:css基础知识之盒模型以及浮动布局。

    前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西?  为什么这个浮动没有效果?  这个问题楼主已经回答了n遍.今天则是把 ...

  4. ESP8266开发之旅 基础篇① 走进ESP8266的世界

    授人以鱼不如授人以渔,目的不是为了教会你具体项目开发,而是学会学习的能力.希望大家分享给你周边需要的朋友或者同学,说不定大神成长之路有博哥的奠基石... QQ技术互动交流群:ESP8266&3 ...

  5. ESP8266开发之旅 基础篇② 如何安装ESP8266的Arduino开发环境

    授人以鱼不如授人以渔,目的不是为了教会你具体项目开发,而是学会学习的能力.希望大家分享给你周边需要的朋友或者同学,说不定大神成长之路有博哥的奠基石... QQ技术互动交流群:ESP8266&3 ...

  6. ESP8266开发之旅 基础篇③ ESP8266与Arduino的开发说明

    授人以鱼不如授人以渔,目的不是为了教会你具体项目开发,而是学会学习的能力.希望大家分享给你周边需要的朋友或者同学,说不定大神成长之路有博哥的奠基石... QQ技术互动交流群:ESP8266&3 ...

  7. openlayers5-webpack 入门开发系列一初探篇(附源码下载)

    前言 openlayers5-webpack 入门开发系列环境知识点了解: node 安装包下载webpack 打包管理工具需要依赖 node 环境,所以 node 安装包必须安装,上面链接是官网下载 ...

  8. leaflet-webpack 入门开发系列一初探篇(附源码下载)

    前言 leaflet-webpack 入门开发系列环境知识点了解: node 安装包下载webpack 打包管理工具需要依赖 node 环境,所以 node 安装包必须安装,上面链接是官网下载地址 w ...

  9. 使用Xamarin开发即时通信系统 -- 基础篇(大量图文讲解 step by step,附源码下载)...

    如果是.NET开发人员,想学习手机应用开发(Android和iOS),Xamarin 无疑是最好的选择,编写一次,即可发布到Android和iOS平台,真是利器中的利器啊!而且,Xamarin已经被微 ...

  10. 【Windows10 IoT开发系列】配置篇

    原文:[Windows10 IoT开发系列]配置篇 Windows10 For IoT是Windows 10家族的一个新星,其针对不同平台拥有不同的版本.而其最重要的一个版本是运行在Raspberry ...

随机推荐

  1. github项目收集

    web模块 Nginx 监控模块vts: https://github.com/vozlt/nginx-module-vts

  2. 全局搜索——Lucene.Net与盘古分词的实现思路

    一.Lucene.Net 1.Lucene.Net介绍: Lucene.Net是一个C#开发的开源全文索引库(自带的有索引管理.分词.查询) Lucene.Net.Index 提供索引管理,词组排序. ...

  3. 揭秘AI自动化框架Browser-use(二),如何构造大模型提示词

    在上一篇技术分析中,我们探讨了Browser-use框架如何实现页面元素标注.本文将聚焦于其提示词构造流程,揭示AI如何理解浏览器界面的核心机制. 上一篇-揭秘AI自动化框架Browser-use(一 ...

  4. 【MOOC】华中科技大学计算机组成原理慕课答案-第六章-中央处理器(一)

    单选 1 一定不属于冯•诺依曼机体系结构必要组成部分的是()(单选) A. CPU B. RAM C. ROM √D. Cache 计算机中的ROM主要是用来存储一些系统信息,或者启动程序BIOS程序 ...

  5. k8s之ingress反向代理pod

    Ingress controller Nginx -->后来改造 Traefik -->也是用于微服务 Envoy  -->微服务 Ingress资源 目前使用0.17.1版本ing ...

  6. C语言一点五编程实战:纯 C 的模块化×继承×多态框架

    本文将大量涉及C语言高级操作,如函数指针.结构体指针.二级指针.指针频繁引用解引用.typedef.static.inline和C语言项目结构等知识,请确保自己不会被上述知识冲击,如果没有这顾虑,请尽 ...

  7. 鸿蒙Next复杂列表性能优化:让滑动体验如丝般顺滑

    @charset "UTF-8"; .markdown-body { line-height: 1.75; font-weight: 400; font-size: 15px; o ...

  8. 多级菜单(java GUI)

    话不多说,先来效果: 源码如下: package javaBasic; import java.awt.*; import javax.swing.*; import java.awt.event.* ...

  9. docker 发布netcore webapi

    新建项目testapi 新建Dockerfile 文件 FROM mcr.microsoft.com/dotnet/core/aspnet:2.2-nanoserver-1809 AS base WO ...

  10. FastAPI安全异常处理:从401到422的奇妙冒险

    title: FastAPI安全异常处理:从401到422的奇妙冒险 date: 2025/06/05 21:06:31 updated: 2025/06/05 21:06:31 author: cm ...