xcatliu / typescript-tutorial

TypeScript 入门教程
https://ts.xcatliu.com
10.44k stars 1.33k forks source link

对象的类型——接口 #156

Open xcatliu opened 4 years ago

xcatliu commented 4 years ago

https://ts.xcatliu.com/basics/type-of-object-interfaces.html

ms300 commented 4 years ago

哈哈,编号89757的彩蛋可还行~

xcatliu commented 4 years ago

@ms300 哈哈,编号89757的彩蛋可还行~

暴露年龄了 : )

peter-gong commented 4 years ago

9527不也是

fpGHwd commented 4 years ago

happy

Volcano-Yang commented 4 years ago

这篇总结的很好

fengliang2011 commented 4 years ago

在3.9.3中,如果同时存在任意属性、可选属性,那么任意属性的数据类型要带undefined

Frank-1000 commented 4 years ago

果然,跟js还是有挺大区别的

pluswhite commented 4 years ago

@fengliang2011 在3.9.3中,如果同时存在任意属性、可选属性,那么任意属性的数据类型要带undefined

是的,或者可以修改任意属性的类型为 any

aipdx commented 4 years ago

接口里的属性用什么隔开啊?我用了逗号,分号,什么都不加,都不报错

yhysir commented 4 years ago

写的太好了,描述言简意骇 通俗意懂,看了官网文档好几遍感觉不好理解,看下这里就明白的差不多了,支持!!

chenle19 commented 4 years ago

需要注意的是,一旦定义了任意属性,那么同一个接口内其他所有的属性,都只能和任意属性的类型一样,否则将会报错

weiweidong1993 commented 4 years ago

@aipdx 接口里的属性用什么隔开啊?我用了逗号,分号,什么都不加,都不报错

都可以 我实测也不报错

sjqw commented 4 years ago

ts小白学习中,简单易懂,谢谢老铁

lanceMe commented 3 years ago

如何关闭TS2322,这个错误一包导致项目都不运行了,只是类型错误搞得这么严重?

Lisianthus-A commented 3 years ago

@lanceMe 如何关闭TS2322,这个错误一包导致项目都不运行了,只是类型错误搞得这么严重?

把tsconfig里面的noEmitOnError选项改成false试试?

wensiyuanseven commented 3 years ago

可以的

East-Apollo commented 3 years ago

写的很好,点赞

bree323 commented 3 years ago

大白的理解:接口里定义了基础属性,可选属性,任意属性,只读属性。基础属性约束了形状;可选属性在属性后加问号,表示可选;任意属性采用中括号进行定义string类型的属性;只读属性在属性前加readonly,不能被写

bree323 commented 3 years ago

接口和对象长得好像,要不是那个分号,我都以为是对象了

lzzqwe commented 3 years ago
上例中,任意属性的值允许是 string,但是可选属性 age 的值却是 number,number 不是 string 的子属性,所以报错了。
zb-0819 commented 3 years ago

interface Person { name: string; age?: number; [propName: string]: string | number; }

let tom: Person = { name: 'Tom', age: 25, gender: 'male' }; 这个age属性是可选的,可能为undefined类型

Aslantoe commented 3 years ago

@ms300 哈哈,编号89757的彩蛋可还行~

模仿人类的机器~

ggg1it commented 3 years ago

@aipdx 接口里的属性用什么隔开啊?我用了逗号,分号,什么都不加,都不报错

个人理解 以前写js 代码报错 是因为不符合 eslint 不报错 1.校验规则 2.他的语法标准 并没有觉得有问题

ggg1it commented 3 years ago

其实最后一个例子中 其实也不能说 存在 因为在赋值的时候 tom 初始化 对象中不存在 id 就已经会报错了 也就不会再看 tom.id = 89757; 这个赋值了

tooilxui commented 3 years ago

接口的內文描述:

定義的變數比介面少了一些屬性是不允許的: 多一些屬性也是不允許的: 可見,賦值的時候,變數的形狀必須和介面的形狀保持一致。

但事實上官網明明是允許的? https://www.typescriptlang.org/docs/handbook/interfaces.html

but the compiler only checks that at least the ones required are present and match the types required

ClishWang commented 3 years ago

@zb-0819 interface Person { name: string; age?: number; [propName: string]: string | number; }

let tom: Person = { name: 'Tom', age: 25, gender: 'male' }; 这个age属性是可选的,可能为undefined类型

Demo在非strict模式下测试不报错,或者任意属性类型加上undefined.