5.2 $(THIS)에 무슨 문제가 있을까?

- this가 콜백함수 안에 들어가면 다 같은 this가 아니다.

$('.clicky').click( function() {

$(this).addClass('clicked'); // 1. click라는 클래스를 가지는 개체 하나하나

setTimeout( function() { 

$(this).removeClass('clicked'); // 2. window 객체 자체

}, 1000 );

});

* 1의 경우
      : 첫번째기본적 구조는 이렇게 만들어진 것이라서, 

function Foo( value ) {

    this.value = value;

}

Foo.prototype.alert = function() {

    alert( this.value );

};

Foo.alert 내부의 this는 Foo 객체이다.

2의 경우
   : 객체 내부의 메서드 호출을 하는것이 아니고, 그냥 함수처럼 호출을 하면 그 내부의 this(즉 setTimeout의 콜백함수)는 window 객체를 참조한다. 그러니까 $(window).removeClass... 이렇게 되는 것이라서, 문제가 생긴다.

=> 이렇게 한다.

$('.clicky').click( function() {

var $element = $(this);

$element.addClass('clicked');

setTimeout( function() {

$element.removeClass('clicked');

}, 1000 );

 });

2의 경우 해결을 위해서 1에서의 this를 지역변수로 지정하여 호출.(closure 지정)