Problem with callback function pointers [Archive]

VR2

07-07-2006, 10:07 AM

My problem is with passing a method of an object and losing the "context" parent object...(you can see why I struggle on google with this...)

This is what I mean..

<HTML>
<BODY>
<SCRIPT>
// Object Definition
function Person(sName)
{
// Properties
this.Name = sName;
// Methods
this.SayHello = function()
{
alert("Hello, my name is " + this.Name);
};
}

// Create instance of person
var player = new Person("Kevin");
player.SayHello(); // Works OK

// Function to run a function....
function PassCallback(ptrFunc)
{
// Just run the passed function
ptrFunc();
}

// This will display "Hello, my name is undefined"
PassCallback(player.SayHello);
</SCRIPT>
</BODY>
</HTML>

So it seems that by passing the function pointer all instance variables that were available to the "SayHello" method (this.Name for example) have gone up in smoke.

Up until now I've overcome this by simulating "Interfaces", like this

// Function to run a function....
function PassObjInterface(obj)
{
// The object we passed HAD BETTER support the SayHello() method, else we're in trouble!
if (!obj.SayHello)
{
alert("Object passed does not support an Interface that includes a SayHello method");
return;
}
obj.SayHello();
}

But I'd really like to know how to pass a function pointer to another method or function, to be used as a callback, WITHOUT losing the object instance data when the callback function is executed.

Any takers?

VR2

07-07-2006, 12:52 PM

Aha, nevermind I've solved it:

For info:

<HTML>

<head>

<style type="text/css">



</style>

</head>

<BODY>

<SCRIPT>

// Object Definition

function Person(sName)

{

// Properties

this.Name = sName;

// Methods

this.SayHello = function(sRecipient)

{

alert(this.Name + " says: Hello " + sRecipient + ", my name is " + this.Name);

};

this.Flirt = function(sRecipient)

{

alert(this.Name + " says: So, " + sRecipient + " do you come here often? <wink />");

};

this.MakeDate = function(sRecipient, theDay)

{

alert(this.Name + " says: Let me have your number, " + sRecipient + " and I'll give you a ring about " + theDay);

};

this.SayBye = function(sRecipient)

{

alert(this.Name + " says: Well nice speaking to you, " + sRecipient + ". Goodbye now.");

};

}

function SpeakToFriend(ptrFunc)

{

var sFriendName = document.getElementById("FriendName").innerHTML;

var sDateDay = document.getElementById("DateDay").innerHTML;

// Just run the passed function, all we know is that it accepts one or two strings parameter

ptrFunc(sFriendName, sDateDay);

}

function RunTest()

{

// Get var to start with

var sYourName = document.getElementById("YourName").innerHTML;

var sFriendName = document.getElementById("FriendName").innerHTML;

// Create instance of person

var player = new Person(sYourName);

// Call method the easy way...

player.SayHello(sFriendName); // Works OK, says hello to friend

alert("Wrong...");

SpeakToFriend(player.SayHello);

alert("Wrong...");

SpeakToFriend(function(){player.SayHello()});

alert("Wrong...");

SpeakToFriend(function(){player.SayHello("Freddy")});

alert("The next 4 calls actually work correctly!");

SpeakToFriend(function(s){player.SayHello(s)});

SpeakToFriend(function(s){player.Flirt(s)});

SpeakToFriend(function(x, y){player.MakeDate(x, y)});

SpeakToFriend(function(sendParam){player.SayBye(sendParam)});

alert("And finally, this one fails because the param names do not match...,\n\r\n\r...so obviously the rule is, that they must!");

try

{

SpeakToFriend(function(sendParam){player.SayHello(getParam)});

}

catch (e)

{

alert(e.message);

}

}

</SCRIPT>

<TABLE class="stdText" ID="Table1">

<TR><TD>Your Name: </TD><TD class="inputText"><SPAN contenteditable=true id="YourName">Kevin</SPAN></TD></TR>

<TR><TD>Your Friend's Name: </TD><TD class="inputText"><SPAN contenteditable=true id="FriendName">Andy</SPAN></TD></TR>

<TR><TD>Day of Date: </TD><TD class="inputText"><SPAN contenteditable=true id="DateDay">Saturday</SPAN></TD></TR>

<TR><TD> </TD><TD onclick="RunTest()" class="stdText">Go</TD></TR>

</TABLE>

</BODY>

</HTML>