【TypeScript】TS入门级基础学习(一)

news2024/9/29 5:34:31

【TypeScript】TS入门级基础学习(一)

在这里插入图片描述

一、前言

TypeScript 是一种用于应用程序规模的 JavaScript 语言。 TypeScript 向 JavaScript 添加了可选类型,支持用于任何浏览器、任何主机、任何操作系统的大规模 JavaScript 应用程序的工具。

TypeScript 可编译为可读的、基于标准的 JavaScript。TypeScript属于强类型语言,JavaScript属于弱类型语言,强类型语言支持静态语言和动态语言,弱类型语言支持动态语言。

这里是TypeScript官方仓库 TypeScript ,有兴趣的可以更深层次了解其本质。

二、基本概念

1.强类型语言和弱类型语言
  • 强类型语言:强类型语言不允许改变变量的数据类型,除非进行强制类型转换。比如C++、Java、C#。
  • 弱类型语言:定义与强类型语言相反,一个变量可以被赋予不同数据类型的值。PHP、Ruby、Python。
2.动态语言和静态语言
  • 静态语言:编译时确定变量的数据类型,运行期间不可以改变其结构,比如C++、Java、C#。
  • 动态语言:运行时才确定数据结构和类型,变量使用之前不需要类型声明,比如:JavaScript、PHP、Ruby、Python。

三、TypeScript与JavaScript的区别

TypeScriptJavaScript
强类型语言,支持动态语言和静态语言弱类型语言,支持动态语言
用于解决大型项目的代码复杂性脚本语言,创建动态网页
可以在编译期间发现并纠正错误只能在运行时发现错误
先被浏览器编译成js语言在浏览器可以直接使用
支持模块、泛型、接口不支持模块、泛型、接口

四、环境搭建及演练准备

对于TypeScript,不能像JavaScript直接在浏览器可以运行,因此我们需要安装编译环境,有两种方案进行练习与演练,其一就是直接安装到本地练习,另一种就是使用官方提供的在线环境进行演练。

4.1 安装到本地
  • 安装
    yarn add typescript -g
    或者
    npm install typescript -g
    
  • 查看版本
    tsc -V
    

在这里插入图片描述

  • 编译ts文件,编译后生成以ts结尾的文件

    tsc xxx.ts
    

我们创建 hellowworld.ts , 添加内容如下,针对 userName 进行了类型定义,定义为基本数据类型string, 然后通过 tsc 命令进行编译,编译成浏览器可直接运行的代码

  var userName:string = '我是suwu150';
  console.log(userName);

编译后,能够发现在同文件夹下生成同名JavaScript代码 hellowworld.js ,其内容是编译之后的JavaScript代码,可直接在浏览器运行。

  var userName = '我是suwu150';
  console.log(userName);
4.2 在线运行

这个是官方提供的一个在线演练的环境,后面有很多演练的例子,我们会在此基础上进行演示

官方在线演示环境的地址: https://www.typescriptlang.org/play/

同样的,我们将 TypeScript 代码编写到左侧编辑器,能够同步在右侧看到编译之后的结果

  var userName:string = '我是suwu150';
  console.log(userName);

编译后结果
在这里插入图片描述

以上就是TypeScript基础知识及环境准备。希望喜欢的同学能够点赞关注。


在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/808371.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【简历完善】- SLAM - 第一篇:卡尔曼滤波的学习

场景:晚上你需要从自己的卧室去上厕所,你知道家里的布局,了解自己的步长,但是没有灯。你如何才能走到厕所呢? 一些术语 “预测” “估计”。下面所说的预测和估计就是一回事。不同博客里面这两个词语大概意思也是一…

如何⾃定义⼀个SpringBoot Srarter

⾃定义⼀个SpringBoot Srarter 1、创建⼀个项⽬,命名为 demo-springboot-starter,引⼊SpringBoot相关依赖 2、编写配置⽂件 定义属性配置的前缀 3、⾃动装配 创建⾃动配置类HelloPropertiesConfigure 4、配置⾃动类 在 /resources/META-INF/spri…

ROS 基础知识汇总

How to learn ROS ROS for Beginners: How to Learn ROS - The Construct ROSwiki 界面介绍 ROS/Tutorials/NavigatingTheWiki - ROS Wiki ROS要学会哪些?如何学习Ros? - 知乎 setup.bash 的作用 ROS中的setup.bash_泠山的博客-CSDN博客 包的层级架构 …

ChatGPT长文本对话输入方法

ChatGPT PROMPTs Splitter 是一个开源工具,旨在帮助你将大量上下文数据分成更小的块发送到 ChatGPT 的提示,并根据如何处理所有块接收到 ChatGPT(或其他具有字符限制的语言模型)的方法。 推荐:用 NSDT设计器 快速搭建可…

如何搭建并部署抖音SEO源代码?

搭建并部署抖音SEO源代码,需要以下步骤: 购买服务器:在云服务商或者VPS提供商购买一台服务器,选择Linux系统。 安装LAMP/LEMP环境:LAMP是指Linux Apache MySQL PHP,LEMP是指Linux Nginx MySQL PHP。…

卷积的意义及其应用

卷积的意义及其应用 卷积的定义 我们将形如 ∫ − ∞ ∞ f ( τ ) g ( x − τ ) d τ \int^\infty_{-\infty} f(τ)g(x-τ)dτ ∫−∞∞​f(τ)g(x−τ)dτ 的式子称之为f(x)与g(x)的卷积记为 h ( x ) ( f ∗ g ) ( x ) h(x…

js开发技巧

1. 初始化数组 如果想要初始化一个指定长度的一维数组,并指定默认值,可以这样: const array Array(6).fill(); // [, , , , , ] 如果想要初始化一个指定长度的二维数组,并指定默认值,可以这样: const…

【尚硅谷】第01章:随堂复习与企业真题(Java语言概述)

来源:尚硅谷Java零基础全套视频教程(宋红康2023版,java入门自学必备) 基本都是宋老师发的资料里面的内容,只不过补充几个资料里没直接给出答案的问题的答案。 不想安装markdown笔记的app所以干脆在这里发一遍。 第01章:随堂复习…

电路原理分析1

d2的作用是提供一个1.25v的电平 r3、r4的作用都是限流 c1是滤波 运放的4、8脚是常规的外围 这个运放是一个运算放大电路 具体计算是这样的: 按照虚短原则,输入的信号Uinu1,输出的信号Uoutu3 按照虚断原则,i1i2i5i5 u1/r2i1i5&#xff…

windows使用多账户Git,多远程仓库版本管理

1 清除全局配置 git config --global --list // 看一下是否配置过user.name 和 user.email git config --global --unset user.name // 清除全局用户名 git config --global --unset user.email // 清除全局邮箱 2 本地仓库,每个远程对应的本地仓库目录下执行 $…

Redis缓存击穿问题以及解决方案

Redis缓存击穿问题以及解决方案 前言一、什么是Redis缓存击穿二、解决方案1.使用锁来解决使用锁的流程:核心思路:思路流程图:操作的锁的代码:业务的实现: 2.逻辑过期来解决思路分析:解决流程:业…

YOLOv5改进系列(17)——更换IoU之MPDIoU(ELSEVIER 2023|超越WIoU、EIoU等|实测涨点)

【YOLOv5改进系列】前期回顾: YOLOv5改进系列(0)——重要性能指标与训练结果评价及分析 YOLOv5改进系列(1)——添加SE注意力机制

【数据结构】_5.栈

目录 1. 概念 2. 栈的使用 2.1 方法 2.2 示例 3. 栈的模拟实现 4. 栈的应用场景 4.1 题目1:不可能的出栈序列 4.2 题目2:逆序打印单链表 4.3 题目3:逆波兰表达式求值 4.4 题目4:括号匹配 4.5 题目5:栈的压入…

如何构建高效的接口自动化测试框架

在选择接口测试自动化框架时,需要根据团队的技术栈和项目需求来综合考虑。对于测试团队来说,使用Python相关的测试框架更为便捷。无论选择哪种框架,重要的是确保 框架功能完备,易于维护和扩展,提高测试效率和准确性。今…

最适合新手的SpringBoot+SSM项目《苍穹外卖》实战—(五)员工管理

黑马程序员最新Java项目实战《苍穹外卖》,最适合新手的SpringBootSSM的企业级Java项目实战。 新增员工 设计 DTO 类 我们需要根据新增员工接口设计对应的 DTO 类去接收前端传递的参数,前端传递参数列表如下: 注意: 当前端提交的…

C++ 成员初始化列表和new运算符的应用

输出一个学生的学号&#xff0c;姓名&#xff0c;性别和出生年月日 class Date { public:Date(int y, int m, int d) :m_year(y), m_month(m), m_day(d) {}void Print(){cout << m_year << "/" << m_month << "/" << m_day…

第四章 No.1树状数组的原理与使用

文章目录 应用问题原理树状数组练习题241. 楼兰图腾242. 一个简单的整数问题243. 一个简单的整数问题2244. 谜一样的牛 线段树的反面&#xff1a;树状数组原理复杂&#xff0c;实现简单 应用问题 支持两个操作&#xff1a;快速求前缀和任意地修改某个数&#xff0c;时间复杂度…

520 · 一致性哈希 II

链接&#xff1a;LintCode 炼码 - ChatGPT&#xff01;更高效的学习体验&#xff01; 题解&#xff1a; class Solution{private:int n;const int mVirtualNodeCount;map<int, int> mVirtualNodeToMachineIdMap;set<int> mVirtualNodeSet;public:Solution(int n…

SpringBoot的三层架构以及IOCDI

目录 一、IOC&DI入门 二、三层架构 数据库访问层 业务逻辑层 控制层 一、IOC&DI入门 在软件开发中&#xff0c;IOC&#xff08;Inversion of Control&#xff09;和DI&#xff08;Dependency Injection&#xff09;是密切相关的概念。 IOC&#xff08;控制反转&a…

CAN学习笔记2:CAN简介

CAN 1 概述 CAN(Controller Area Network),是 ISO 国际标准化的串行通信协议,目的是适应汽车“减少线束的数量”、“通过多个网络进行大量数据的高速传输”的需求。 低速 CAN(ISO11519)通信速率 10~125Kbps&#xff0c;总线长度可达 1000米. 高速 CAN(ISO11898)通信速率 125~…