TypeScript interface 函数类型 可索引类型

函数类型

接口能够描述JavaScript中对象拥有的各种各样的外形。 除了描述带有属性的普通对象外,接口也可以描述函数类型。 ---- 中文官方文档

自己写的demo🌰:

// 函数类型
interface Add {
  (a:number, b:number):number
}

let sum:Add = function (a:number, b:number) {
  return a + b;
}

console.log(sum(1,3));

对于函数类型的类型检查来说,函数的参数名不需要与接口里定义的名字相匹配 ,甚至不需要指定类型,TypeScript的类型系统会推断出参数类型。

interface Add {
  (a:number, b:number):number
}

let sum:Add = function (c, d) {
  return c + d;
}

console.log(sum(1,3));

函数中的 c、d两个参数只是形式参数,只要参数类型、位置相匹配就行。

可索引的类型

可索引类型具有一个 _索引签名_,它描述了对象索引的类型,还有相应的索引返回值类型。

官网demo🌰

通过number类型索引,得到string类型的返回值

interface StringArray {
  [index: number]: string;
}

let myArray: StringArray;
myArray = ["Bob", "Fred"];

let myStr: string = myArray[0];

我的demo🌰

通过string类型索引,得到number数字类型的返回值

interface Person {
  [index: string]: number
}

let person: Person;
person ={
  "age": 18
};

let age: number = person["age"];
console.log(age);  // 18
原文链接:segmentfault.com

上一篇:Vue 实现点击空白处隐藏某节点(三种方式:指令、普通、遮罩)
下一篇:回顾一下正则表达式使用方式

相关推荐

  • 面试官问你基本类型时他想知道什么

    前言: 面试的时候我们经常会被问答js的数据类型。大部分情况我们会这样回答包括 1、基本类型(值类型或者原始类型): Number、Boolean、String、NULL、Undefined以及E...

    1 年前
  • 面向对象不是银弹,DDD 也不是,TypeScript 才是

    要解决的问题是什么? A problem wellstated is Halfsolved Fred Brooks 在著名的"No Silver Bullet Essence and Acci...

    10 个月前
  • 静态类型检测器—Flow入门

    介绍 一个 JAVASCRIPT 静态类型检测器 Flow 使用类型接口查找错误,甚至不需要任何类型声明。 它也能够准确地跟踪变量的类型,就像运行时那样 Flow 专为 JavaSc...

    2 年前
  • 静态类型检查—Flow入门

    介绍 一个 JAVASCRIPT 静态类型检测器 Flow 使用类型接口查找错误,甚至不需要任何类型声明。 它也能够准确地跟踪变量的类型,就像运行时那样 Flow 专为 JavaSc...

    2 年前
  • 重读《学习JavaScript数据结构与算法-第三版》-第2章 ECMAScript与TypeScript概述

    定场诗 八月中秋白露,路上行人凄凉; 小桥流水桂花香,日夜千思万想。 心中不得宁静,清早览罢文章, 十年寒苦在书房,方显才高志广。 前言 洛伊安妮·格罗纳女士所著的《学习JavaScr...

    10 个月前
  • 重温Javascript:数据类型

    数据类型.png(https://img.javascriptcn.com/c8e734a064b405495051da1ed89158ac "数据类型.png") 类型判断 Javascri...

    6 个月前
  • 重学JS:显示强制类型转换

    ToString ToString负责处理非字符串到字符串的强制类型转换,常用的字符串化方法String()、toString()。 基本类型值的字符串化规则: null转换为'null'...

    1 年前
  • 重学JS: 隐式强制类型转换

    隐式强制类型转换指的是那些隐藏的强制类型转换,副作用也不是很明显,事实上,只要自己觉得不够明显的强制类型转换都可以算作隐式强制类型转换,接下来,此文将会介绍几种常见的隐式类型转换。

    1 年前
  • 重学JS: 数据类型及类型检测

    数据类型 JavaScript七种内置类型: 空值(null) 未定义(undefined) 布尔值(boolean) 数字(number) 字符串(string)...

    1 年前
  • 那些鲜为人知的 TypeScript 功能

    原文地址: medium.com/articode/so… 译文地址:github.com/xiaoT/note… 本文版权归原作者所有,翻译仅用于学习。 过去的几年中,TypeScript 已...

    13 天前

官方社区

扫码加入 JavaScript 社区