javascript - 将对象文字转换为 ES6 Javascript 中的函数

Question

我正在阅读 this article在 hackernoon.com 上，它试图解释一种将 javascript Switch/Case 转换为它自身的功能版本的特定方法。

文章讲到他们设置了一个名为 switchcase 的函数，定义为:

const switchcase = cases => defaultCase => key =>
  cases.hasOwnProperty(key) ? cases[key] : defaultCase

他们还说这个函数有问题，因为“整个对象字面量在传递给 switchcase 函数之前被求值”。因此他们决定将对象字面量中的值转换为函数。为此，他们使用以下语法:

const switchcaseF = cases => defaultCase => key =>
  switchcase(cases)(defaultCase)(key)()

我的问题是:最后一个语法是如何工作的？谁能帮我分解一下？

Answer 1

How does this last syntax work? Can anyone break it down for me?

考虑 switchcase 和 switchcaseF 的定义。

const switchcase = cases => defaultCase => key =>
  cases.hasOwnProperty(key) ? cases[key] : defaultCase

const switchcaseF = cases => defaultCase => key =>
  switchcase(cases)(defaultCase)(key)()

如果我们在 switchaseF 中内联 switchcase 的应用程序，我们会得到以下内容。

const switchcaseF = cases => defaultCase => key =>
  (cases.hasOwnProperty(key) ? cases[key] : defaultCase)()
//|____________________________________________________|
//                           |
//          switchcase(cases)(defaultCase)(key)

此外，我们可以将函数应用移到条件表达式中。

const switchcaseF = cases => defaultCase => key =>
  cases.hasOwnProperty(key) ? cases[key]() : defaultCase()

现在，考虑 article 中的示例你链接到的。

const counter = (state = 0, action) =>
  switchcaseF({
    'INCREMENT': () => state + 1,
    'DECREMENT': () => state - 1
  })(() => state)(action.type)

如果我们在 counter 中内联 switchcaseF 的应用程序，我们会得到以下内容。

const counter = (state = 0, action) => {
  const cases = {
    'INCREMENT': () => state + 1,
    'DECREMENT': () => state - 1
  }
  const defaultCase = () => state
  const key = action.type
  return cases.hasOwnProperty(key) ? cases[key]() : defaultCase()
}

因此，如果 action.type 为 'INCREMENT'，则结果为 state + 1。如果 action.type 是 'DECREMENT' 那么结果是 state - 1。否则，结果为 state。

我们写像 () => state + 1 而不是简单的 state + 1 这样的表达式的原因是为了 lazy evaluation .我们只在调用函数时评估 () => state + 1 的主体。这可以防止出现以下示例中的不正确行为。

const switchcase = cases => defaultCase => key =>
  cases.hasOwnProperty(key) ? cases[key] : defaultCase

const never = () => { while (true); }

const example = key => switchcase({
  never: never()
})('it works')(key)

console.log(example('it should work')) // expected 'it works' but never returns

使用 switchcaseF 解决了这个问题。

const switchcaseF = cases => defaultCase => key =>
  cases.hasOwnProperty(key) ? cases[key]() : defaultCase()

const never = () => { while (true); }

const example = key => switchcaseF({
  never: () => never()
})(() => 'it works')(key)

console.log(example('it should work')) // 'it works' as expected

但是，请注意，您也可以使用 getter 使其与 switchcase 一起工作。

const switchcase = cases => defaultCase => key =>
  cases.hasOwnProperty(key) ? cases[key] : defaultCase

const never = () => { while (true); }

const example = key => switchcase({
  get never() { return never(); }
})('it works')(key)

console.log(example('it should work')) // 'it works' as expected

我们还可以让 defaultCase 变惰性。

const switchcase2 = cases => defaultCase => key =>
  cases.hasOwnProperty(key) ? cases[key] : defaultCase.value

const never = () => { while (true); }

const example = key => switchcase2({
  get never() { return never(); }
})({ get value() { console.log('yes'); return 'it works'; } })(key)

console.log(example('it should work')) // 'yes' 'it works' as expected

如果你不想让它变得懒惰，那么你可以将它包装在 strict 中，如下所示。

const switchcase2 = cases => defaultCase => key =>
  cases.hasOwnProperty(key) ? cases[key] : defaultCase.value

const never = () => { while (true); }

const strict = value => ({ value })

const example = key => switchcase2({
  get never() { return never(); }
})(strict('it works'))(key)

console.log(example('it should work')) // 'it works' as expected

希望这能阐明您的疑虑。