var User = {
    Name: "Some Name", Age: 26,
    Show: function() { alert("Age= "+this.Age)}; 
};

function Test(fn) {
    fn();         
}

Test(User.Show);

===============

Alert shown by code is "Age= Undefined". I understand as User.Show function is called from inside of Test(), refers 'this' of 'Test()' function rather than 'User' object. My question is if there is any way to solve this problem?

var User = {
    Name: "Some Name", Age: 26,
    Show: function() { alert("Age= "+this.Age)}; 
};

function Test(fn) {
    fn();         
}

Test(User.Show);

===============

Alert shown by code is "Age= Undefined". I understand as User.Show function is called from inside of Test(), refers 'this' of 'Test()' function rather than 'User' object. My question is if there is any way to solve this problem?

• javascript
• scope

Share Improve this question Follow edited Jun 1, 2015 at 22:21 Brian Tompsett - 汤莱恩 5,8937272 gold badges6161 silver badges133133 bronze badges asked Nov 25, 2009 at 18:10 Praveen PrasadPraveen Prasad 32.1k2020 gold badges7676 silver badges106106 bronze badges

Add a ment  | 

6 Answers 6

Sorted by: Reset to default 7

The way to solve this problem is to pass in the object you're scoping "this" to, inside of the Test function...

function Test(fn, scope, args) {
    fn.apply(scope, args);
}

Test(User.Show, User, []);

Where the args array allows you to additionally pass in any arguments you may have. You could also leave the Test function as it is and just pass in an anonymous function...

Test(function() {User.Show()});

One way to get it to execute on the scope of User is to pass your Test function a scope.

function Test(fn, scope) {
    fn.apply(scope || window);
}

This will apply the passed function to the passed scope, or window if no scope was passed.

Test(User.Show, User) would alert Age= 26.

You could also do this:

Test(User.Show.bind(User));

Considering that to use the other suggestions you'd still have to pass the scope as the parameter, like:

function Test(fn, scope) {
    fn.apply(scope || window);
}

Test(User.Show, User)

The alternative seems reasonable and easier.

Also, you might find this article interesting:

Scope in JavaScript

It explains the kind of issue you're facing as well as ways to get around it.
Much better than anything I could possibly write here as an answer :)

You have 2 mistakes. 1st is your semicolon should be moved inside of the } but the code should be function() { alert("Age= "+User.Age);} if you want to call it the way you are and have it show the age.

Another way using call()

var User = {
    Name: "Some Name", 
    Age: 26,
    Show: function() { alert("Age= "+this.Age);} 
};

function Test(fn,obj) {
    fn.call(obj);         
}

Test(User.Show, User);

You may find John Resig's Learning Advanced JavaScript slideshow interesting, particularly the section on context

var User = {
    Name: "Some Name", 
    Age: 26,
    Show: function() { alert("Age= "+User.Age)}
};

function Test(fn) {
    fn();
}
Test(User.Show);

ps! refers 'this' of 'Test()' function rather than 'User'

No - in fact 'this' points to the window-object