Question

以下代码有效但尽管我付出了最大的努力，但我无法阅读它。 25年的C ++工作似乎让我的大脑无法去除这样的三重嵌套函数声明。

app.directive('alertable', function(){
  return {
    restrict : 'A',
    link: function(scope, element, attrs) {
      element.bind('click', function() {
        alert(attrs.alertable);
      });
     }
  };
});

我可以阅读以下代码，但它不起作用。

app.directive
(
  'alertable',
  function()
  {
    return
    {
      restrict: 'A',
      link: function(scope, element, attrs)
      {
        element.bind
        (
          'click',
          function()
          {
            alert(attrs.alertable);
          }
        );
      }
    };
  }
);

问题是在Javascript中某些关键字的解释器执行自动分号插入。上面代码段落中的“返回”语句是发生这种情况的一种情况。如果返回后的'{'与返回的行在同一行，则代码将执行，否则将失败。

换句话说，Javascript和Go一样，是这些语言中的一种，尽管它们受限制，但它也依赖于空格，只是空格的存在与否足以使代码无法编译。

在Javascript中，为此能够在同一列上正确对齐大括号的最佳解决方法是什么？

Answer 1

简答：不要使用匿名对象文字作为返回值，而是将其绑定到名称。这不是JavaScript ASI会为您编写字符的唯一情况，但它可能是最常见的情况。因此，您的原始代码只需稍作修改即可正常工作：

app.directive
(
  'alertable',
  function()
  {
    var foo = 
    {
      restrict: 'A',
      link: function(scope, element, attrs)
      {
        element.bind
        (
          'click',
          function()
          {
            alert(attrs.alertable);
          }
        );
      }
    };
    return foo;
  }
);

FWIW，我是一名JavaScript开发人员，有时会通过emscripten移植C / C ++代码，我发现在经过多年的K＆amp; R之后很难阅读GNU风格。

Answer 2

正如你所说，在JavaScript中你必须内联返回语句。

return 
{
    ...
}

将被解释为：

return;
{        /********
    ...  * Error *
}        ********/

真正的解决方案是停止＆＃34;抵制＆＃34;到JavaScript synthax（很酷，我发誓！），但也许你会发现这种语法更具可读性：

app.directive
(
  'alertable',
  function()
  {
    let result = { // set result
      restrict: 'A',
      link: function(scope, element, attrs)
      {
        element.bind
        (
          'click',
          function()
          {
            alert(attrs.alertable);
          }
        );
      }
    };
    return result; // return it
  }
);

Answer 3

要最小化代码中的更改量，只需在return之后添加返回变量赋值。

app.directive
(
  'alertable',
  function()
  {
    return result = 
    {
      restrict: 'A',
      link: function(scope, element, attrs)
      {
        element.bind
        (
          'click',
          function()
          {
            alert(attrs.alertable);
          }
        );
      }
    }
  }
);

Answer 4

这是因为javascript智能（或不那么聪明）预测分号位置，因此解释时的上述代码如下所示：

app.directive
(
  'alertable',
  function()
  {
    return; // <---- Notice the semicolon being inserted automatically.
    {

基本上，您的功能正在输入，并立即退出。

人们有不同的编码风格。许多语言都可以让您通过代码的外观获得创意，但遗憾的是，javascript不是其中一种语言。

如何在JavaScript中正确对齐大括号？

4 个答案: