Разные способы написания функции, приносящей нежелательные эффекты в JavaScript? - PullRequest
Новая
       40

Разные способы написания функции, приносящей нежелательные эффекты в JavaScript?

2 голосов
/ 01 февраля 2012

UPDATE:

ВОПРОС РЕШЕН! Я понял, что причина этого в «подъеме». По сути, интерпретатор JavaScript анализирует код и объявляет все переменные (но не инициализирует их) в начале функции. Вот почему вторые примеры не работают. Поскольку интерпретатор JavaScript объявляет var changed; в начале функции, но не инициализирует его , пока не достигнет тела кода.

Для объявления функции , как в первом примере, вместо того, чтобы JavaScript двигался вверх только на имя переменной, как во втором примере, он перемещается вверх (или «поднимает») вверх по всей функции в начале родительской функции, поэтому она работает!

Во всяком случае, я написал это для личного ознакомления и спасибо за ответы ...

Этот работает: http://jsbin.com/emarat/7/edit

$(function(){
  $name = $('#test');
  $name.change(changedName);

  function changedName (e){
      console.log('e: ', e); 
      console.log('e.currentTarget: ', e.currentTarget); 
      console.log('$(e.currentTarget).val(): ', $(e.currentTarget).val());
      $('#test-display').text($(e.currentTarget).val());
    }
});

но это не так: http://jsbin.com/emarat/9/edit

$(function(){
  $name = $('#test');
  $name.change(changed);

  var changed = function(e){
      console.log('e: ', e); 
      console.log('e.currentTarget: ', e.currentTarget); 
      console.log('$(e.currentTarget).val(): ', $(e.currentTarget).val());
      $('#test-display').text($(e.currentTarget).val());
    };
});

Почему?

Ответы [ 3 ]

4 голосов
/ 01 февраля 2012

Последний эквивалентен: 

$(function(){
  var changed;
  $name = $('#test');
  $name.change(changed);

  changed = function(e){
      //...
    };
});

, что делает очевидным, почему это не работает. На момент использования переменная changed еще не инициализирована (undefined).

Но если вы объявите функцию с использованием синтаксиса function yourFunctionName(), она будет доступна во всей области . (Который в JavaScript является родительской функцией.) В противном случае было бы невозможно использовать функции до их объявления. Это называется подъем .

Смотри также:

0 голосов
/ 01 февраля 2012

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

Это будет работать: 

$(function(){
  var changed = function(e){
      console.log('e: ', e); 
      console.log('e.currentTarget: ', e.currentTarget); 
      console.log('$(e.currentTarget).val(): ', $(e.currentTarget).val());
      $('#test-display').text($(e.currentTarget).val());
  };

  $name = $('#test');
  $name.change(changed);
});

http://jsbin.com/emarat/11/edit

0 голосов
/ 01 февраля 2012

Поскольку переменная определяется после ее использования.

var a = 1;
var c = a + b;
var b = 2;

Вы не ожидаете, что этот код будет выполняться.

...