2010-11-23 5 views
0
<HTML> 
    <HEAD> 
     <SCRIPT LANGUAGE="JavaScript"> 
     function Peon(number) { 
      this.number = number; 

      this.inc = function() { 
       number=number+1; 
      }; 

      return true; 
     } 
     var p=new Peon(10); 

     function returnNumber() { 
      p.inc(); 
      alert(p.number); 
     } 
     </SCRIPT> 
    </HEAD> 
    <BODY> 

     <INPUT id="b00" TYPE="button" Value="Click" onClick="returnNumber()"> 

    </BODY> 
    </HTML> 

이 코드는 의도 한대로 작동하지 않습니다. 여기"this"가없는 자바 스크립트 객체의 변수에 액세스

this.number=this.number+1; 

은, 사소한 선택을 작성하지 않고도 그러나이 있지 않는 더 큰 코드에서 작동 할 수있는 방법이 있나요. *이 더 많은 읽을 수 있도록합니다. 가능한가?

답변

2

당신은 number "개인"할 수 있습니다,하지만 당신은 게터 필요 : 그래서 그 대신, 당신은 다음과 같이 정의 할 수 있습니다

function Peon(number) { 
     var number = number; 

     // increment 
     this.inc = function() { 
      number++; 
     }; 

     // a simple getter 
     this.getNumber = function() { 
      return number; 
     } 
    } 
    var p = new Peon(10); 
    p.inc(); 
    alert(p.getNumber()); 

당신은 더글러스 Crockfords "좋은 부품을 읽어야을 "이 패턴을 사용하는 방법에 대한 자세한 내용은 Google Books에서 사용할 수있는 미리보기가 있습니다 (제한적).

또한 생성자에서 무언가를 반환 할 필요가 없으므로 return true은 불필요합니다.

+2

Crockford의 개인 회원 패턴은 그의 웹 사이트 http://javascript.crockford.com/private.html에서 읽을 수있다. 당신이 많은 Peons를 가지게된다면이 private 멤버 패턴은 속성을 사용하는 것보다 훨씬 더 많은 메모리를 소비한다는 것을 알아 두는 것이 중요합니다 ** 왜냐하면 각각의 개별 객체는 두 함수 모두의 * 자신의 복사본을 가질 것이기 때문입니다 생성자 내에서 정의됩니다. 그것들은 객체간에 공유되거나 공유 될 수 없습니다. 따라서 프라이버시와 메모리 사용 간의 절충이 필요합니다. 메모리 소비는 IE와 Firefox의 주요 문제입니다. 당신이 단지 몇 개의 Peons를 가질 것이라면, 그것은 중요하지 않습니다. –

+0

감사합니다, 이것은 내가 찾고 있던 것입니다. –

+0

'return true'은 실제로 생성자의 끝에서 불필요하고 본질적으로 무시되지만 원시 객체가 아닌 객체를 반환하면 무시되지 않고 새로운 객체가 아닌 객체를 반환합니다. Peon' 개체. –

0

는별로,하지만이 보조 노트로, 당신은 페온의 생성자 외부 .inc 선언 더 나을 것,

this.number++ 

사실 좀 더 간결하다. 프로토 타입으로이 작업을 수행 할 수 있습니다. 그런 식으로 inc 함수는 Peon 유형의 객체를 만들 때마다 재구성되지 않습니다.

Peon.prototype.inc = function(){ 
    this.number++; 
} 

또는 대신 당신이 p.number++을 할 수 p.inc()를 사용

. 이 키워드를 피할 수있는 유일한 방법입니다. 내가 일을 볼 수

0

유일한 읽을 수있는 방법은 다음과 같습니다

this.inc = function() { 
    this.number++; 
}; 

그렇지 않으면 "더 큰 코드"백반, 당신은 같은 것을 할 수있는 :

this.inc = function() { 
    var number = this.number; // obviously simple here. Imagine more complexity 
    number++; 
}; 
+0

죄송하지만 두 번째 제안이 작동하지 않습니다 ... 당신과 @Ivo 모두 –

1

아니오, 당신은 this을 사용하여 this 개체의 속성을 참조해야합니다. JavaScript의 this은 C 또는 Java와 같은 다른 언어에서는 this과 매우 다릅니다. herehere입니다.

코드에서 수행하는 작업은 생성자에서 만든 this.number 속성이 아닌 Peon 생성자 함수로 전달 된 number 인수에 액세스하는 것입니다. 그래서 의도대로 작동하지 않지만 실패하지도 않습니다.

은 BTW, 내 Peon 생성자 함수를 당신의 inc 작업 을 정의 할 이유가 없다, 그리고 좋은 이유 (Peon 통해 생성 된 모든 개별 객체는 자신의 사본이 함수의를 얻을 것이다) 할 수 없습니다.

function Peon(number) { 
    this.number = number; 

    // Don't return values out of constructor functions, it's 
    // an advanced thing to do. In your case, you were returning 
    // `true` which was being completely ignored by the JavaScript 
    // interpreter. If you had returned an object, the `this` object 
    // created for the `new Peon()` call would have been thrown away 
    // and the object you returned used instead. 
} 

Peon.prototype.inc = function() { 
    ++this.number; 
}; 

var p=new Peon(10); 

function returnNumber() { 
    p.inc(); 
    alert(p.number); // alerts 11 
} 
+0

+1. 이 둘의 조합은 전반적으로 훌륭한 해답이됩니다. – Matt

+0

쪽지로 - 왜 this.number ++ 대신 this.number? 나는 그들이 약간 다르게 평가한다는 것을 알고 있지만,이 사용 사례에서는 상호 교환이 가능할 것입니다. this.number ++ 양식을 더 자주 보는 경향이 있기 때문에 궁금합니다. – Matt

+0

@Matt : 제 모국어는 영어입니다. "동사 - 명사"는 "명사 - 동사"보다 훨씬 더 일반적인 음성 패턴이므로 "x ++"("++ x")가 아닌 "increment x" 증가 "('x ++'). 내가 독일 출신의 원어민이라면'x ++ '라고 쓸 것입니다. :-) 대다수의 경우 현실 세계의 차이는 없습니다. (나는 실제 세계를 강조한다. 그렇지 않으면 lurkers가 뛰쳐 나와 미세 최적화를 시도 할 것이기 때문이다.) : –

0

예, 자바 스크립트에서 'this'를 사용할 필요가 없습니다.당신은 대신 폐쇄를 통해 변수에 액세스 할 수 있습니다 '이'

function createPeon(number) { 
 

 
    function inc() { 
 
     number=number+1; 
 
    }; 
 
    function getNumber() { 
 
     return number; 
 
    } 
 

 
    return { inc, getNumber }; 
 
} 
 
var p=createPeon(10); 
 
p.inc(); 
 
alert(p.getNumber());

관련 문제