伪代码 | CSS-Tricks

Yonatan Doron 不久前在 Medium 上发表了一篇文章，名为 “代码艺术——为什么要编写更多伪代码。”我喜欢这个标题，因为我自己也是伪代码的粉丝。也就是说，编写描述你想要做的事情或想要传达的内容的“代码”，但它不属于任何特定语言，也不使用任何正确的 API 或其他任何东西。

花时间编写带注释的伪代码有助于整理我们的思路、动机，并提前规划期望的结果代码。通过这样做，当我们开始编码时，我们总是会有这份思维导图或框架，帮助我们重新集中注意力，提高生产力。

Jeremy Keith 曾将它比作编写剧本。

“当用户提交表单时，显示一个带有确认信息的模态对话框。”然后我鼓励他们编写一个脚本……但我的意思不是 JavaScript 意义上的脚本；我的意思是编写一个电影剧本或戏剧脚本。逐行写出你想要完成的每一步。完成后，将你用英语（或葡萄牙语）写成的每行脚本翻译成 JavaScript。

我见过教育工作者一遍又一遍地使用这种技术。但这不仅仅是老师用来教学、学生用来学习的——它对任何人都很有帮助。我发现自己在编写真实代码之前会先编写伪代码，当然，我也会在代码注释中保留它。最常见的是，我会在 Notion 文档或 Slack 聊天中使用它来传达一个观点。

即使是简单的想法。

if env.dev
  stop email delivery

任何带有逻辑分支或分步操作的内容都将从中受益匪浅。请注意，这段代码不是有效的代码。它在我的脑海中任何语言中都是无效的。有时，我会出于肌肉记忆添加一些随机的括号或分号。谁在乎呢？它只是关于向我自己或其他人传达一个想法。

if (grid is supported)
  use grid
else
  lay out things in a basic row with flexbox

这是很自然的。他们很可能也不关心语法，他们只会理解这个想法。

on form submit
  validate
  if errors
     show errors;
  else
     submit to api;
     if api success
        show ui success;
     else
        show ui fail;

（写完这些后，让我想起了 uilang。看看那里的自然语言代码块是如何工作的。）

Yonatan 的文章缺少真实的伪代码示例，所以我四处询问。看看这些很棒的示例吧！

我的整个笔记本都是伪代码……

这些在开始编码之前会被转移到注释中，这样我就可以知道自己在做什么以及之后做了什么 pic.twitter.com/9vfJYfweDh

— Ruth John (@Rumyra) 2019年5月28日

白板非常适合编写伪代码，还可以添加图形 pic.twitter.com/56FUu4rhmU

— norom (@_norom_) 2019年5月28日

哦，我以前也做这些，很久以前…… pic.twitter.com/lQi4Y8RhwP

— Ben Koppenens (@bkoppenens) 2019年5月28日

一直都在用！ pic.twitter.com/YFVVNwls5M

— Bryan (@iamBryanSanders) 2019年5月28日

尝试同时使用 JavaScript 和 php 有时会有点棘手 pic.twitter.com/Xp0bQyV86D

— frankie | webdev (@azoicx) 2019年5月29日

姗姗来迟。脚本的快速地图。 pic.twitter.com/n1kYDxKgya

— Adam Styles (@thelibstyles) 2019年5月31日

我对纸上有很多伪代码感到有点惊讶！这真的很酷。对我来说有点奇怪，因为我很少用纸做任何事情。也许我应该试试。

评论