在没有“this”的情况下访问javascript中对象中的变量

Question

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

<input id="b00" type="button" value="Click" onclick="returnNumber()">

此代码无法按预期工作。有没有办法让它工作而不需要写

this.number=this.number+1;

这里这是一个微不足道的选择，但在更大的代码中，没有 this.* 会使其更具可读性。可以吗？

Answer 1

您可以将

number

设置为“私有”，但是您需要一个 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);

function returnNumber() {
  p.inc();
  alert(p.getNumber());
}

<input id="b00" type="button" value="Click" onclick="returnNumber()">

您应该阅读 Douglas Crockfords 的《The Good Parts》，了解有关如何使用此模式的更多信息，Google Books 有（有限的）预览。

而且你不需要从构造函数返回一些东西，你的

return true

是多余的。

Answer 2

不可以，您必须使用

this

来引用

this

对象上的属性。请注意，JavaScript 中的

this

与其他一些语言（例如 C 或 Java）中的

this

非常不同。更多这里和这里。

您的代码所做的是访问传递到

number

构造函数的

Peon

参数，而不是您在构造函数中创建的

this.number

属性。这就是为什么它不能按预期工作，但也不会失败。

没有理由在

inc

构造函数中定义 Peon 操作

，顺便说一句，并且有一些很好的理由不这样做（通过 

Peon

 创建的每个单独对象都将获得该函数自己的 

copy） 。因此，您可以这样定义它：

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
}

<input id="b00" type="button" value="Click" onclick="returnNumber()">

Answer 3

不是真的，但这更简洁一点

this.number++ 实际上，作为旁注，您最好在 Peon 的构造函数之外声明 .inc。你可以用原型来做到这一点。这样，每次创建 Peon 类型的对象时，inc 函数就不会被重建。

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

或者您可以不使用

p.inc()

 而是使用 

p.number++

。这是我能想到避免使用 this 关键字的唯一方法。

Answer 4

我能看到的唯一可读的方式是：

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

否则，在你的“更大的代码”假设中，你可以这样做：

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

Answer 5

是的，您不需要在 JavaScript 中使用“this”。您可以通过闭包而不是“this”访问变量

function createPeon(number) {

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

  function getNumber() {
    return number;
  }

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

function returnNumber() {
  p.inc();
  alert(p.getNumber());
}

<input id="b00" type="button" value="Click" onclick="returnNumber()">