Область действия переменных JS - внутренняя функция

Question

Область действия переменных JS - внутренняя функция

0

Здравствуй

    <h2 id="h2">click me </h2>
    <p class="shirt"> </p>

    var test = "reddish";  // Global scope ??
    var hm;

    console.log(test); //value is 'reddish' here 

    function red(test) // passing 'reddish'
    {
    var reddy= "blue"; // local scope - using this another var produces blue shirt 
    console.log(test);  // i dont understand how it is 0 here 
    hm =test + "shirt";  
    return hm;
    }


    $(function(){
      $('#h2').click(function(){
         $('.shirt').html(red);

      });
    });

Я пытаюсь напечатать "Красную рубашку" внутри

,

Но значение теста становится "0" внутри функции red();

Также, когда я объявляю переменную внутри функции red() (например, reddy..), она корректно используется как синяя.

Поэтому я хотел бы знать, какую ошибку я делаю, и как я могу пройти тест в функцию как есть.

благодаря

Spdexter 03 май 2014, в 13:22

Источник

Теги:

javascript

jquery

4 ответа

Ещё вопросы

Felix · Answer 1 · 2014-05-03T08-36-00.000Z

Вам нужно передать test переменную в свою red функцию, поэтому используйте:

$('.shirt').html(red(test));

вместо:

$('.shirt').html(red);

Обновленный скрипт

Спасибо ! понял! не могли бы вы сказать, почему значение переменной 'test' становится нулевым внутри функции red ()?

Guffa · Answer 2 · 2014-05-03T08-25-00.000Z

Вы передаете ссылку функции на метод html, поэтому функция будет вызываться для каждого элемента с двумя параметрами; индекс элемента в объекте jQuery и текущий HTML-код элемента.

Это то же самое, что и цикл через элементы в объекте jQuery и вызов функции для каждого из них, чтобы получить HTML-код для ввода элемента:

var j = $('.shirt');
for (var i = 0; i < j.length; i++) {
  j.eq(i).html(red(i, j.eq(i).html()));
}

Поскольку функция принимает один параметр, это будет индекс элемента в объекте jQuery, в этом случае нуль, поскольку существует только один элемент.

Параметр test в функции не то же самое, что и переменная test в глобальном масштабе. Поскольку вы назвали их одинаковыми, параметр будет затенять глобальную переменную для кода внутри функции.

Чтобы заставить параметр test получить значение из test глобальной переменной, вам нужно вызвать функцию с этим значением:

$('.shirt').html(red(test));

suneetha · Answer 3 · 2014-05-03T09-38-00.000Z

Вы не передаете какое-либо значение параметра для функции "красный". Так что оно принимает значение теста как "0". Если вы передадите какое-либо значение, оно будет печатать это значение вместо "0".

Код:

<!DOCTYPE html>
<html>
 <head>
  <script type="text/javascript" src="jquery.js"></script>
 </head>
 <body>
  <h2 id="h2">click me </h2>
  <p class="shirt"> </p>
      <script type="text/javascript">
         var test = "reddish"; // Global scope ??
         var hm;
         console.log(test);
         function red(test) {
           var reddy = "blue"; // local scope - using this var produces blue shirt 
           console.log(test);
           hm = test + "shirt";
           return hm;
        }


     $(function() {
       $('#h2').click(function() {
         $('.shirt').html(red(test));
       });
     });
  </script>
 </body>
</html>

JS Fiddle: http://jsfiddle.net/NZBNW/2/

Amir Popovich · Answer 4 · 2014-05-03T08-32-00.000Z

Ваш код с небольшим пояснением

var test = "reddish";  // Global scope - the var is saved on the window.
console.log(test); // same as console.log(window.test)
function red(test) // you declared a function with an input param named test. this is not the same test.

console.log(test);  // test is nothing in this case since you called the red function with no param.

Измените вызов на:

        $('.shirt').html(red(test)); // call function red with the correct input param.