这是一个真实的例子,展示了三种最常见的编程范式的差异。我将用三种不同的方式解决一个问题。
每个示例将处理表单提交、验证用户输入并将创建的用户打印到控制台。我还添加了保存错误记录器。
案例表单
<!DOCTYPE html> |
简单的 HTML 登录表单,它将包含三个js不同范式的有效文件。
过程化编程
过程式编程只是一步一步地解决问题。这是完全有效的编码方式,但是当您希望应用程序扩展时它有许多缺点。
const form = document.querySelector('form') |
简单一步一步解决问题。但它根本不可重用和可扩展。尽管它对于解决此类问题完全有效,并且您将看到它比其他问题要短得多。
面向对象编程
面向对象编程 ( OOP ) 是最接近现实世界的,因此很容易让您思考。我们查看将其划分为Object的代码,其中每个都只完成它的工作。在OOP 中学习的有用概念是SOLID。
// Class responsible only for logging |
现在你可以明白我将问题划分为Objects 的意思了:
- FormHandler是它自己的类,负责处理表单。
- User是另一个负责创建用户并使用Validator类验证输入的类。
- 如果有错误,Logger类用于显示警报并保存日志。
正如你所看到的,有更多的代码,看起来更复杂……那么为什么有人会喜欢这个?
酷的是,现在我们可以将它用于任何类似的形式,只需调用:
new FormHandler(new_form) |
因此,它可以在包含此脚本的每个文件中重复使用。而且它很容易扩展,因为一切都被分成只做一件事的块(单一责任原则)。
函数式编程
非常流行,而且非常简单。请注意,这并不意味着它无论如何都更好。尽管某些范例可能对某些问题更好,但使用哪个完全取决于您。
const FLAGS = { |
正如您在函数式编程中看到的,我们希望使用小的(理想情况下是纯函数)函数来解决问题。这种方法也非常具有可扩展性,并且函数可以重用。
纯函数是一种没有难以追踪的副作用的函数。纯函数应该只依赖于给定的参数。
结论
没有更好和更坏的范式。有经验的开发人员可以看到每个的优点,并为给定的问题选择最好的。
过程式编程并不是说你不能使用函数,函数式编程也不会阻止你使用“类”。这些范式只是帮助以一种随着代码增长而有益的方式来解决问题。