Intro

0.首先在不使用 ts 的情况下讨论问题

例子代码类似如下

 log(logObj) { const cOnsoleLogFn= this._getLogFn(logObj.level); // Type const type = logObj.type === 'log' ? '' : logObj.type; // Tag const tag = logObj.tag || ''; // Styles const color = this.typeColorMap[logObj.type] || this.levelColorMap[logObj.level] || this.defaultColor; const style = ` background: ${color}; border-radius: 0.5em; color: white; font-weight: bold; padding: 2px 0.5em; `; const badge = `%c${[tag, type].filter(Boolean).join(':')}`; // Log to the console if (typeof logObj.args[0] === 'string') { consoleLogFn( `${badge}%c ${logObj.args[0]}`, style, // Empty string as style resets to default console style '', ...logObj.args.slice(1) ); } else { consoleLogFn(badge, style, ...logObj.args); } }

1.这是一段 console.log 的包装函数，通过读以下代码，我们好像无法理会它的意思
2.首先第一个问题 logObj 就难住了调用者,这个 logObj 是什么，有什么属性，每个属性是做什么用的？
- 我们可以通过 JSDoc 的方式来不太良好的解决这个问题，也可以通过注释说明，但是编辑器可不会推断出对象中的属性都有些什么
3.在我们使用 React 的纯 JS 时，PropType 可以帮助我们规定每个组件中的 this.props 属性类型

Question

0.如何只使用 JS 或者 JS 第三方库来写出好的代码（代码消费者好懂，代码生产者工作量少）？
1.如何规定参数的类型？或者说给我们的 JS 一些小小的约束？

第 1 条附言 2023-09-21 09:58:53 +08:00

感谢各位的解答和各位的经验

结论：使用 JSDOC 好好写，编辑器可以根据 DOC 推断出属性。

11 条回复 2023-10-04 16:13:44 +08:00

iOCZ

2023-09-20 17:49:54 +08:00

对于脚本语言而言，就是没有。。。如果你要类型，就要额外的编译器支持。除了用 TS ，以前还有 flow 这种东西。

c3de3f21

2023-09-20 17:52:58 +08:00

@iOCZ 啊~~~好吧

codehz

2023-09-20 19:43:27 +08:00

怎么能说没有呢
虽然没有标注，但是你可以根据使用情况和作者预期推断需要的数据形状（ shape ），甚至于 flow 和 ts 都有提供自动根据使用情况推断的工具，自动的准不准确另说，但起码能用
此外即使文件是 js ，你依旧可以通过 jsdoc 来注释类型，而且 ts 是支持这样的 https://www.typescriptlang.org/docs/handbook/jsdoc-supported-types.html

lzgshsj

2023-09-20 20:31:00 +08:00

纯 js 想要使用者好懂，就需要开发者花时间写详细的 jsdoc 或者.d.ts 声明文件。编辑器和 IDE 是可以通过 jsdoc 和.d.ts 文件智能提示类型的。

AV1

2023-09-20 20:41:39 +08:00

0 、不像用 TS 就用 jsdoc + ts-check
1 、如何规定参数类型： https://www.typescriptlang.org/docs/handbook/jsdoc-supported-types.html#param-and-returns

不要小瞧 jsdoc ，在 vscode 里开 ts-check ，已经能达到 TS 八成功力了。