TypeScript基础知识

目录

关键字

JavaScript关键字

TypeScript关键字

TypeScript 基础类型

声明变量

声明变量的方式

变量命名规则

变量作用域

TypeScript 运算符

算术运算符

关系运算符

逻辑运算符

位运算符

赋值运算符

三元运算符

类型运算符


关键字

JavaScript关键字

abstract

else

instanceof

super

boolean

enum

int

switch

break

export

interface

synchronized

byte

extends

let

this

case

false

long

throw

catch

final

native

throws

char

finally

new

transient

class

float

null

true

const

for

package

try

continue

function

private

typeof

debugger

goto

protected

var

default

if

public

void

delete

implements

return

volatile

do

import

short

while

double

in

static

with

TypeScript关键字

break

as

catch

switch

case

if

throw

else

var

number

string

get

module

type

instanceof

typeof

public

private

enum

export

finally

for

while

void

null

super

this

new

in

return

true

false

any

extends

static

let

package

implements

interface

function

new

try

yield

const

continue

do

TypeScript 基础类型

数据类型

关键字

描述

任意类型

any

声明为 any 的变量可以赋予任意类型的值。

数字类型

number

双精度 64 位浮点值。它可以用来表示整数和分数。TypeScript 和 JavaScript 没有整数类型

let binaryLiteral: number = 0b1010; // 二进制
let octalLiteral: number = 0o744;    // 八进制
let decLiteral: number = 6;    // 十进制
let hexLiteral: number = 0xf00d;    // 十六进制

字符串类型

string

一个字符系列,使用单引号(')或双引号(")来表示字符串类型。反引号(`)来定义多行文本和内嵌表达式。

let name: string = "Runoob"; 
let years: number = 5; 
let words: string = `您好,今年是 ${ name } 发布 ${ years + 1} 周年`;

布尔类型

boolean

表示逻辑值:true 和 false。

let flag: boolean = true;

数组类型

声明变量为数组。

// 在元素类型后面加上[] 
let arr: number[] = [1, 2];
// 或者使用数组泛型 
let arr: Array<number> = [1, 2];

元组

元组类型用来表示已知元素数量和类型的数组,各元素的类型不必相同,对应位置的类型需要相同。

let x: [string, number]; 
x = ['Runoob', 1]; // 运行正常 
x = [1, 'Runoob']; // 报错 
console.log(x[0]); // 输出 Runoob

枚举

enum

枚举类型用于定义数值集合。

enum Color {Red, Green, Blue}; 
let c: Color = Color.Blue; 
console.log(c); // 输出 2

void

void

用于标识方法返回值的类型,表示该方法没有返回值。

function hello(): void { 
    alert("Hello Runoob"); 
}

null

null

表示对象值缺失。

在 JavaScript 中 null 表示 "什么都没有"。null是一个只有一个值的特殊类型。表示一个空对象引用。用 typeof 检测 null 返回是 object。

undefined

undefined

用于初始化变量为一个未定义的值。

在 JavaScript 中, undefined 是一个没有设置值的变量。typeof 一个没有值的变量会返回 undefined。Null 和 Undefined 是其他任何类型(包括 void)的子类型,可以赋值给其它类型,如数字类型,此时,赋值后的类型会变成 null 或 undefined;

而在TypeScript中启用严格的空校验(--strictNullChecks)特性,就可以使得null 和 undefined 只能被赋值给 void 或本身对应的类型;

// 启用 --strictNullChecks
let x: number;
x = 1; // 编译正确
x = undefined;    // 编译错误
x = null;    // 编译错误

// 启用 --strictNullChecks
let x: number | null | undefined;
x = 1; // 编译正确
x = undefined;    // 编译正确
x = null;    // 编译正确

never

never

never 是其它类型(包括 null 和 undefined)的子类型,代表从不会出现的值。

这意味着声明为 never 类型的变量只能被 never 类型所赋值,在函数中它通常表现为抛出异常或无法执行到终止点(例如无限循环)

let x: never;
let y: number;

// 编译错误,数字类型不能转为 never 类型
x = 123;

// 运行正确,never 类型可以赋值给 never类型
x = (()=>{ throw new Error('exception')})();

// 运行正确,never 类型可以赋值给 数字类型
y = (()=>{ throw new Error('exception')})();

// 返回值为 never 的函数可以是抛出异常的情况
function error(message: string): never {
    throw new Error(message);
}

// 返回值为 never 的函数可以是无法被执行到的终止点的情况
function loop(): never {
    while (true) {}
}

声明变量

声明变量的方式

在 JavaScript 中可以通过关键字 var 、 let 、 const 来声明变量,当然 TypeScript 中同样也可以。

这三种声明变量的方式各有不同,如下所示:

  • var 关键字声明变量,其作用于为该语句所在的函数内, 且存在变量提升现象。
  • let 的声明类似于 var,但是它的作用域为该语句所在的代码块内,不存在变量提升。注意它们一个是函数内,一个是代码块内,代码块就是直接使用 {} 括起来的代码。
  • const 是 let 的一个扩展,它可以防止重新分配变量,一般用来声明常量,在后面出现的代码中不能再修改常量的值。

变量命名规则

在讲如何声明变量之前,我们先来看一下 TypeScript 的变量命名规则,如下所示:

  • 变量名称可以包含数字、字母、下划线 _ 和美元 $ 符号,其他都不可以,例如 a、abc、AA、a_ 都符合命名规范。
  • 变量名不能以数字作为开头,例如 7a 就不符合变量的命名规范,而 a7 是可以的。

使用关键字 var 声明变量

首先在 JavaScript 语言中我们都是使用关键字 var 来声明变量的。那么为什么在 TypeScript 中我们更偏向于使用 let,下面我们会讲到原因。

在 TypeScript 中声明变量其实就和 JavaScript 很类似。但因为一个是强类型语言一个是弱类型语言,所以两者在声明变量的格式上会有一些不同。

在 TypeScript 中声明变量,一共有四种方式:

  • 第一种,声明变量的类型及初始值,需要在变量名后面加上变量类型和初始值

var [变量名] : [类型] = 值; // 例如 var a : number = 1;

  • 第二种,声明变量的类型,但是不赋初始值。在这种情况下,该变量的值默认为 undefined

var [变量名] : [类型]; // 例如 var a:number;

  • 第三种,声明变量并赋初始值,但不声明类型,此时变量类型将被设置为any(任意类型),这种声明方式和 JavaScript 中的类似

var [变量名] = 值; // 例如 var a = 1;

  • 第四种,不声明变量类型,且不赋初始值。在这种情况下,变量的数据类型为 any,初始化值为 undefined

var [变量名]; // 例如 var a;

变量作用域

一个变量的作用域指定了这个变量的定义位置,程序中变量的可用性是由它作用域决定的。变量不可以在作用域以外的地方使用。

TypeScript 的作用域分为下面三种:

  • 全局作用域:全局变量定义在程序结构的外部,可以在代码的任何位置使用。
  • 局部作用域:局部变量,只能在声明它们的函数或代码块中访问。
  • 类作用域:也可称为字段,类变量声明在一个类里头,但在类的方法外面,该变量可以通过类的对象来访问。类变量也可以是静态的,静态的变量可以通过类名直接访问。

TypeScripe示例:

var global_num = 12          // 全局变量
class Numbers { num_val = 13;             // 实例变量static sval = 10;         // 静态变量storeNum():void { var local_num = 14;    // 局部变量} 
} 
console.log("全局变量为: "+global_num)  
console.log(Numbers.sval)   // 静态变量
var obj = new Numbers(); 
console.log("实例变量: "+obj.num_val)

JavaScripe示例:

var global_num = 12; // 全局变量
var Numbers = /** @class */ (function () {function Numbers() {this.num_val = 13; // 实例变量}Numbers.prototype.storeNum = function () {var local_num = 14; // 局部变量};Numbers.sval = 10; // 静态变量return Numbers;
}());
console.log("全局变量为: " + global_num);
console.log(Numbers.sval); // 静态变量
var obj = new Numbers();
console.log("实例变量: " + obj.num_val);

TypeScript 运算符

TypeScript 主要包含以下几种运算:

  • 算术运算符
  • 关系运算符
  • 逻辑运算符
  • 位运算符
  • 赋值运算符
  • 三元/条件运算符
  • 类型运算符

算术运算符

运算符

描述

例子

x 运算结果

y 运算结果

+

加法

x=y+2

7

5

-

减法

x=y-2

3

5

*

乘法

x=y*2

10

5

/

除法

x=y/2

2.5

5

%

取模(余数)

x=y%2

1

5

++

自增

x=++y

6

6

x=y++

5

6

--

自减

x=--y

4

4

x=y--

5

4

关系运算符

运算符

描述

比较

返回值

==

等于

x==8

false

x==5

true

!=

 不等于

x!=8

true

>

 大于

x>8

false

<

 小于

x<8

true

>=

 大于或等于

x>=8

false

<=

 小于或等于

x<=8

true

逻辑运算符

运算符

描述

例子

&&

and

(x < 10 && y > 1) 为 true

||

or

(x==5 || y==5) 为 false

!

not

!(x==y) 为 true

位运算符

运算符

描述

例子

类似于

结果

十进制

&

AND,按位与处理两个长度相同的二进制数,两个相应的二进位都为 1,该位的结果值才为 1,否则为 0。

x = 5 & 1

0101 & 0001

0001

 1

|

OR,按位或处理两个长度相同的二进制数,两个相应的二进位中只要有一个为 1,该位的结果值为 1。

x = 5 | 1

0101 | 0001

0101

 5

~

取反,取反是一元运算符,对一个二进制数的每一位执行逻辑反操作。使数字 1 成为 0,0 成为 1。

x = ~ 5

 ~0101

1010

 -6

^

异或,按位异或运算,对等长二进制模式按位或二进制数的每一位执行逻辑异按位或操作。操作的结果是如果某位不同则该位为 1,否则该位为 0。

x = 5 ^ 1

0101 ^ 0001

0100

 4

<<

左移,把 << 左边的运算数的各二进位全部左移若干位,由 << 右边的数指定移动的位数,高位丢弃,低位补 0。

x = 5 << 1

0101 << 1

1010

 10

>>

右移,把 >> 左边的运算数的各二进位全部右移若干位,>> 右边的数指定移动的位数。

x = 5 >> 1

0101 >> 1

0010

2

>>>

无符号右移,与有符号右移位类似,除了左边一律使用0 补位。

x = 2 >>> 1

0010 >>> 1

0001

1

赋值运算符

运算符

例子

实例

x 值

= (赋值)

x = y

x = y

x = 5

+= (先进行加运算后赋值)

x += y

x = x + y

x = 15

-= (先进行减运算后赋值)

x -= y

x = x - y

x = 5

*= (先进行乘运算后赋值)

x *= y

x = x * y

x = 50

/= (先进行除运算后赋值)

x /= y

x = x / y

x = 2

三元运算符

三元运算有 3 个操作数,并且需要判断布尔表达式的值。该运算符的主要是决定哪个值应该赋值给变量。

Test ? expr1 : expr2

  • Test − 指定的条件语句
  • expr1 − 如果条件语句 Test 返回 true 则返回该值
  • expr2 − 如果条件语句 Test 返回 false 则返回该值

类型运算符

typeof 运算符

typeof 是一元运算符,返回操作数的数据类型。

instanceof

instanceof 运算符用于判断对象是否为指定的类型。

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

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

相关文章

2023西工大NOJ (C语言版) 持续更新ing

目前更新到70题&#xff01; 目前WA&#xff1a;飞机起飞速度&#xff1b;字符串替换&#xff1b;GPS通信协议。 前言 代码均可AC&#xff0c;解析参见我的博客 NOJ(C)易错总结 (annesede.github.io)。&#xff08;已更新到70题&#xff01;&#xff09; 部分题目由于过于简…

python玩具电商销售数据可视化和商品推荐系统设计与实现(django框架)

博主介绍&#xff1a;黄菊华老师《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者&#xff0c;CSDN博客专家&#xff0c;在线教育专家&#xff0c;CSDN钻石讲师&#xff1b;专注大学生毕业设计教育和辅导。 所有项目都配有从入门到精通的基础知识视频课程&#xff…

老杨说运维 | 年末大盘点!擎创CEO实时盘点运维大干货,不容错过

2023年即将走到尾声&#xff0c;对于擎创而言&#xff0c;这一年是颇具成长和成就的一年。我们庆幸获得了更多客户的信任&#xff0c;也为他们达到下一个运维阶段提供了充足的助力。 越多的实践就会带来越多新的理解和可优化的经验。这一年来&#xff0c;擎创在运维数据治理、智…

docker搭建maven私库Nexus3

什么是Maven私服&#xff1f; Maven 私服是一种特殊的Maven远程仓库&#xff0c;它是架设在局域网内的仓库服务&#xff0c;用来代理位于外部的远程仓库&#xff08;中央仓库、其他远程公共仓库&#xff09;。 当然也并不是说私服只能建立在局域网&#xff0c;也有很多公司会…

唯创知音WTN6xxx-8S语音芯片:精准内部震荡与无需外部震荡的优势及应用

在当前的集成电路市场中&#xff0c;唯创知音推出的WTN6xxx-8S语音芯片以其独特的优势和应用领域&#xff0c;吸引了众多工程师和设计师的关注。这款语音芯片不仅具有精准的/-1%内部震荡&#xff0c;还消除了对外部震荡器的需求&#xff0c;从而在语音处理和控制方面达到了新的…

使用静态HTTP提供动态内容

在Web开发中&#xff0c;静态HTTP和动态HTTP常被视作两种截然不同的技术。静态HTTP主要用于传输不变的内容&#xff0c;如HTML、CSS和JavaScript文件&#xff0c;而动态HTTP则能处理用户交互、实时数据等动态需求。但鲜为人知的是&#xff0c;我们其实可以通过一些技巧&#xf…

vue中 把vue页面导出为 html页面

vue导出文件后缀为html的页面 震惊&#xff01;我司要求我把数据融合起来&#xff0c;导出用html的方式展示&#xff0c;请看下面示例 <template><div><el-button click"gethtml">导出报告</el-button><div id"main"><…

高通8255芯片烧写方法

目录 一&#xff1a;高通官方提供软件下载 QPM&#xff08;Qualcomm Package Manager&#xff09; 二&#xff1a;烧写驱动程序下载 USB Drivers 三&#xff1a;烧写工具下载QCAT 四&#xff1a;QCAT软件使用 4.1串口选择 4.2 烧写选项配置 4.3 开始烧写下载 4.4烧写成…

若依打包将vue放到.jar里面部署

1.vue静态文件&#xff0c;以及单页面 ruoyi-admin\src\main\resources\static \ruoyi-admin\src\main\resources\templates 2.后台开放白名单 "/cms", "/cms#/login" 3. mvc访问vue页面入口&#xff0c;接口 package com.ruoyi.web.controller.syst…

基于springboot实现的健身房管理系统

一、系统架构 前端&#xff1a;html | js | css | jquery | bootstrap 后端&#xff1a;springboot | springdata-jdbc 环境&#xff1a;jdk1.7 | mysql | maven 二、代码及数据库 三、功能介绍 01. 登录页 02. 管理员-首页 03. 管理员-会员卡查询 04. 管理员-会员管理…

新零售ERP软件功能有哪些?新零售ERP系统哪个操作简单

新零售企业通常存在多仓库、多营销渠道、多业务模式、价格策略灵活、供应链复杂等情况&#xff0c;如何实现配送、财务、客户、订单、仓储等业务数据一体化和智能化管理&#xff0c;是不少新零售企业需要解决的难点。 随着新零售企业数量不断增多&#xff0c;行业之间的竞争也…

酷开科技丨出“奇”不意,酷开系统给客厅多点颜色!

对现代人来说&#xff0c;关于“家”的含义&#xff0c;有了更多的认识。家&#xff0c;不仅要遮风挡雨&#xff0c;温暖适意&#xff0c;更要能让人摆脱高负荷生活&#xff0c;成为一个可以汲取能量、重获元气的安心乐园。品质不单单是简单的一个词&#xff0c;更是一个美好家…

mysql 与mssql 命令有那些区别

use databasename 进入指定数据库名 命令一致 select databse() 查询当前进入数据库的名 mssql无法使用&#xff0c;mysql正常 mssql 暂无 C知道介绍 以下是MySQL和MSSQL命令的一些区别&#xff1a; 1. 连接数据库的命令不同&#xff1a; - MySQL&#xff1a;…

Python绘制正弦波、三角波、方波

Python是一种强大的编程语言,可以用来绘制各种波形,例如正弦波、余弦波、方波、三角波等。下面是一个简单的例子,演示如何使用Python绘制这些波形。 import numpy as np import matplotlib.pyplot as plt# 生成时间序列 t = np.linspace(0, 1, 500, endpoint=False)# 绘制正…

Tableau进阶--Tableau数据故事慧(20)解构Tableau的绘图逻辑

官网介绍 官网连接如下&#xff1a; https://www.tableau.com/zh-cn tableau的产品包括如下&#xff1a; 参考:https://zhuanlan.zhihu.com/p/341882097 Tableau是功能强大、灵活且安全些很高的端到端的数据分析平台&#xff0c;它提供了从数据准备、连接、分析、协作到查阅…

每日一题:实现方法fn,遇到退格字符就删除前面的字符,遇到俩个退格就删除俩个字符

每日一题 请按以下要求实现方法fn,遇到退格字符就删除前面的字符&#xff0c;遇到俩个退格就删除俩个字符&#xff1a; // 比较含有退格的字符串&#xff0c;"<-"代表退格键&#xff0c;"<"和"-"均为正常字符 // 输入&#xff1a;"…

FFmpeg的调试打印函数族

这里就简单罗列下&#xff0c;免得你都不知道有这些接口 /*** defgroup lavf_misc Utility functions* ingroup libavf* {** Miscellaneous utility functions related to both muxing and demuxing* (or neither).*//*** Send a nice hexadecimal dump of a buffer to the spe…

【antd】 Pagination.onChange获取不到pageSize值的原因

如下代码的onChange事件参数pagination获取不到pagination.pageSize <PaginationclassName"common-pagination-wrap"total{total}current{query?.pageNo || 1}pageSize{query?.pageSize || 10}onChange{handlePaginationChange}/>改成如下&#xff0c;确保这…

探索GameFi:区块链与游戏的未来融合

在过去的几年里&#xff0c;区块链技术逐渐渗透到各个领域&#xff0c;为不同行业带来了前所未有的变革。其中&#xff0c;游戏行业成为了一个引人注目的焦点&#xff0c;而这种结合被称为GameFi&#xff0c;即游戏金融。GameFi不仅仅是一个概念&#xff0c;更是一场区块链和游…

过拟合与欠拟合

一、模型选择 1、问题导入 2、训练误差与泛化误差 3、验证数据集和测试数据集 4、K-折交叉验证 一般在没有足够多数据时使用。 二、过拟合与欠拟合 1、过拟合 过拟合的定义&#xff1a; 当学习器把训练样本学的“太好”了的时候&#xff0c;很可能已经把训练样本自身的一些特…