【面试】typescript

news/2024/4/17 16:26:48

目录

为什么用TypeScript?

TS和JS的区别

控制类成员可见性的访问关键字?

public

protected),该类及其子类都可以访问它们。 但是该类的实例无法访问。

私有(private),只有类的成员可以访问它们。

接口interface与类型别名type

对象

函数

typeof

泛型T

extends

interface extends interface/type

type & interface/type(与联合类型相对,又名交叉类型)

interface(数据结构)

同名接口自动合并

type(类型关系)

类型别名

联合类型:| 或

元祖类型

工具/高级类型Utility Types

Partial :T全部属性变为可选项 ?

Required与Partial相反

Readonly

Pick:T中选K,>

Omit和Pick相反

Extract:T U交集,>

Extract和Exclude相反

判断类型:is


TS4 入门笔记

1.2W字 | 了不起的 TypeScript 入门教程 - 掘金

typescript史上最强学习入门文章(2w字) - 掘金

2022年了,我才开始学 typescript ,晚吗?(7.5k字总结) - 掘金

为什么用TypeScript?

  • 强制类型,防止报错
  • 自动类型推断,保证变量的类型稳定
// let a: string  ->  类型推断
let a = 'hello'
a = 123;   // error
  • 强大的类型系统,包括泛型
  • 支持静态类型。(主要改进)更有利于构建大型应用

代码可维护性=强类型语言(低级错误)+个人素质和团队规范约束(高级错误)

TS和JS的区别

控制类成员可见性的访问关键字?

public

protected),该类及其子类都可以访问它们。 但是该类的实例无法访问。

私有(private),只有类的成员可以访问它们。

TS与java不同,TS默认隐式公共的,

TS符合 JS 的便利性,java默认private,符合安全性

接口interface与类型别名type

对象

interface User {name: string;age: number;
}
等价于
type User = {name: string;age: number;
};const user: User = {name: "John",age: 25
};

函数

interface SetUser {(name: string, age: number): void;
}
等价于
type SetUser = (name: string, age: number) => void;const setUser: SetUser = (name, age) => {// 实际的函数实现console.log(`Setting user: ${name}, ${age}`);
};

typeof

let x = "John";const person: Name<typeof x> = {name: x,
};let div = document.createElement('div');
type B = typeof div

泛型T

interface Name<T> {name: T;
}// 使用 string 类型
const personWithString: Name<string> = {name: "John",
};// 使用 number 类型
const personWithNumber: Name<number> = {name: 25,
};// 定义 Callback 类型
type Callback<T> = (data: T) => void;// Callback 的使用
const stringCallback: Callback<string> = (data) => {console.log(`收到回调数据: ${data}`);
};// 定义 Pair 类型
type Pair<T> = [T, T];!const numberPair: Pair<number> = [42, 23];

extends

interface extends interface/type
interface Name { name: string; }
等价于
type Name = { name: string; } interface User extends Name { age: number; }
type & interface/type(与联合类型相对,又名交叉类型)
interface Name { name: string; } 
等价于
type Name = { name: string; } type User = Name & { age: number };

interface(数据结构)

同名接口自动合并

type(类型关系)

类型别名
type Str = string
type NameLookup = Dictionary<string, Person>; 
联合类型:| 或
元祖类型

数组类型一般是

但有时需要存储不同类型的值

所以可以通过ts特有的元组限制数组元素的个数和类型

工具/高级类型Utility Types

Partial<T> :T全部属性变为可选项 ?

Required与Partial相反

Readonly

Pick<T, K>:T中选K

Omit和Pick相反

type A = {username?: stringage?: numberreadonly gender: string
}type B = Readonly<A>
// Partial(可选)
type C = Partial<A>type D = Pick<A, 'username'|'age'>
//Record(改变类型)
//keyof 操作符可以用来一个对象中的所有 key 值:
type E = Record<keyof A, string>//Required(将可选变为必选)
type F = Required<A>

Extract<T, U>:T U交集

Extract和Exclude相反

判断类型:is

// !!! 使用 is 来确认参数 s 是一个 string 类型
function isString(s): s is string {return typeof s === 'string';
}

「2022」TypeScript最新高频面试题指南 - 掘金


https://www.xjx100.cn/news/3118834.html

相关文章

鸿蒙4.0开发笔记之ArkTS装饰器语法基础@Builder组件内自定义构建函数与@Styles自定义组件重用样式(十)

文章目录 一、Builder自定义构建函数1、什么是自定义构建函数2、组件内定义构建函数3、组件外定义构建函数4、Builder装饰器练习 二、Styles重用样式函数1、重用样式的作用2、组件内定义Styles3、组件外定义4、Styles装饰器练习5、注意要点 一、Builder自定义构建函数 1、什么…

【学习笔记】GAN前沿主题

最小-最大(Min-Max)GAN 非饱和(Non-Saturating)GAN 沃瑟斯坦(Wasserstein)GAN,即WGAN 所有的生成模型最终来源于最大似然(maximum likelihood),至少隐式地是这样的。 GAN有两个相互竞争的损失函数,这样的系统没有单一的解析解。 最大似然近似容易过度泛化。 用于统计…

Android帝国之进程杀手--lmkd

本文概要 这是Android系统启动的第三篇文章&#xff0c;本文以自述的方式来讲解lmkd进程&#xff0c;通过本文您将了解到lmkd进程在安卓系统中存在的意义&#xff0c;以及它是如何杀进程的。&#xff08;文中的代码是基于android13&#xff09; 我是谁 init&#xff1a;“大…

【Node.js】笔记整理 2 - 常用模块

写在最前&#xff1a;跟着视频学习只是为了在新手期快速入门。想要学习全面、进阶的知识&#xff0c;需要格外注重实战和官方技术文档&#xff0c;文档建议作为手册使用 系列文章 【Node.js】笔记整理 1 - 基础知识【Node.js】笔记整理 2 - 常用模块【Node.js】笔记整理 3 - n…

[Ubuntu 18.04] RK3399搭建NFS服务实现共享目录

NFS(Network File System)是一种分布式文件系统协议,允许远程计算机通过网络访问存储在另一台计算机上的文件。它使得多台计算机可以共享文件,并且可以在不同计算机之间实现文件的透明访问和共享。 以下是 NFS 服务器的一些特点和介绍: 文件共享:NFS 服务器允许将存储在…

pip安装python包(pytorch)时遇到超时现象的通用解决方案

最近在使用服务器配置pytorch环境的时候&#xff0c;遇到了极为恼火的事情&#xff0c;使用pytorch官方的命令来下载GPU版本的pytorch总会是不是下载到一半就会崩溃&#xff0c;然而pip下载并不会断点续传&#xff08;什么时候能出这个功能啊喂&#xff01;&#xff09;。每次下…

Spring-AOP与声明式事务

为什么要用AOP ①现有代码缺陷 针对带日志功能的实现类&#xff0c;我们发现有如下缺陷&#xff1a; 对核心业务功能有干扰&#xff0c;导致程序员在开发核心业务功能时分散了精力 附加功能分散在各个业务功能方法中&#xff0c;不利于统一维护 ②解决思路 解决这两个问题&…

【error:Custom elements in iteration require ‘v-bind:key‘ directives】元素绑定:key

在vue3中使用v-for操作的时候&#xff0c;报error Custom elements in iteration require v-bind:key directives 当我想自定义绘制echarts图的代码&#xff1a; <el-row><div v-if"data.chartDataList.length > 0"><el-col :span"12&quo…