javascript - 为什么 cat.setName = setName 和 setName.apply pig, ['Babe' ] 的输出是一样的。甚至为什么有必要在代码中包含它们

Question

大家好，因为我是 CoffeeScript 的新手，所以我对此感到困惑。我正在关注一本名为“https://www.montecassino.org/images/data/attachments/0000/0014/CoffeeScript.pdf”的书，其中有一个代码示例，如下所示

setName = (name) -> 
    @name = name
    console.log(@name)
    console.log(name)

cat = {}
cat.setName = setName
cat.setName "Manu"
console.log(cat.name)

pig = {}
setName.apply pig, ['Babe']
console.log(pig.name)

在上面的代码中，我不明白发生了什么。有一个函数为对象分配名称。但是 cat.setName = setName 和 setName.apply pig, ['Babe'] 的目的和意义是什么。这些行具有相同的含义，那么它们之间有什么区别。如果我问了一个愚蠢的问题，我很抱歉，但我完全糊涂了。任何帮助，将不胜感激。谢谢

Answer 1

两个片段——关于 cat 的片段还有一个关于 pig ——正在完成同样的事情。他们正在调用 setName作用于两个不同的对象。不同之处在于 cat例如，setName函数成为 cat 的一部分对象，并在 pig例如，setName函数应用于pig ，但实际上并未成为 pig 的一部分目的。

如果您将其分解为多个部分并推理每个部分的作用，则可能会更清楚地理解。

第一部分定义了一个函数，由 setName 引用。 :

setName = (name) -> 
  @name = name
  console.log(@name)
  console.log(name)

如您所见，它采用单个参数 name . @name = name如果您不熟悉 CoffeeScript，可能会有些困惑。 @ CoffeeScript 中的符号等价于 this在 JavaScript 中。在 JS 中，它将是 this.name ，但在 CS 中，快捷方式是 @name .当 setName函数被调用， @ (或 this )将引用 setName 所在的上下文。函数被调用。

cat = {}
cat.setName = setName
cat.setName "Manu"
console.log(cat.name)

在上面的 block 中，首先是一个名为 cat 的空对象。被 build 。它最初没有任何功能或属性。然后我们添加 setName它的功能，这是上面定义的。

这可以写成:

cat = {}
cat.setName = (name) ->
  @name = name
  console.log(@name)
  console.log(name)

但自从 setName函数已经定义，我们可以简单地设置 cat.setName给它。

当 cat.setName "Manu"被调用(或者写成 cat.setName("Manu") ，CoffeeScript 中的括号是可选的)， @里面 setName指 setName 的对象属于。 setName正在(适本地)设置一个名为 name 的属性在 cat目的。如果你是 console.log(cat) ，你会看到这样的东西:

{ setName: [Function], name: 'Manu' }

我们取了一个名为 cat 的空对象。 , 然后给它一个名为 setName 的函数，然后调用 setName ，在其上设置一个属性: name .
pig示例具有相同的结果，但语法略有不同:

pig = {}
setName.apply pig, ['Babe']
console.log(pig.name)

在本例中，我们调用 apply setName上的功能(这是一个函数本身)。调用 setName.apply pig, ['Babe']将应用函数 setName到对象 pig ，带有参数数组。通过 pig作为 apply 的第一个参数，我们实际上是在告诉 apply : setName 的内部, 每当你看到 @ ，我们真的在谈论 pig .
apply 的第二个参数|是调用 setName 时使用的参数数组.此数组中只有一个元素，它与 setName 的参数数量匹配。接受。 ['Babe']是一个只有一个参数的参数数组: 'Babe' .

这与 cat 之间的重要区别例如，我们没有制作 setName pig 的一部分目的。确实， console.log(pig)生产

{ name: 'Babe' }

看？没有 setName功能。我们只将该函数应用于 pig目的。您注意到在 cat 示例中的行 cat.setName = setName ——我们没有为 pig 这样做.

您可以查看 Mozilla 的 apply 文档。更多背景的 JS 函数: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply?redirectlocale=en-US&redirectslug=JavaScript%2FReference%2FGlobal_Objects%2FFunction%2Fapply

对于它的值(value)，我没有经常看到 apply 的示例用于生产 CoffeeScript 代码。如果您真的坚持理解这一点，那么继续前进并稍后重新审视它可能是值得的。