typeScript初步学习总结

2022-04-26 18:34:14 阅读：167 来源： 互联网

标签：总结 typeScript console string number 初步 let 类型 log

javaScript是弱类型语言，在运行时检测，运行时可能会因为一些类型导致问题报错；

typeScript是强类型语言，在编译时检测，在编译时就可以检测出一些错误；

typeScript是javaScript的超集，在原有的基础上引用typeScript不会影响原有的使用。

let foo = 1;
foo.split(' ');

这段代码在javascript中运行中会报错，在typescript在编译阶段就会提醒。完整的typescript代码如下：

let foo: number = 1;
foo.split(' ');

typeScript提供一些基础类型判断，包含javaScript的一些基础数据类型

let isDone: boolean = false;
let decLiteral: number = 6;
let name: string = "bob";
let list: number[] = [1, 2, 3]; //都是number类型的数组
let list: Array<number> = [1, 2, 3]; // 使用数组泛型 （类数组：类数组需要用接口定义的方式）
let u: undefined = undefined; // undefined
let n: null = null; // null
let notSure: any = 4; // any 没有指定类型

// 元组类型
// Declare a tuple type
let x: [string, number]; // 第一个参数是string类型第二个参数number
// Initialize it 
x = ['hello', 10]; // OK
// Initialize it incorrectly
x = [10, 'hello']; // Error

// 枚举类型
enum Color {Red, Green, Blue}
let c: Color = Color.Green;

// 空值
// JavaScript 没有空值（Void）的概念，在 TypeScript 中，可以用 void 表示没有任何返回值的函数
function alertName(): void {
    alert('My name is Tom');
}
// 与void的区别是：null,undefined是所有类型的子类型
// 这样也不会报错
let u: undefined;
let num: number = u;
let u: void;
let num: number = u;

// Type 'void' is not assignable to type 'number'.

类型推断：如果没有明确的指定类型，那么 TypeScript 会依照类型推论（Type Inference）的规则推断出一个类型。

let myFavoriteNumber = 'seven';
myFavoriteNumber = 7;

// index.ts(2,1): error TS2322: Type 'number' is not assignable to type 'string'.

联合类型：可以对一个变量进行多种种类的指定类型

let myFavoriteNumber: string | number;
myFavoriteNumber = 'seven';
myFavoriteNumber = 7;

对象类型（接口）：在 TypeScript 中，我们使用接口（Interfaces）来定义对象的类型

interface Person {
    name: string;
    age: number;
}

let tom: Person = {
    name: 'Tom',
    age: 25
};
// 赋值的时候，变量的形状必须和接口的形状保持一致
// 多余的属性和少了属性是不允许的，提示错误

interface Person {
    name: string;
    age?: number; // 可选属性
    [propName: string]: any;  // 允许有任意的属性
    readonly id: number; // 只读属性
}

函数声明：对于入参以及返回值的类型进行判断

function sum(x: number, y: number): number {
    return x + y;
} // 不允许输入多余或少于的参数

利用接口形式返回函数类型判断，一般可用于对于函数返回类型的判断

定义一些接口形式，对象判断，实现类的继承接口

interface LabelledValue {
  label: string;
}

function printLabel(labelledObj: LabelledValue) {
  console.log(labelledObj.label);
}

let myObj = {size: 10, label: "Size 10 Object"};
printLabel(myObj);

interface SearchFunc {
    (source: string, subString: string): boolean;
}

let mySearch: SearchFunc;
mySearch = function(source: string, subString: string) {
    return source.search(subString) !== -1;
}

元组类型：数组合并了同种种类的数组形式，元组合并了不同种类的数组形式

let tom: [string, number] = ['Tom', 25];

枚举类型：枚举（Enum）类型用于取值被限定在一定范围内的场景

enum Days {Sun, Mon, Tue, Wed, Thu, Fri, Sat};

console.log(Days["Sun"] === 0); // true
console.log(Days["Mon"] === 1); // true
console.log(Days["Tue"] === 2); // true
console.log(Days["Sat"] === 6); // true

console.log(Days[0] === "Sun"); // true
console.log(Days[1] === "Mon"); // true
console.log(Days[2] === "Tue"); // true
console.log(Days[6] === "Sat"); // true

泛型：对于指定类型的确定<T>可以是任何字母eg:<U>,一般对于泛指类型的确定

function createArray<T>(length: number, value: T): Array<T> {
    let result: T[] = [];
    for (let i = 0; i < length; i++) {
        result[i] = value;
    }
    return result;
}

createArray<string>(3, 'x'); // ['x', 'x', 'x']

多个类型的泛型表示：

function swap<T, U>(tuple: [T, U]): [U, T] {
    return [tuple[1], tuple[0]];
}

swap([7, 'seven']); // ['seven', 7]

使用接口与泛型的表示

interface Lengthwise {
    length: number;
}

function loggingIdentity<T extends Lengthwise>(arg: T): T {
    console.log(arg.length);
    return arg;
}

loggingIdentity(7); // 报错

标签：总结,typeScript,console,string,number,初步,let,类型,log
来源： https://www.cnblogs.com/best-mll/p/16195959.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

typeScript初步学习总结