CODEWITHSUNDEEP
javascriptconstructorlocal-storageundefinedgetter
Cedric Jansen
Cedric Jansen

Reputation: 47

JavaScript object property returns undefined

I've looked through many threads already, googled a lot and tried to fix this problem on my own, but I can't. I'm trying to break down my problem.

I'm receiving a String stored in the local Storage. 

var c = localStorage.getItem('item');

Then I'm passing this value into a constructor to assign this value to an object's property. This is the class and the constructor.

class dataSet {
    constructor ( item ) {
      this.item = item;
    }

    get item() {
      return this._item;
    }

With the help of a button, I call the following function on click:

function buildSet() {
    var currentSet = new dataSet( c );
    document.write(currentSet.item);
    document.write(c);
}

The document.write(c) is just a test to see if there is any value stored, and yes, my 'test' string is stored. As a result, I get:

undefinedTest

I'm very new to JavaScript, I know that somehow the dataSet object did not get the value and didn't assign it, but I have no idea left, how to fix it. I literally read every existing thread for this topic on stackoverflow but could not come up with a solution. Thank you for you time.

Upvotes: 0

Views: 1803

Answers (3)

Prince Hernandez
Prince Hernandez

Reputation: 3721

lets do some checks and see the behaviour of your code, because it works as expected, the only thing is that you are missing some checks and some characters.

//make sure that C has a value, maybe it is undefined from here.
var c = "fakeItem";
// also lets do a test with an undefined value. 
var d;

class dataSet {
  constructor(item) {
    this._item = item;
  }

  get item() {
    //you were missing a _ here.
    return this._item;
  }
}

function buildSet() {
  var currentSet = new dataSet(c); //this works because C is defined
  var dSet = new dataSet(d); //this does not work because D is not defined
  // it works as expected!
  console.log(currentSet.item);
  document.write("currentSet.item:    " + currentSet.item);
  document.write("\n<br>");
  document.write("c:                  " + c);
  document.write("\n<br>");
  // also works as expected, it will show undefined
  console.log(dSet.item);
  document.write("dSet.item:          " + dSet.item);
  document.write("\n<br>");
  document.write("d:                  " + d);

}
<button onclick="buildSet()">SET TEST</button>

Upvotes: 0

Alejandro Riera
Alejandro Riera

Reputation: 501

As someone has commented to you before, the problem here is because you are missing a _ in the constructor. But if this doesn't solve your problem, maybe the problem is related to the value of the item in localStorage. Here you have an example of your code working with a simple String:

var c = 'hello world';
class dataSet {
  constructor (item) {
    this._item = item;
  }
  get item () {
    return this._item;
  }
}
function buildSet() {
  var currentSet = new dataSet(c);
  alert(currentSet.item);
  alert(c);
}
<!DOCTYPE html>
<html>
<body>
  <button onclick="buildSet()">click me</button>
</body>
</html>

Upvotes: 1

Kristianmitk
Kristianmitk

Reputation: 4778

Your error is within the constructor!

You are missing a _

It should be this._item = item; instead of this.item = item;

Thus your getter, i.e:

get item() {
  return this._item;
}

returns undefined as there is no _item property...

Upvotes: 6

Related Questions