JavaScript参数关键字和多个参数... args

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (75)

我的代码有些问题。在这里,我将展示我的代码的两个版本,但其中一个不起作用。

使用该arguments关键字的代码无效:

$(document).ready(function(){
  var data = {
    'one':'b',
    'two':'c',
    'three':'d'
  }
  function func(){
    for(var i=0;i<arguments.length;i++){
      $('.a').each(function(){
        if($(this).hasClass(data[arguments[i]])){
          $(this).css('background','red')
        }
      })
    }
  }
  func('one','two')
})

body{
  margin:0;
  pading:0;
  height:100vh;
}
.a{
  height:50px;
  width:50px;
  background:green;
  margin:20px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="a"></div>
<div class="a b"></div>
<div class="a c"></div>

但是当我使用rest参数时...val,一切都很完美:

$(document).ready(function() {
  var data = {
    'one': 'b',
    'two': 'c',
    'three': 'd'
  }

  function func(...val) {
    for (var i = 0; i < val.length; i++) {
      $('.a').each(function() {
        if ($(this).hasClass(data[val[i]])) {
          $(this).css('background', 'red')
        }
      })
    }
  }
  func('one', 'two')
})

body {
  margin: 0;
  pading: 0;
  height: 100vh;
}

.a {
  height: 50px;
  width: 50px;
  background: green;
  margin: 20px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="a"></div>
<div class="a b"></div>
<div class="a c"></div>

如何在不使用...val和仅使用arguments关键字的情况下使此代码完美运行 ?

提问于
用户回答回答于

尝试在func()中使用局部var:

    $(document).ready(function(){
      var data = {
        'one':'b',
        'two':'c',
        'three':'d'
      }
      function func(){
        for(var i=0;i<arguments.length;i++){
          var key = arguments[i]
          $('.a').each(function(){
            if($(this).hasClass(data[key])){
              $(this).css('background','red')
            }
          })
        }
      }
      func('one','two')
    })

在原始发布的表单中,嵌套的匿名函数引用了它自己的参数,但意图(正如我解释的那样)是引用调用func()的参数。正如其他人所指出的那样,这是不可能的,因为arguments关键字始终是当前函数的本地关键字。因此,通过向闭包添加一个var(在嵌套的自治函数之外的func(内部)),您可以在嵌套函数内部引用外部参数中的数据的“复制” 。

用户回答回答于

这是因为'arguments'是Javascript中的保留关键字。当你在里面的其他函数里面调用它时,它的上下文会改变.each()。它不像任何其他变量那样将被传递到内部。

如果要实现这一点,则应使用箭头功能。 JS中的箭头功能 希望问题得到解决。

扫码关注云+社区

领取腾讯云代金券