精华内容
下载资源
问答
  • TS定义对象数组

    千次阅读 2021-03-07 05:08:23
    定义兼容性对象数组T 表示传入的类型,可以为number、string、boolean等传入什么label就是什么类型interface labelValue {label: T;value: number;}// 传入number类型let obj: labelValue;export function ...

    定义兼容性对象数组T 表示传入的类型,可以为number、string、boolean等

    传入什么label就是什么类型

    interface labelValue {

    label: T;

    value: number;

    }

    // 传入number类型

    let obj: labelValue;

    export function formatYear (): labelValue[] {

    let date = new Date().getFullYear();

    let arr: labelValue[];

    for (let i = 0; i < date + 10; i++) {

    obj = {

    label: i,

    value: i

    }

    arr.push(obj)

    }

    return arr;

    }

    // 传入string类型

    let obj1: labelValue;

    export function formatHours (): labelValue[] {

    let arr: labelValue[];

    for (let i = 0; i <= 24 + 10; i++) {

    obj1 = {

    label: i + 'h',

    value: i

    }

    arr.push(obj1)

    }

    return arr;

    }

    定义对象型数组

    <
    展开全文
  • TS的对象类型、数组类型、函数类型

    千次阅读 2020-12-23 09:20:06
    对象类型基础使用在 TypeScript 中,我们使用接口(Interfaces)来定义对象的类型。简单例子:interface Person {name: string;age: number;}let tom: Person = {name: 'Tom',age: 25};复制代码上面的例子中,我们定义...

    对象类型

    基础使用

    在 TypeScript 中,我们使用接口(Interfaces)来定义对象的类型。

    简单例子:

    interface Person {

    name: string;

    age: number;

    }

    let tom: Person = {

    name: 'Tom',

    age: 25

    };

    复制代码

    上面的例子中,我们定义了一个接口 Person,接着定义了一个变量 tom,它的类型是 Person。这样,我们就约束了 tom 的形状必须和接口 Person 一致。

    定义的变量比接口少/多了属性是不允许的:

    interface Person {

    name: string;

    age: number;

    }

    let tom: Person = {

    name: 'Tom'

    };

    let tom: Person = {

    name: 'Tom',

    age: 25,

    gender: 'male'

    };

    //都会报错哦

    复制代码可选属性

    但是有些时候,我们并不希望对象的形状完全遵守接口的定义(我们希望少/多些属性):

    所以我们会用到可选属性

    interface Person {

    name: string;

    age?: number;

    }

    let tom: Person = {

    name: 'Tom'

    };

    // 特征是打了个问号,意味着并不是必须的,而是可选的属性

    //但是这个时候可以少属性,却不能多属性

    复制代码任意属性

    我们会使用任意属性来实现可以少属性/多属性

    interface Person {

    name: string;

    age?: number;

    [propName: string]: any;

    }

    let tom: Person = {

    name: 'Tom',

    gender: 'male'

    };

    复制代码

    需要注意的是,一旦定义了任意属性,那么确定属性和可选属性的类型都必须是它的类型的子集:

    interface Person {

    name: string;

    age?: number;

    [propName: string]: string; // 任意属性只包含了string类型

    }

    let tom: Person = {

    name: 'Tom',

    age: 25, // age的nubmer属性不在任意属性string内,会报错

    gender: 'male'

    };

    复制代码只读属性

    有时候我们希望对象中的一些字段只能在创建的时候被赋值,那么可以用 readonly 定义只读属性:

    interface Person {

    readonly id: number;

    name: string;

    age?: number;

    [propName: string]: any;

    }

    let tom: Person = {

    id: 89757,

    name: 'Tom',

    gender: 'male'

    };

    tom.id = 9527;// 该属性只读,赋值操作会报错

    复制代码数组类型

    数组类型会对其的内容进行约束

    「类型 + 方括号」表示法

    let fibonacci: number[] = [1, 1, 2, 3, 5];

    复制代码数组泛型

    let fibonacci: Array = [1, 1, 2, 3, 5];

    复制代码用接口(interface)表示数组

    interface NumberArray {

    [index: number]: number;

    }

    let fibonacci: NumberArray = [1, 1, 2, 3, 5];

    复制代码类数组不能使用以上3钟形式去表示

    function sum() {

    let args: {

    [index: number]: number;

    length: number;

    callee: Function;

    } = arguments;

    }

    复制代码函数类型

    函数声明

    函数表达式

    在 JavaScript 中,有两种常见的定义函数的方式如上。

    一个函数有输入和输出,所以基本上就是把约束覆盖到函数的输入与输出上。

    1. 传统的定义函数的输入与输出

    // 函数声明的写法

    function sum(x: number, y: number): number {

    return x + y;

    }

    // 多参数 | 少参数 是不被允许的哦

    // 函数表达式的写法,等式左边的可以被省略而完全又右边类型判断出来。

    let mySum: (x: number, y: number) => number = function (x: number, y: number): number {

    return x + y;

    };

    复制代码

    2. 用接口定义函数的输入与输出

    interface SearchFunc {

    (source: string, subString: string): boolean;

    }

    let mySearch: SearchFunc = function(source: string, subString: string) {

    return source.search(subString) !== -1;

    }

    复制代码

    - 函数的参数详情

    前面我们提到,输入多/少的参数式不被允许的,这在接口定义中也存在着这个限制,同样的,我们也可以使用?来定义可选参数

    !!!可选参数必须接在必需参数后面,否则会报错。如下是正确写法

    function buildName(firstName: string, lastName?: string) {

    if (lastName) {

    return firstName + ' ' + lastName;

    } else {

    return firstName;

    }

    }

    let tomcat = buildName('Tom', 'Cat');

    let tom = buildName('Tom');

    复制代码

    参数也可以拥有默认值, TypeScript 会将添加了默认值的参数识别为可选参数,此时就不受「可选参数必须接在必需参数后面」的限制了:

    function buildName(firstName: string, lastName: string = 'Cat') {

    return firstName + ' ' + lastName;

    }

    let tomcat = buildName('Tom', 'Cat');

    let tom = buildName('Tom');

    复制代码

    - 函数的重载

    这个挺……无语的,感觉很没必要

    function reverse(x: number | string): number | string {

    if (typeof x === 'number') {

    return Number(x.toString().split('').reverse().join(''));

    } else if (typeof x === 'string') {

    return x.split('').reverse().join('');

    }

    }

    复制代码本教程完全依赖于 : https://ts.xcatliu.com/introduction/index.html

    复制代码

    展开全文
  • const arrA = [1, 2, 4] // 这里利用ts 的类型推断,arrA的数组类型定义为: const arrA: number[] = [1, 2, 4] 数组汇总存在单个或者多个同类型的数组的类型定义还有很多,比如: const arrC: boolean[] = [true, ...

    上面已经做过数组内存在单个或多个类型一样的数组的类型定义,再复习下

    const arrA = [1, 2, 4] // 这里利用ts 的类型推断,arrA的数组类型定义为:
    const arrA: number[] = [1, 2, 4]
    

    数组中存在单个或者多个同类型的数组的类型定义还有很多,比如:

    const arrC: boolean[] = [true, false]
    const arrD: string[] = ['1', '3']
    const arrE: void[] = [undefined, null, null]
    const arrF: undefined[] = [undefined, undefined]
    

    如果数组中存在不同类型的元素时,需要加个(),然后在里面加上类型定义,并且用 | 隔开就行

    const arrG: (number | string | number[] | boolean)[] = [1, '4', true, [1, 2, 4]]
    

    ts中元祖的使用:如果数组中的元素时不同类型,并且必须规定顺序,那么这样的数组应该应用中元组类型定义

    const arrH: [string, boolean, number] = ['666', true, 666]
    const arrI: [string, boolean, number][] = [['666', true, 666]]
    

    数组中同类型的对象如何定义该数组呢?这种在项目里面经常用到

    const arrJ: { one: string, two: number }[] = [
        {
            one: '666',
            two: 3
        },
        {
            one: '667',
            two: 20
        },
    ]
    

    这样写类型定义实在是太麻烦了,ts为我们提供了类型别名的形式来代替。

    1.数组的类型定义使用类型别名

    type typeA = { unname: string, age: number }
    const arrTypeA: typeA[] = [{ unname: '小刘', age: 24 }]
    

    2.函数参数的类型定义使用类型别名

    type typeB = { one: number, two: string }
    function fntB2({ one, two }) {
        return one + two
    }
    const bResult2 = fntB2({ one: 1, two: '888' })
    

    下一篇: typescript(六)ts中的接口

    展开全文
  • typeScript定义数组类型的三种方式

    万次阅读 2019-10-03 11:08:23
    letarr:number[]=[1,2,3,4]//数字数组不允许出现其他数据类型 letarr2:string[]=['h','h','h']//字符串数组 letarr3:any[]=[1,'h','h',3]//允许数组中出现任意类型 2. 用接口表示数组,一般用于描述类数组 ...

     1. 类型[ ] 

    let arr: number[] = [1, 2, 3, 4] // 数字数组 不允许出现其他数据类型
    
    let arr2: string[] = ['h', 'h', 'h'] // 字符串数组
    
    let arr3: any[] = [1, 'h', 'h', 3] //允许数组中出现任意类型

      2. 用接口表示数组,一般用于描述类数组

      interface arr {
    
        [index: number]: number
    
      }
    
      let list: arr = [1, 2, 3, 4]

    用接口描述数组没太大必要,但类数组不能用普通的数组的方式来描述,需要使用接口来表示类数组的形状

    常用的类数组都有自己的接口定义,比如IArguments,NodeList,HTMLCollection

    3.Array<elementType> 用数组泛型表示数组

      let arr: Array<string> = ['bonjour', 'hello']
      let arr2: Array<number> = [1, 2]
      let arr3: Array<any> = [1, 2, 'hh']

     

    展开全文
  • TS定义数组

    2021-11-30 14:11:05
    正常 写 = ref ([]) 这样 文件会不识别 导致向数组添加元素 --- push ts找不到push方法 const arraynct: number[] = ... const arraynct: any[] = [] // 定义任意类型数组 所以需要加上一个定义具体类型的写法 ...
  • ts如何定义数组中嵌套对象的类型

    万次阅读 2020-05-13 11:38:09
    定义类型: interface ObjectOf<V> { [_: string]: V } class OrderItem { uuid: string; amount: number; secondaryTotal: number; total: number; originalTotal: number; checked: boolean; } 使用...
  • ts基本类型

    2021-02-11 12:53:08
    TS中的常用的数据类型有 (内置类型)Number, String, Boolean, Null, Undefined, Void, enum,Array,Any,Object,元组, 接口等数字类型例如 let decimal: number = 6;字符串let color: string = "blue";布尔类型...
  • TS - 基础类型

    2020-12-23 09:19:51
    这些浮点数的类型是 number。 除了支持十进制和十六进制字面量,TypeScript 还支持 ECMAScript 2015 中引入的二进制和八进制字面量。let decLiteral: number = 6;let hexLiteral: number = 0xf00d;let ...
  • TS要点定义

    2020-12-23 09:19:52
    **1、空值**JavaScript 没有空值(Void)的概念,在 TypeScript 中,可以用 void 表示没有任何返回值的函数:```...}```*******2、Typescript基础操作**```//使用 string 定义字符串类型:let myName: string = 'T...
  • 少侠们,今天我们继续来搞一搞TS今天我们要来看一看TS中数组的定义是个什么鬼样子数组的类型:在 TypeScript 中,数组类型有多种定义方式,比较灵活。下面我们来看看有哪些定义方法「类型 + 方括号」表示法:最简单...
  • 2019-10-28:学习内容:接口、数组类型、函数的类型(展开涉及多个内容)一、接口(Interfaces):(1)LabelledValue接口就好比一个名字,用来描述上面例子里的要求。 它代表了有一个label属性且类型为string的对象。 ...
  • ts类型

    千次阅读 2021-02-11 12:53:07
    第一步tsc--inti生成tsconfig.json改"outDir":"./js",2、第二步任务-运行任务监视tsconfig.json2、typeScript中的数据类型typescript中为了使编写的代码更规范,更有利于维护,增加了类型校验,在typescript中主要给...
  • TS如何定义和使用对象数组

    千次阅读 2020-12-23 09:19:55
    展开全部数组定义:1、类型 + 方括号:比如: 636f70793231313335323631343130323136353331333431373933let tsArray: number[] = [1,1,2,3,4]2、使用数组泛型Array来表示数组:比如:let fibonacci: Array = [1, ...
  • union联合类型
  • TypeScript 数组类型

    千次阅读 2020-12-23 09:19:58
    TypeScript 数组类型最简单的方法...数组的项中不允许出现其他的类型数组的一些方法的参数也会根据数组定义时约定的类型进行限制:let fibonacci: number[] = [1, 1, 2, 3, 5];fibonacci.push('8');// index.t...
  • 布尔类型、数字类型、字符串类型、数组类型、元组类型 先看文件目录 布尔类型(boolean)true false index.ts 只能是赋值 true/false,如果赋值其他值则会报错 flag = 'str' // 错误写法 这样写法也可以 flag = ...
  • Ts定义对象和数组类型

    千次阅读 2021-03-26 10:36:46
    // 接着定义了一个变量 pr,其类型就是 Person(接口是类型,对象类型)。约束了定义的变量 pr 属性类型必须和接口 Person 一致。 let pr1:Person1 = { // 以上,赋值的时候,多一个少一个都不行,变量的属性必须和...
  • ts 数组解构时定义类型_解构数组

    千次阅读 2020-08-14 17:41:35
    ts 数组解构时定义类型Today I will talk about destructuring an array, first introduced in the ES6 version of Javascript. Destructuring is a way of extracting values from an array into variables. 今天,...
  • 一个 ,以数组的形式创建多个react useState状态。 安装 $ yarn add use-state-as-array 进口 import useStateAsArray from 'use-state-as-array' ; 用法 const [ stateAsArray , setStateAsArray ] = ...
  • ts基本数据类型

    2020-12-23 09:19:53
    1.增加数据类型为了让程序有价值,我们需要能够处理最简单的数据单元:数字,字符串,结构体,布尔值等。 TypeScript支持与JavaScript几乎相同的数据类型。1.1 布尔值let isFlag: boolean = false;1.2 数字let ...
  • ts中的数组、泛型数组
  • 定义一个方法,返回一个数组数组的每一项均为对象,对象中包含label和value两个属性 创建一个public.ts文件 javascript实现 // javascript 实现 export const formatYear = function () { let date = new ...
  • /*******************************联合类型**************************************** */ let money: string | .../*******************************数组类型**************************************** */ let lan.
  • TS(Vue)中数组的接口类型使用

    千次阅读 2019-04-29 11:08:18
    首先出现的问题是,我需要一个数组list,数组中每一项需要是key:value形式的...这里就需要使用TS的接口,我们需要自定义一下list数组类型,使用接口就可以自定义list中属性的类型。 先定义接口: interface Iitem...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 22,186
精华内容 8,874
关键字:

ts定义数组类型