开发者

Accessing variables in objects in javascript without "this"

开发者 https://www.devze.com 2023-01-26 19:11 出处:网络
<HTML> <HEAD> <SCRIPT LANGUAGE=\"JavaScript\"> function Peon(number) { this.number = number;
  <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 code doesn't work as intended. Is there a way to make it work without having to write

this.numb开发者_StackOverflow中文版er=this.number+1;

Here it is a trivial choice, but in bigger codes not having this.* would make it a lot more readable. Is it possible?


You can make number "private", but then you need a getter:

    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());

You should read Douglas Crockfords "The Good Parts" for more information on how to use this pattern, there's (limited) a preview available at Google Books.

Also you don't need to return something from the constructor, your return true is superfluous.


No, you have to use this to reference properties on the this object. Note that this in JavaScript is very different from this in some other languages, like C or Java. More here and here.

What your code is doing is accessing the number argument that was passed into the Peon constructor function, rather than the this.number property you created in the constructor. Which is why it doesn't work as intended, but doesn't fail, either.

There's no reason to define your inc operation within the Peon constructor function, BTW, and some good reasons not to (every individual object created via Peon will get its very own copy of that function). So instead, you can define it like this:

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
}


Not really, but this is a little more concise

this.number++

Actually, as a side note, you'd be better off declaring .inc outside the constructor of Peon. You could do this with prototype. That way the inc function is not reconstructed each time you create an object of type Peon.

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

Or instead of using p.inc() you could do p.number++. That's the only way I can think of avoiding the this keyword.


The only readable way I can see doing it would be:

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

Otherwise, in your "bigger codes" postulation, you could do something like this:

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


Yes, you do not need to use 'this' in javascript. You can access variables via closure instead of '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());

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号