如何在纯脚本中构建应用程序

Question

我决定尝试函数式编程和 Purescript。在阅读了 "Learn you a Haskell for great good" 和 "PureScript by Example" 并稍微玩了一下代码之后，我认为我可以说我理解了基础知识，但有一件事让我很困扰——代码看起来非常耦合。我通常经常更改库，在 OOP 中我可以使用洋葱架构将我自己的代码与特定于库的代码分离，但我不知道如何在 Purescript 中执行此操作。

我试图找出 Haskell 中的人们是如何做到这一点的，但我所能找到的只是像 "No one has ever made complex apps in Haskell, so no one knows how to do it" 或 "You have input and you have output, everything in between are just pure functions" 这样的答案。但此刻我有一个使用虚拟 dom、信号、网络存储、路由器库的玩具应用程序，它们中的每一个都有自己的效果和数据结构，所以听起来不像一个输入和一个输出。

所以我的问题是我应该如何构建我的代码或我应该使用什么技术以便我可以在不重写一半应用程序的情况下更改我的库？

更新：

建议使用多层并在主模块中保留效果也很常见，我理解为什么要这样做。
这是一个简单的例子，希望能说明我正在谈论的问题：

btnHandler :: forall ev eff. (MouseEvent ev) => ev -> Eff (dom :: DOM, webStorage :: WebStorage, trace :: Trace | eff) Unit
btnHandler e = do
  btn <- getTarget e
  Just btnId <- getAttribute "id" btn
  Right clicks <- (getItem localStorage btnId) >>= readNumber
  let newClicks = clicks + 1
  trace $ "Button #" ++ btnId ++ " has been clicked " ++ (show newClicks) ++ " times"
  setText (show newClicks) btn
  setItem localStorage btnId $ show newClicks
  -- ... maybe some other actions
  return unit

-- ... other handlers for different controllers

btnController :: forall e. Node -> _ -> Eff (dom :: DOM, webStorage :: WebStorage, trace :: Trace | e) Unit
btnController mainEl _ = do
  delegateEventListener mainEl "click" "#btn1" btnHandler
  delegateEventListener mainEl "click" "#btn2" btnHandler
  delegateEventListener mainEl "click" "#btn3" btnHandler
  -- ... render buttons
  return unit

-- ... other controllers

main :: forall e. Eff (dom :: DOM, webStorage :: WebStorage, trace :: Trace, router :: Router | e) Unit
main = do
  Just mainEl <- body >>= querySelector "#wrapper"
  handleRoute "/" $ btnController mainEl
  -- ... other routes each with it's own controller
  return unit

这里我们有简单的计数器应用程序，具有路由、网络存储、dom 操作和控制台日志记录。如您所见，没有单一输入和单一输出。我们可以从路由器或事件侦听器获取输入并使用控制台或 dom 作为输出，因此它变得稍微复杂一些。

将所有这些有效的代码放在主模块中对我来说感觉不对，原因有二：

如果我继续添加路由和控制器，这个模块很快就会变成一千行乱七八糟的东西。
将路由、dom操作和数据存储在同一个模块中违反了单一责任原则（我认为这在 FP 中也很重要）

我们可以将这个模块拆分成几个，例如每个控制器一个模块，并创建某种有效层。但是当我有十个控制器模块并且我想更改我的 dom 特定库时，我应该全部编辑它们。

这两种方法都远非理想，所以问题是我应该选择哪一种？或者也许还有其他方法？

Answer 1

这是一个有点开放性的问题，所以没有具体的例子很难具体回答。

You have input and you have output, everything in between are just pure functions

这样的说法其实很接近事实。由于 Haskell 和 PureScript 中没有有状态对象，应用程序中的大部分代码将基于纯函数和简单数据类型（或记录），因此它不会与任何特定库紧密耦合（除了 Maybe、Either、Tuple 之类的东西，它们在您所说的意义上并不是真正的图书馆）。

您应该尽可能尝试将使用效果的代码推到“外部”。这是您交错处理任何输入并生成应用程序所需的任何输出所需的各种库的地方。这种分层使得库的切换和切换变得容易，因为在这里您主要将核心纯代码提升到 Eff monad 以将其“连接”到外部输入和输出。

一种看待它的方法是，如果您发现自己在应用程序的主模块或顶层以外的地方使用 Eff，您可能“做错了”。

如果您正在写 Haskell，请将我提到的任何地方 Eff 替换为 IO。

Answer 2

没有理由不能有一个中间层来抽象依赖关系。假设您想为您的应用程序使用路由器。您可以定义如下所示的 "router abstraction" 库：

module App.Router where

import SomeRouterLib

-- Type synonym to make it easy to change later
type Route = SomeLibraryRouteType

-- Just an alias to the Router library
makeRoute :: String -> Route -> Route
makeRoute = libMakeRoute

然后新的shiny出来了，你要切换你的路由库。您需要制作一个新模块，它符合相同的 API，但具有相同的功能——一个适配器，如果您愿意的话。

module App.RouterAlt where

import AnotherRouterLib

type Route = SomeOtherLibraryType

makeRoute :: String -> Route -> Route
makeRoute = otherLibMakeRoute

在您的主应用程序中，您现在可以交换导入，并且一切正常。可能需要进行更多调整才能使类型和函数按您预期的方式工作，但这是一般的想法。

您的示例代码本质上是命令式的。它不是惯用的功能代码，我认为你指出它是不可持续的是正确的。更多功能习语包括 purescript-halogen and purescript-thermite.

将 UI 视为当前应用程序状态的纯函数。换句话说，考虑到事物的当前价值，我的应用程序是什么样的？此外，考虑到应用程序的当前状态可以通过将一系列纯函数应用于某些初始状态来导出。

你的申请状态如何？

data AppState = AppState { buttons :: [Button] }
data Button = Button { numClicks :: Integer }

你在看什么样的活动？

data Event = ButtonClick { buttonId :: Integer }

我们如何处理该事件？

handleEvent :: AppState -> Event -> AppState
handleEvent state (ButtonClick id) =
    let newButtons = incrementButton id (buttons state)
    in  AppState { buttons = newButtons }

incrementButton :: Integer -> [Button] -> [Button]
incrementButton _ []      = []
incrementButton 0 (b:bs)  = Button (1 + numClicks b) : bs
incrementButton i (b:bs)  = b : incrementButton (i - 1) buttons

如何根据当前状态呈现应用程序？

render :: AppState -> Html
render state =
    let currentButtons = buttons state
        btnList = map renderButton currentButtons
        renderButton btn = "<li><button>" ++ show (numClicks btn) ++ "</button></li>" 
    in  "<div><ul>" ++ btnList ++ "</ul></div>"

如何在纯脚本中构建应用程序

How to structure app in purescript

architecture

haskell

purescript