CODEWITHSUNDEEP
javascriptfunctionvariablesscope
user251919
user251919

Reputation:

Javascript Scope and local variables

I'm really not sure if this is possible in Javascript. Here's my function:

var tree = function(name, callback) {
  if (this.name) {
    this.name.push(name)
    print(this.name)
  } else {
    this.name = []
  }
  callback()
}

I'd like to use it as follows and print out the hierarchy:

tree("john", function() {
  tree("geoff", function() {
    tree("peter", function() {
      tree("richard", function() {
      })
    })
  })
  tree("dave", function() {
  })
})

Here's the desired output:

// ['john']
// ['john', 'geoff']
// ['john', 'geoff', 'peter']
// ['john', 'geoff', 'peter', 'richard']
// ['john', 'dave']

but unfortunately I'm getting

// ['john', 'geoff', 'peter', 'richard', 'dave']

for the last function call. Is there a way to get the desired outcome?

Kind regards

Adam Groves

Upvotes: 1

Views: 318

Answers (2)

ilovefigs
ilovefigs

Reputation: 776

The reason why the last line is printing all the names is because this.names is never removing the names that are being added to it. You're just appending names onto it. So when the function call is made 

callback()

with the value 

function() {
  tree("richard", function() {
})

this.names = ['john', 'geoff', 'peter'] and after the call this.names = ['john', 'geoff', 'peter', 'richard']. So now when you call 

tree("dave", function() {
});

this.names is still ['john', 'geoff', 'peter', 'richard'].

Try the following instead, and notice I changed this.name to this.names to make is easier to read.

var tree = function(name, callback) {
  if (!this.names) {
    this.names = [];
  }
  this.names.push(name);
  print(this.names);
  callback();
  this.names.pop();
}

Upvotes: 2

Upperstage
Upperstage

Reputation: 3757

I'm not certain what callback does, but you should probably use apply() or call() when you invoke it.

callback.apply( this, arguments );

Upvotes: 1

Related Questions