为什么把这些变量放到函数外面就不工作了

Question

我是一个JavaScript初学者。我有以下内容:

  function countryType() {
    var country = $('#inputCountry').val();
    var visaFreeCountry90 = _.contains(visaFreeCountries90, country);
    var visaFreeCountry30 = _.contains(visaFreeCountries30, country);
    var specificCountry = _.contains(specificCountries, country);
    var specificCountryNIA = _.contains(specificCountriesNIA, country);
    if (visaFreeCountry90) {
      return '<p class="text-success">Visa-free Country 90 days</p>';
    } else if (visaFreeCountry30) {
      return '<p class="text-success">Visa-free Country 30 days</p>';
    } else if (specificCountry) {
      return '<p class="text-warning">Specific Country</p>';
    } else if (specificCountryNIA) {
      return '<p class="text-warning">Specific Country NIA</p>';
    } else {
      return '<p class="text-info">Regular Country</p>';
    }
  }

我想把这些变量放在函数之外:

    var country = $('#inputCountry').val();
    var visaFreeCountry90 = _.contains(visaFreeCountries90, country);
    var visaFreeCountry30 = _.contains(visaFreeCountries30, country);
    var specificCountry = _.contains(specificCountries, country);
    var specificCountryNIA = _.contains(specificCountriesNIA, country);
    function countryType() {
    if (visaFreeCountry90) {
      return '<p class="text-success">Visa-free Country 90 days</p>';
    } else if (visaFreeCountry30) {
      return '<p class="text-success">Visa-free Country 30 days</p>';
    } else if (specificCountry) {
      return '<p class="text-warning">Specific Country</p>';
    } else if (specificCountryNIA) {
      return '<p class="text-warning">Specific Country NIA</p>';
    } else {
      return '<p class="text-info">Regular Country</p>';
    }
  }

但是如果我这样做，if语句就会停止工作。原因是什么?

Answer 1

我认为该函数是在与输入相关的事件上调用的。如果是这种情况，将var country = $('#inputCountry').val();以及与之相关的_.contain调用移到函数内部。

就像现在一样，它运行一次，在用户在输入中输入值之前，因此country是空字符串。

Answer 2

尝试为函数添加参数

    var country = $('#inputCountry').val();
    var visaFreeCountry90 = _.contains(visaFreeCountries90, country);
    var visaFreeCountry30 = _.contains(visaFreeCountries30, country);
    var specificCountry = _.contains(specificCountries, country);
    var specificCountryNIA = _.contains(specificCountriesNIA, country);
    function countryType(visaFreeCountry90, visaFreeCountry30, specificCountry, specificCountryNIA) {
    if (visaFreeCountry90) {
      return '<p class="text-success">Visa-free Country 90 days</p>';
    } else if (visaFreeCountry30) {
      return '<p class="text-success">Visa-free Country 30 days</p>';
    } else if (specificCountry) {
      return '<p class="text-warning">Specific Country</p>';
    } else if (specificCountryNIA) {
      return '<p class="text-warning">Specific Country NIA</p>';
    } else {
      return '<p class="text-info">Regular Country</p>';
    }
  }

Answer 3

如果想在函数内部使用该变量，则将其作为参数传递给函数，如:

function countryType(visaFreeCountry90,visaFreeCountry30,...)

并在函数

Answer 4

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions_and_function_scope#Efficiency_considerations

function outside(x) {
   function inside(y) {
      return x + y;
   }
   return inside;
}
fn_inside = outside(3); 
result = fn_inside(5); // returns 8
result1 = outside(3)(5); // returns 8

保存变量

注意当inside返回时x是如何被保留的。闭包必须保留它引用的所有作用域中的参数和变量。由于每次调用都可能提供不同的参数，因此为每次外部调用创建一个新的闭包。只有当返回的内部不可访问时，才能释放内存。

这与在其他对象中存储引用没有什么不同，但通常不太明显，因为不直接设置引用，也不能检查它们。