Getter returning the function instead of "return" value

Question

Im trying to use getters and setters for a project in javascript, I'm getting a json from a jquery get and im setting the value with a setter, I can alert the content in the setter function, so I know that everything is okay, but when I try to return a value with a getter, I got the function instead of the value.

My code is

function _bd() {
  this.setJson = function(js) {
    json = js;
  }
  this.getJson = function() {
    return json;
  }
}
bd = new _bd();
$.get("json.php", function(data) {
  bd.setJson(data);
},"json");

alert(bd.getJson);

the last alert returns

function () {
    return json;
}

also, using prototype does the same result.

`bd.getJson` is a function...so it's displaying exactly what's expected. Maybe you need to call it by using `bd.getJson()`. Also, you probably don't want to use `json = js;` (inside of `setJson`) without declaring `var json;` inside of your `_bd` function to make it local to each instance. Then again, that may not be your intention — Ian, Jul 12 '13 at 17:56
You are not using getters nor setters at all. Read https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters. — Oriol, Jul 12 '13 at 18:01
@Oriol These work just the same, that's not important/relevant — Ian, Jul 12 '13 at 18:04
Where's `json` declared? You appear to not understand how variable declaration works in JavaScript. — Šime Vidas, Jul 12 '13 at 18:05
Even if you were calling `bd.getJson` properly, you are calling it before the response was received. Please read [How to return the response from an AJAX call?](http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-ajax-call). — Felix Kling, Jul 12 '13 at 18:06
@Ian But they aren't getters/setters. They are just functions (methods), so asker should call them with parentheses, like you said. — Oriol, Jul 12 '13 at 18:06
This is a getter and a setter, maybe this is not a conventional firefox/javascript-like getter and setter. — Mete, Jul 12 '13 at 18:07
@Oriol They are getters and setters, but not literally. There *should* be a property in the "class"...these two functions **get** and **set** the value. That was my only point — Ian, Jul 12 '13 at 18:10

Thomas · Answer 1 · 2013-07-13T10:56:02.380

I agree with the previous comments. Invoke the getter-function to retrieve the "json" value.

Probably you want to declare the json variable as well (unless you need it globally of some sorts).

Also, you seem to mixing and matching some object construction patterns. The functional pattern, to simulate "private" vars inside a closure (like json), but you also need the prototypical inheritance, so you can attach the getter/setters to this inside the construtor function. Is it possible to stick to one?

E.g.: trapping privates in closure.

 function _bd() {
   var json;
   var that = {};
   that.setJson = function(js) {
     json = js;
   }
   that.getJson = function() {
    return json;
   } 
   return that;
 } 
 var bd = _bd();
 $.get("json.php", function(data) {
   bd.setJson(data);
   alert(bd.getJson());
 },"json");

E.g. OO style, with constructor function.

function BD(){
  this._json = null;
}
BD.prototype = {
  getJson: function(){
    return this._json;
  },
  setJson: function(json){
    this._json = json;
  }
};

 var bd = new BD();
 $.get("json.php", function(data) {
   bd.setJson(data);
   alert(bd.getJson());
 },"json");

There can be good reasons to use a hybrid style, but it helps if you stick with one approach or the other.

As for "real" getters (IMHO, not worth the insane syntax), try:

function BD(){
   this._json = null;
}
Object.defineProperty(BD.prototype,"json",{
    get: function(){
       return this._json;
    },
    set: function(json){
       this._json = json;
    }
});

var bd = new BD();
bd.json = {a: "test"}; 
console.log(bd);

score 1 · Accepted Answer · answered Jul 12 '13 at 18:07

1

As stated in the comments :

alert( bd.getJson() );

you are getting the string display of the function because you are not invoking the function

before the response come back, you'll get nothing.. probably undefined.

$.getJson
(
   success : function() { alert( bd.getJson() ); }
);

answered Jul 12 '13 at 18:07

Brett Weber

1,839
18
22

4

`$.getJSON` is asynchronous, so you wouldn't get the desired result anyway. – Felix Kling Jul 12 '13 at 18:07
You're right, skippied over that detail looking for the obvious answer. – Brett Weber Jul 12 '13 at 18:09

Getter returning the function instead of "return" value

2 Answers2