• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

TypeScript-索引签名和只读属性

原作者: [db:作者] 来自: [db:来源] 收藏 邀请
  • 索引签名用于描述那些 “通过索引得到” 的类型,比如 arr[10]obj["key"]
  • 只要 keyvalue 满足索引签名的限定即可, 无论有多少个都无所谓
  • 首先来看看 obj["key"] 的形式
interface FullName {
    [propName: string]: string
}

let obj: FullName = {
    firstName: 'Jonathan',
    lastName: 'Tang',
}

console.log(obj["firstName"]);

如果不满足接口索引签名限定的类型会报错如下:

  • 无论 key 是什么类型最终都会自动转换成字符串类型, 所以如下的代码就没有报错
interface FullName {
    [propName: string]: string
}

let obj: FullName = {
    firstName: 'Jonathan',
    lastName: 'Tang',
    false: '666'
}

console.log(obj["firstName"]);
  • 不报错的原理也挺简单的,还是如上那句话 无论 key 是什么类型最终都会自动转换成字符串类型 来验证一下这一点即可其实在我 ES6 文章当中已经说过了所以基础好还是非常重要的

  • 再来看看 arr[10] 的形式
  • 方式一
interface stringArray {
    [propName: number]: string
}

let arr: stringArray = {
    0: 'a',
    1: 'b',
    2: 'c'
};

console.log(arr[0]);
  • 方式二
interface stringArray {
    [propName: number]: string
}

let arr: stringArray = ['a', 'b', 'c'];
console.log(arr[0]);
console.log(arr[1]);
console.log(arr[2]);

只读属性概述

  • 让对象属性只能在对象刚刚创建的时候修改其值
  • 在只读属性限定前面添加 readonly 即可

interface FullName {
    firstName: string
    readonly lastName: string
}

let myName: FullName = {
    firstName: 'Jonathan',
    lastName: 'Lee'
};

myName.lastName = 'Wang';
console.log(myName);
  • TS 内部对只对属性进行了扩展,扩展出来了一个 只读数组(ReadonlyArray)
let arr2: ReadonlyArray<string> = ['a', 'b', 'c'];
console.log(arr2[0]);
arr2[0] = '666';
console.log(arr2[0]);


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript-声明安装发布时间:2022-07-18
下一篇:
TypeScript设计模式之职责链、状态发布时间:2022-07-18
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap