javascript closure, not working? - javascript

I have a function that I call to retrieve a sliding pane (telerik splitter control)
I thought I could use this function
function getZone() {
var slidingZone = $find("<%= slidingZone.ClientID %>");
return function () { return slidingZone; };
}
so that it didn't have to "find" the sliding zone every time. But it doesn't work.
This does...
function getZone() {
var slidingZone = $find("<%= slidingZone.ClientID %>");
return slidingZone;
}
Can you tell me why the first one isn't working?
BTW, I'm using it like this....
function hideTreePane() {
var paneId = "<%= slidingPane.ClientID %>";
getZone().undockPane(paneId);
return true;
}

Because your returning a function and you need to evaluate it...
If using the first function this may work..
function hideTreePane() {
var paneId = "<%= slidingPane.ClientID %>";
var zoneFunc = getZone();
zoneFunc().undockPane(paneId);
return true;
}

You will need to call the function you are returning from getZone:
getZone()().undockPane( paneId );
It wasn't working because the function getZone itself does not have a member called undockPane.
EDIT:
I think it would be better to do this:
function getZone() {
if ( getZone.cache === undefined )
getZone.cach = $find("<%= slidingZone.ClientID %>");
return getZone.cache;
}
Then you would call like this:
getZone().undockPane( paneId );

Well, the first function, returns a function, and you want the inner function to be executed.
If you invoke the result of it you will see it work, e.g.:
getZone()();
I think you want the following, use an immediately executed anonymous function, to call the $find method only once, storing its result:
var getZone = (function() {
var slidingZone = $find("<%= slidingZone.ClientID %>");
return function () { return slidingZone; };
})();

In your first example you're returning a function, therefore getZone() becomes a function itself and you need to do getZone()() to get the slidingZone value you want.
There's no need to wrap your return value in a function for this case.

You're returning a function from the first example, not a value. You'd need to evaluate the function for it to work. Try something like.
var slidingZone;
function getZone() {
if (!slidingZone) {
slidingZone = $find( ... );
}
return slidingZone;
}
It would be better for this to be part of a "class" so that the caching variable isn't in the global scope.

Related

Pass return value of function into variable using .on("load")

I have a function declared in this way:
function myFunction () {
var something = 0;
return something;
};
This function is called upon loading of a specific item in this way:
item.on("load", myFunction);
Initially, I considered doing this, but the function is not defined at the time that the item loads (it causes 'Uncaught ReferenceError: myFunction is not defined':
var mySomething = (function myFunction () {
var something = 0;
return something;
})();
item.on("load", myFunction); //ReferenceError happens here
console.log(mySomething);
How can I pass the information returned from the function into a variable? I would like to be able to use the variable 'mySomething' further down the line (illustrated by the print statement in this case).

JS Function returning function for later use - arguments undefined

I am trying to create a function that can then return many functions based on an input. Here is an example of the problem I am facing.
var giveFunction = function(text) {
return function(text) {
console.log(text)
}
}
var test = giveFunction('this is a test');
test()
Running test() at the end prints undefined instead of 'this is a test.' Is there any way around this problem?
The inner function should not contain any parameter,
var giveFunction = function(text) {
return function() {
console.log(text)
}
}
Let it create a closure. If it has a parameter then that would be read during execution and undefined would be printed as you are not calling that function with any arguments.
If you want your code to be working then you have to use bind for that,
var giveFunction = function(text) {
return function(text) {
console.log(text)
}.bind(null, text)
}
var test = giveFunction('this is a test');
test(); //'this is a test'
Lets go one step further and ask why?
var outerFunction = function(outerParameter) {
return innerFunction function(innerParameter) {
// in here we have access to anything in this function and the outer function
// all the way to out the the global scope
// therefore, we dont need to pass innerParameter in again as a parameter! ( in your case we 'next')
}
/// now over here, outside of innerFunction, we do NOT have access to innerParameter!
}
So applying the above principles to your code we have:
var giveFunction = function(text) {
return function() {
console.log(text)
}
}
var test = giveFunction('this is a test');
test()
which now works!
Finally, checkout the most upvoted post under the javascript tag:
How do JavaScript closures work?

Watching a function

In javascript I know we can watch for a property change, but is it possible to watch a function?
If I had a function that evaluates to a boolen
function eval(value) {
return value == 1;
}
Would it be possible to continuously evaluate this function until true?
I know setTimeout could work, but that seems like a hack. Is there a better way?
There are two main possible ways, the first is yours, the setTimeout. The second is a setInterval:
var checkEval = setInterval(function(){eval(value)},1000);
And you could end it using:
clearInterval(checkEval);
replace the function with a wrapper
function something(){
return value==1;
}
(function(window){
var oldSomething = window.something;
window.something = function(){
var result = oldSomething.apply(null,arguments);
if(result===true){
//do what you need
}
return result;
};
})(window);

jQuery function it does not get called

Hello everyone hope you are well.
I am trying to call a function in my jQuery file and for some reason it doesn't get called if I call it from an if statement. However the same function gets called for when I call it using .click().
The if statement works fine.
Here is my jQuery code.
$(document).ready(function () {
var hello = 1;
if (hello == 1) {
console.log("True");
helloWorld();
} else {
console.log("False");
}
$('#en').click(helloWorld(pathname));
function helloWorld() {
return function () {
console.log("function called");
}
});
});
You're using
var hello==1;
instead of
var hello=1;
When assigning hello variable, you test it if it is equal to 1, not assigning 1 to variable. Just try with:
var hello = 1;
Your function return another function, if you want to call it, this is the correct way:
helloWorld()();
Or
var myFunc = helloWorld();
myFunc();
Your declaration in variable is wrong.
var hello=1;

How to use a return value in another function in Javascript?

I'm self-teaching myself JavaScript and out of curiosity I'm wondering what is the proper way of returning a value from one function to be used in another function. For example:
function firstFunction() {
// do something;
return somevalue
}
So how do I set up the second function to use somevalue? Thanks.
Call the function and save the return value of that very call.
function firstFunction() {
// do something
return "testing 123";
}
var test = firstFunction(); // this will grab you the return value from firstFunction();
alert(test);
You can make this call from another function too, as long as both functions have same scope.
For example:
function testCase() {
var test = firstFunction();
alert(test);
}
Demo
You could call firstFunction from secondFunction :
function secondFunction() {
alert(firstFunction());
}
Or use a global variable to host the result of firstFunction :
var v = firstFunction();
function secondFunction() { alert(v); }
Or pass the result of firstFunction as a parameter to secondFunction :
function secondFunction(v) { alert(v); }
secondFunction(firstFunction());
Or pass firstFunction as a parameter to secondFunction :
function secondFunction(fn) { alert(fn()); }
secondFunction(firstFunction);
Here is a demo : http://jsfiddle.net/wared/RK6X7/.
Call function within other function :
function abc(){
var a = firstFunction();
}
function firstFunction() {
Do something;
return somevalue
}
You can do this for sure. Have a look below
function fnOne(){
// do something
return value;
}
function fnTwo(){
var strVal= fnOne();
//use strValhere
alert(strVal);
}
var captcha = '';
//function name one
function one(captcha){
var captcha = captcha;
//call another function and pass variable data
var captcha = firstFunction(captcha);
};
// second function name
function firstFunction(captcha){
alert(captcha);
}
To copy the return value of any javascript(in chrome console), we can use inbuilt copy() method.
you can use any expression, function, etc
find some examples below
using expresseion
a = 245;
copy(a);
using function
a = function() {
return "Hello world!"
}
copy(a());
Official Doc for reference

Categories