解释 elm 函数声明语法

Interpreting elm function declaration syntax

我无法掌握以下elm语言的函数声明和定义语法。

keyDown: (Int -> Msg) -> Attribute msg
keyDown event = 
  on "keydown" (Json.map event keyCode)

第一行是什么意思? keyDown: (Int -> Msg) -> Attribute msg。这是否意味着 keyDown 函数采用 Int & Msg 类型参数 & returns 类型 Attribute?

函数定义部分到底发生了什么?

函数的参数是如何定义的?

TL;DR

keyDown 函数接受另一个函数作为参数和 returns 一个属性,Elm 的渲染器使用它来附加事件侦听器。

如果定义类型

type Msg
    = KeyDown Int

KeyDown 充当 Msg 类型值的构造函数,所以我们可以说它的隐式类型是 KeyDown: Int -> Msg,这就是你想要的想从 DOM 事件中检索键码。

说明

首先,我必须说正确的实现应该是这样的:

keyDown : (Int -> msg) -> Attribute msg
keyDown tagger =
    on "keydown" (Json.Decode.map tagger keyCode)

在签名中包含 msg 类型变量很重要,因此可以在应用程序的不同部分使用此事件侦听器,其中 Html 发出不同类型的 msg

要了解这里发生了什么,让我们仔细看看 Html.Events.on

on : String -> Decoder msg -> Attribute msg

每个 DOM 事件都表示为具有特定字段的 JavaScript 对象。要从 JavaScript 检索数据,Elm 需要通过 Decoder 传递它以确保运行时的类型安全,就像 HTTP 请求一样。

on 中的解码器应生成与属性本身相同类型的消息。

默认情况下,keyCode 解码器解码一个 Int 值,但我们想要的是发出一些消息。

那是 Json.Decode.map 帮助我们获取 Int 并应用一些 tagger 函数的地方,它会生成一条消息。

解码器

整个(Json.map event keyCode)部分本质上是一个Decoder msg,它应用于事件对象以提取关键代码并"tag"它带有消息。