typeScript 之 基础

工具: PlayGround

源码： GitHub TypeScript


变量声明

typeScript中变量声明注意：

  • 开头不能以数字开头
  • 变量名称可以包含数字和字母
  • 除了下划线_和美元$符号外，不能包含其他任意特殊字符

声明的结构： let 变量名： 类型 = 值

如果没有声明类型，则变量为any类型， 如果没有赋值，则数值为undefined

let name: string = "name";// 没有声明类型，在赋值以后，编译器会对类型进行推导
// 如果不能推导出类型，则被默认为any类型
let value = 10;// 没有赋值表示为undefined
let data;

针对于没有声明的类型，TypeScritp会静态编译，注意警告：

let num = 2;
console.log("num type:", typeof(num));		// "num type:",  "number" 
console.log("num 变量的值为 "+num);				 // "num 变量的值为 2"// Type 'string' is not assignable to type 'number'
// 没有报错，但会有警告
num = "12"; console.log("num type:", typeof(num));    // "num type:",  "string" 
console.log(num);                         // "12"

基础类型

在TypeScript中，内置的数据类型也被称为原始数据类型，主要有：

  • number 双精度64位浮点数，注意 TypeScript和JavaScript没有整数
  • string 存储UTF-16的字符串序列， 可以使用单引号(‘’)或双引号(“”)来包含字符串，使用反引号(`)来格式化文本或内嵌表达式等
  • boolean 布尔类型， 使用true和false进行判定
  • void 表示不返回任意类型的函数返回类型
  • undefined 表示一个没有设置数据的变量
  • null 表示一个空对象的引用
let data: number = null;// number
let value: number = 0.1;
let decLiteral: number = 6;    				// 十进制
let binaryLiteral: number = 0b1010; 	// 二进制
let octalLiteral: number = 0o744;    	// 八进制
let hexLiteral: number = 0xf00d;    	// 十六进制// string 
let name: string = "TypeScript";
let years: number = 5;
let words: string = `您好，今年是${name}发布${years + 1}周年`;// boolean
let flag: boolean = true;// void 
function Debug(index: number): void {}

在编写程序的时候，可以通过console.log输出日志，使用工具推荐: PlayGround

let dataList = [1, 2, 3];
console.log(dataList);										// [1, 2, 3] let value = 10;
console.log("value: ", value);						// "value: ",  10 let name: string = "TypeScript";
let years: number = 5;
let words: string = `您好，今年是${name}发布${years + 1}周年`;
console.log("Content:" + words);					// "Content:您好，今年是TypeScript发布6周年"

console.log的不仅支持基础数据，也支持数组，Map相关； 不需要考虑是否存在Lua中的dump相关

// 数组
const numList = [1, 2, 3];
console.log(numList); 
// 输出： [1, 2, 3] // Map列表
let myMap = new Map([["key1", "value1"],["key2", "value2"]
]); 
console.log(myMap);
// 输出： Map (2) {"key1" => "value1", "key2" => "value2"} // String对象
console.log(String);
// 输出： function String() { [native code] }

其他类型

  • const常量相关
const value = 10;
value = 11;						// Error:  Assignment to constant variable
  • any 表示类型不明确，可以通过赋值改变为不同的类型：
// any类型，表示类型不明确； 可以赋值为不同的类型
let data: any = null;
data = "hello";
data = false;
  • 数组相关， 类型后面有个[]
// 有类型的数组
let numList: number[] = [1, 2];
let strList: string[] = ["heloo", "typeScript"];
// 任意类型数据
let dataList: any[] = [1, false, "hello", 4];
// 泛型数组
let dataList: Array<number> = [1,2,3];
  • enum枚举相关
enum kColor {RED,GREEN,BLUE,
}
let color: kColor = kColor.RED;
  • never类型， 相当于其他类型包含null和undefined的子类型，代表不会出现的值
let x: never;// 运行错误，数字类型不能转为 never 类型
// Type 'number' is not assignable to type 'never'
x = 123;// 运行正确，never 类型可以赋值给 never类型
x = (()=>{ throw new Error('exception')})();
  • 注意，可以通过|支持不同的数据类型，比如：
let value: number | string = null;
let value: string | string[];

类型判定typeof

使用typeof可以对数据进行类型判定显示，比如：

console.log(typeof(false));								// "boolean" 
console.log(typeof(1.0));									// "number" 
console.log(typeof(0XFFFF));							// "number" 
console.log(typeof("script"));						// "string"

其他一些有意思的特性：

// "object"
console.log(typeof(null));
console.log(typeof {});
console.log(typeof []); 									// "undefined"
console.log(typeof(undefined));				// "undefined"				
console.log(typeof(any));							// "undefined"
let data;
console.log(typeof(data));						// "undefined"// 函数相关
function getValue(): number {return 0;
}
console.log(typeof(function));					// "function" 
console.log(typeof(getValue));          // "function" 
console.log(typeof(getValue()));        // "number"// NaN相关
console.log(typeof(NaN));									// "number" 
console.log(typeof(Number.NaN));					// "number"

我们需要注意下：

  • NaN的类型虽然是number数字类型， 但它真正代表的 非数字数特殊值，用于表示非法的数值  如果两个NaN比较，他们并不相等, 数学运算中较为常见：
console.log(0/0);						// NaN 
console.log(Math.sqrt(-1)); // NaN
console.log(Math.log(-1)); 	// NaN
  • null和undefined 前者表示一个空的引用， 后者表示一个没有设置数据的变量，因此他们的类型并不相同
console.log(typeof(null));				// "object"
console.log(typeof(undefined));		// "undefined"
  • object 它表示一个非原始类型(数字，字符串，布尔)的值，主要作用于数组，对象和函数等，它是一种泛指的类型，可以包括任意类型值。
const numObj = new Number(10);
const strObj = new String("");
console.log(typeof(numObj));        // "object" 
console.log(typeof(strObj));        // "object"

在TypeScript的语言中，如果我们单纯的使用value === null或者!value 这种方式来判定数据的合法性，可能会存在不严谨性。

考虑到数字0、空字符串、false、null、undefined、NaN的情况存在， 我们可以使用Boolean()函数将值转换为布尔值, 然后再进行判定。

const value_1 = Boolean(0);
const value_2 = Boolean("");
const value_3 = Boolean(null);
const value_4 = Boolean(undefined);
const value_5 = Boolean(NaN);
// 输出均为false 
console.log(value_1, value_2, value_3, value_4, value_5);

boxing和unboxing

前面说到了一个Boolean类型的转换，既然支持Boolean类型对象的转换，当然也提供了Number和String类型的转换。

他们支持数字或字符串调用相关的方法接口，以实现一些复杂的逻辑处理。

const numObj = new Number(10);
const strObj = new String("");

但在熟悉JavaScript/typeScript后，会发现类似这样的一个情况：

const str = "hello TypeScript";
console.log(str.toUpperCase());			// "HELLO TYPESCRIPT" const strObj = new String(str);
console.log(strObj.toUpperCase());	// "HELLO TYPESCRIPT"

string基础数据和String对象可以调用相同的函数来实现逻辑， 这个原因在于：

JavaScript/TypeScript允许将数字，字符串等值类型转换为对应的封装对象， 这个转换的过程被称为boxing装箱， 而对应的将一个引用对象类型转换为值类型则被称为unboxing拆箱。

在这里简要的说明下，有助于对后面的文章理解。


关键字

最后说下关键字相关，算是对typeScript有个大概的了解：

关键字描述
break/continue跳出循环， break用于跳出当前循环， continue用于跳出当前循环的剩余代码
as类型断言，用于将一个实体断言为特定的类型
try/catch/finally用于捕获和处理异常
switch/case/default条件语句相关，可使用break进行截止
if/else if / else条件语句相关
var/let声明变量的关键字
throw
number/ string/enum基础数据类型： 浮点数，字符串，枚举
true/falseboolean类型值
void/null/any/return/function–
static/const静态和常量，静态类成员，可以直接访问； 常量必须在声明后初始化
for/do while循环语句
get/set用于对对象属性变量的获取或设置
module/namespacemodule用于定义一个模块，用于组织和封装相关代码， 自TypeScript 2.7版本起，逐渐被namespace代替
type/typeoftype用来做类型别名， typeof用来获取数据类型
instanceofJavaScript的运算符，用于检查对象是否是指定类的实例
public/private可用于声明类方法类型是公有还是私有
exportexport用于将模块中的变量，函数，类等导出，使其可以被其他模块使用
import用于导入变量，函数，类相关，与export配对使用
super用于派生类调用基类的构造函数，方法和属性相关
this在类中使用，用于引用当前对象
extends用于类继承相关
implements/interfaceinterface用于定义一个接口，通过implements来实现接口
yield用于定义**生成器(特殊函数，可以在执行过程中暂停和恢复)**函数的暂停点，可以将值返回给调用者

一些简单的实例：

  • var/let 声明变量的关键字
/*
var是ES5及之前的JavaScript的关键字，特点：
* 函数作用域，声明的变量在整个函数体内， 而不仅是在块作用域内
* 变量会提升，声明的变量会提升到函数的顶部， 即可在声明之前使用
* 允许重复声明
*/
function example() {var x = 10;if (true) {var x = 20; // 在同一函数作用域内重复声明变量xconsole.log(x); // 输出：20}console.log(x); // 输出：20
}
example();/*
let是ES6及之后的JavaScript和TypeScript引入的关键子，特点：
* 块作用域， 比如if语句，循环语句，并不是整个函数体内
* 不存在变量提升，必须声明之后才能使用
* 不允许崇明声明，否则会报错
*/
function example2() {let y = 10;if (true) {let y = 20; // 在块级作用域内声明变量yconsole.log(y); // 输出：20}console.log(y); // 输出：10
}
example2();
  • as 用于将一个实体断言为特定的类型
let someValue: any = "hello";
let strLength: number = (someValue as string).length;
console.log(strLength);			// 5
  • try/catch 捕获异常
try {// 可能引发异常的代码throw new Error("Something went wrong!");
} catch (error) {// 异常处理逻辑console.log(error.message);
} finally {// 总是执行的代码块
}
// 输出：Something went wrong!
  • 条件语句相关
// switch/case相关
let fruit = "apple";
switch (fruit) {case "apple":console.log("It's an apple.");break;case "banana":console.log("It's a banana.");break;default:console.log("It's something else.");
}// if/ else if / else相关
let num = 10;
if (num > 0) {console.log("Positive number");
} else if (num < 0) {console.log("Negative number");
} else {console.log("Zero");
}
// 输出：Positive number
  • instanceof 用于检查实例对象是否是特定类的实例
class Animal {// class implementation
}class Dog extends Animal {//
}const animal = new Animal;
const myDog = new Dog();
console.log(animal instanceof Animal);		// true
console.log(myDog instanceof Animal); 		// true
  • export/import
// 模块导出
export const myVariable = 123;
export function myFunction() {// 函数实现
}
export class MyClass {// 类实现
}// 模块导入
import { myVariable, myFunction, MyClass } from './myModule';
  • super 用于子类调用基类的构造函数和方法等
class Parent {private _value: number = 0;constructor(value: number) {// this用作类中对象的引用this._value = value;console.log("Parent constructor:", this._value);}parentMethod() {console.log("Parent parentMethod");}
}// extends 继承
class Child extends Parent {constructor() {super(10); // 调用父类构造函数}childMethod() {super.parentMethod(); // 调用父类方法}
}const child = new Child();
child.childMethod();/*
Parent constructor: 10
Parent parentMethod
*/
  • get/set用于对对象属性变量的获取或设置
class MyClass {private _myProperty: string;get myProperty(): string {return this._myProperty;}set myProperty(value: string) {this._myProperty = value;}
}const myObj = new MyClass();
// 设置对象属性值
myObj.myProperty = "Hello";
// 获取对象属性值
console.log(myObj.myProperty); // 输出 "Hello"
  • interface/implements 定义并实现接口
// 定义接口
interface MyInterface {myMethod(): void;
}// 实现接口
class MyClass implements MyInterface {myMethod() {console.log("Implementing MyInterface");}
}const myObj = new MyClass();
myObj.myMethod(); // 输出 "Implementing MyInterface"
  • yield 生成器函数暂停
function* myGenerator() {yield 1;yield 2;yield 3;
}const generator = myGenerator();
console.log(generator.next().value); // 输出 1
console.log(generator.next().value); // 输出 2
console.log(generator.next().value); // 输出 3

编写可能有误，请您不吝指导。


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

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

相关文章

面试经典150题——罗马数字转整数

面试经典150题——罗马数字转整数

罗马数字包含以下七种字符: I&#xff0c; V&#xff0c; X&#xff0c; L&#xff0c;C&#xff0c;D 和 M。 字符 数值 I 1 V 5 X 10 L 50 C 100 D 500 M 1000 例如&#x…
阅读更多...
docker 学习-- 01 基础知识

docker 学习-- 01 基础知识

docker 学习-- 01 基础知识 文章目录 docker 学习-- 01 基础知识1.前言1.1 docker 是什么1.2 docker优点1.2.1 统一开发和生产环境:1.2.2 高性能:1.2.3 更轻松的维护和拓展&#xff1a;1.2.4 更轻松的迁移&#xff1a; 1.3 docker缺点1.3.1 运行环境受限1.3.2 文件管理和网络端…
阅读更多...
item_sku-获取sku详细信息

item_sku-获取sku详细信息

一、接口参数说明&#xff1a; item_sku-获取sku详细信息&#xff0c;点击更多API调试&#xff0c;请移步注册API账号点击获取测试key和secret 公共参数 请求地址: https://api-gw.onebound.cn/taobao/item_sku 名称类型必须描述keyString是调用key&#xff08;点击获取测试…
阅读更多...
安全中间件的设计思路和简单实践

安全中间件的设计思路和简单实践

rasp 的侵入式特性和拦截特性导致开发和运维普通不太愿意配合&#xff0c;当生产环境出现问题时往往第一时间先把责任推给 rasp&#xff0c;逐渐的安全部门普遍只能把 rasp 设置为告警模式&#xff0c;而且越是大的集群拦截开的就越少&#xff0c;所以字节的 elkeid 和某外卖大…
阅读更多...
P13-CNN学习1.3-ResNet(神之一手~)

P13-CNN学习1.3-ResNet(神之一手~)

论文地址:CVPR 2016 Open Access Repository https://arxiv.org/pdf/1512.03385.pdf Abstract 翻译 深层的神经网络越来越难以训练。我们提供了一个残差学习框架用来训练那些非常深的神经网络。我们重新定义了网络的学习方式&#xff0c;让网络可以直接学习输入信息与输出信息…
阅读更多...
Python-OpenCV中的图像处理-图像直方图

Python-OpenCV中的图像处理-图像直方图

Python-OpenCV中的图像处理-图像直方图 图像直方图统计直方图绘制直方图Matplotlib绘制灰度直方图Matplotlib绘制RGB直方图 使用掩膜统计直方图直方图均衡化Numpy图像直方图均衡化OpenCV中的直方图均衡化CLAHE 有限对比适应性直方图均衡化 2D直方图OpenCV中的2D直方图Numpy中2D…
阅读更多...
代码随想录算法训练营20期|第七天|哈希表part02|454.四数相加II ● 383. 赎金信 ● 15. 三数之和 ● 18. 四数之和 ● 总结

代码随想录算法训练营20期|第七天|哈希表part02|454.四数相加II ● 383. 赎金信 ● 15. 三数之和 ● 18. 四数之和 ● 总结

454.四数相加II 比较巧思的解法&#xff0c;先把nums1 和nums2的数两两相加&#xff0c;并存储sum和次数 再在nums3和nums4里找对应和sum和为0的数值i,j Time: N^2 Space:N^2, 最坏情况下A和B的值各不相同&#xff0c;相加产生的数字个数为 n^2 class Solution {public int fo…
阅读更多...
Spring AOP实践：如何通过aop记录日志？

Spring AOP实践：如何通过aop记录日志？

目录 一、依赖 二、自定义注解 三、切面 一、依赖 以SpringBoot工程为例&#xff0c;导入aop的依赖。 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-aop</artifactId> </dependency> 二…
阅读更多...
为什么要自动化Web测试？

为什么要自动化Web测试？

Web自动化是更快地实现所需结果的较佳方式。自动化测试在市场上引起了巨大的轰动。此软件测试过程可以让您使用正确的自动化测试工具和技术集自动执行测试过程。我们执行它是为了检查软件应用程序是否具有完全按照我们希望它执行的方式执行的勇气。 比以往更快地获得反馈 自动化…
阅读更多...
基于Promise.resolve实现Koa请求队列中间件

基于Promise.resolve实现Koa请求队列中间件

本文作者为360奇舞团前端工程师 前言 最近在做一个 AIGC 项目&#xff0c;后端基于 Koa2 实现。其中有一个需求就是调用兄弟业务线服务端 AIGC 能力生成图片。但由于目前兄弟业务线的 AIGC 项目也是处于测试阶段&#xff0c;能够提供的服务器资源有限&#xff0c;当并发请求资源…
阅读更多...
kafka和rabbitmq之间的区别以及适用场景

kafka和rabbitmq之间的区别以及适用场景

Kafka 和 RabbitMQ 都是流行的消息传递系统&#xff0c;用于实现分布式系统中的消息传递、事件处理和数据流。它们在设计和适用场景上有一些不同&#xff0c;下面详细介绍它们之间的区别和适用场景。 Kafka 特点和优势&#xff1a; 高吞吐量&#xff1a; Kafka 的设计目标是实…
阅读更多...
【Java】数据交换 Json 和 异步请求 Ajax

【Java】数据交换 Json 和 异步请求 Ajax

&#x1f384;欢迎来到边境矢梦的csdn博文&#xff0c;本文主要讲解Java 中 数据交换和异步请求 Json&Ajax 的相关知识&#x1f384; &#x1f308;我是边境矢梦&#xff0c;一个正在为秋招和算法竞赛做准备的学生&#x1f308; &#x1f386;喜欢的朋友可以关注一下&#…
阅读更多...
go mod 添加私有库GOPRIVATE

go mod 添加私有库GOPRIVATE

私有地址 形式仓库域名/组织名形式仓库域名形式*仓库域名 示例私有地址&#xff1a; gitee.com/takujo_admin 或者igitlab.com 多个私有地址,分割&#xff0c;示例&#xff1a; gitee.com,igitlab.com 修改env go env -w GOPRIVATE"私有地址" go env -w …
阅读更多...
conda创建虚拟环境

conda创建虚拟环境

创建虚拟环境是在计算机上设置一个独立的空间&#xff0c;用于安装和运行特定版本的软件和依赖项&#xff0c;以避免与系统其他部分的冲突。 创建虚拟环境&#xff1a; conda create --name myenv python3.8 这将创建一个名为myenv的虚拟环境&#xff0c;并安装Python 3.8版本。…
阅读更多...
pwm接喇叭搞整点报时[keyestudio的8002模块]

pwm接喇叭搞整点报时[keyestudio的8002模块]

虽然现在查看时间很方便&#xff0c;但是其实好像我的时间观念却越来越差。于是决定搞一个整点报时&#xff0c;时常提醒自己时光飞逝&#xff0c;不要老是瞎墨迹。 这篇主要讲一下拼装方式和配置&#xff0c;就差不多了。不涉及什么代码。3针的元器件&#xff0c;去掉正负接线…
阅读更多...
day3 STM32 GPIO口介绍

day3 STM32 GPIO口介绍

GPIO接口简介 通用输入输出接口GPIO是嵌入式系统、单片机开发过程最常用的接口&#xff0c;用户可以通过编程灵活的对接口进行控制&#xff0c;实现对电路板上LED、数码管、按键等常用设备控制驱动&#xff0c;也可以作为串口的数据收发管脚&#xff0c;或AD的接口等复用功能使…
阅读更多...
网络安全--iptables（待更新，累了）

网络安全--iptables（待更新，累了）

总结&#xff1a; iptables 的关键概念和功能&#xff1a; 规则&#xff08;Rules&#xff09;&#xff1a; iptables 使用规则来定义特定的操作&#xff0c;例如允许或拒绝特定类型的网络流量。每条规则都由条件和操作组成。条件可以是源 IP 地址、目标 IP 地址、端口号等&a…
阅读更多...
thinkphp:对数据库减少增加某个字段的值（dec、inc的用法）

thinkphp:对数据库减少增加某个字段的值（dec、inc的用法）

例子&#xff1a;当字段po_num的值等于数组list_info中的po_num的值时修改数据库表po_rcv_receipt_line中某些信息&#xff1a; 1、数据库delivery_quantity字段的值 数据库中delivery_quantity的值变量$list_info[write_quantity] ->inc(delivery_quantity, $list_info[…
阅读更多...
【设计模式——学习笔记】23种设计模式——状态模式State（原理讲解+应用场景介绍+案例介绍+Java代码实现）

【设计模式——学习笔记】23种设计模式——状态模式State（原理讲解+应用场景介绍+案例介绍+Java代码实现）

文章目录 案例引入介绍基本介绍登场角色应用场景 案例实现案例一类图实现 案例二&#xff1a;借贷平台源码剖析传统方式实现分析状态修改流程类图实现 案例三&#xff1a;金库警报系统系统的运行逻辑伪代码传统实现方式使用状态模式 类图实现分析问题问题一问题二 总结文章说明…
阅读更多...
国内芯片厂商创新突破，助力国产替代持续加速

国内芯片厂商创新突破，助力国产替代持续加速

近日&#xff0c;中商产业研究院发布最新研究报告显示&#xff0c;今年1~5月份中国进口集成电路为1865亿件&#xff0c;同比下降19.6%&#xff0c;同比去年5个月累计少进口了455亿颗&#xff0c;平均每天少进口3亿颗。与此同时&#xff0c;英特尔、AMD、美光、三星、SK海力士等…
阅读更多...
最新文章

Copyright @ 2022~2023