最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

Calling member function from Javascript constructor - Stack Overflow

programmeradmin9浏览0评论

I am running into the following issue which has really got me stumped:

I have

function SystemList(UID)
{
  this.refreshData();
}

SystemList.prototype.refreshData = function()
{
  this.systemDataObj({}, $.proxy(this.readSuccess, this));
}

When I try and run this, I get the following error: Uncaught TypeError: Object # has no method 'refreshData' within the constructor.

Anyone have an idea why this is failing? To my eye it looks like it should be working.

Edit:

Example of how I create an instance:

function UserMiniProfile(UID)
{
  this.UID = UID;
  this.systemList = new SystemList(this.UID);
  this.htmlID = 'user-'+this.UID+'-profile';
}

I am running into the following issue which has really got me stumped:

I have

function SystemList(UID)
{
  this.refreshData();
}

SystemList.prototype.refreshData = function()
{
  this.systemDataObj({}, $.proxy(this.readSuccess, this));
}

When I try and run this, I get the following error: Uncaught TypeError: Object # has no method 'refreshData' within the constructor.

Anyone have an idea why this is failing? To my eye it looks like it should be working.

Edit:

Example of how I create an instance:

function UserMiniProfile(UID)
{
  this.UID = UID;
  this.systemList = new SystemList(this.UID);
  this.htmlID = 'user-'+this.UID+'-profile';
}
Share Improve this question edited Jun 24, 2010 at 5:02 nazbot asked Jun 24, 2010 at 4:29 nazbotnazbot 1,6972 gold badges17 silver badges23 bronze badges 4
  • Added an example of how I create the obj. – nazbot Commented Jun 24, 2010 at 5:04
  • 1 Are you sure that you're using the SystemList constructor after augmenting its prototype?? – Christian C. Salvadó Commented Jun 24, 2010 at 5:09
  • works for me: jsbin.com/ebasa/edit – nickf Commented Jun 24, 2010 at 5:10
  • for someone landed this page, if you forgot new you would face similar error because this is not your object but something else. Maybe it's only me making a silly mistake... – Kenji Noguchi Commented Jul 1, 2015 at 20:11
Add a comment  | 

2 Answers 2

Reset to default 14

I think you're probably running into the issue of how and when function declarations vs. step-by-step code (what the spec calls statement code) happen.

Code like this will fail in the way you describe, for instance:

var obj = new Thingy("Fred");

function Thingy(name) {
    this.setName(name);
}

Thingy.prototype.setName = function(name) {
    this.name = name;
};

...because you're calling the constructor before adding the setName function to the prototype. Note that calling the constructor before its declaration is just fine, it's just because the constructor is using a function that's set up later by the statement code that there's a problem. The order in which the JavaScript interpreter will try to process that code is:

  1. Create the function Thingy and make it available to the scope.
  2. Execute the var obj = .... line, calling the constructor.
  3. Execute the constructor's code (which in this case throws an exception because there's no this.setName function).
  4. Execute the Thingy.prototype.setName = ... line. (If no exception had been thrown in the last step, that is.)

These steps happen for each script block (first the function declarations are done, then the statement code is executed in order), and even though the above example is fairly obvious, when you start putting together pieces from various different locations, you can create this situation less obviously.

The solution, obviously, is to make sure you're not constructing the object before you've set up the setName property:

function Thingy(name) {
    this.setName(name);
}

Thingy.prototype.setName = function(name) {
    this.name = name;
};

var obj = new Thingy("Fred");

...and again, the above is fairly obvious, but it's possible to create these situations rather less obviously in the real world.

My suspicion is that this is what's happening in your case. It's easy to prove: Using a debugger like Firebug on Firefox, VS.Net or the Script Debugger for IE, Chrome's DevTools, etc., put a breakpoint on the SystemList.prototype.refreshData = ... line and a breakpoint on the line where you're doing your new SystemList(...) and see which one executes first.

Here are a couple of fiddles demonstrating the issue: This one fails in the constructor, this one succeeeds.

You need to assign your class first:

SystemList = function(UID)
{
  this.refreshData();
}

SystemList.prototype.refreshData = function()
{
  this.systemDataObj({}, $.proxy(this.readSuccess, this));
}
发布评论

评论列表(0)

  1. 暂无评论