I have the following structure
// script1.js
jQuery(document).ready(function($) {
var somevar;
$('somelem').myPlugin();
});
// script2.js
(function($) {
$.fn.myPlugin = function(options) {
// access and modify 'somevar' here so that it gets modified
// in the function which called a plugin
};
});
- I want the 'somevar' variable to get modified by plugin and I would be able to work with already modified variable further in the plugin caller function's scope.
- I do not want to use global variable.
- I see no use of passing the variable as an option to a plugin as it would bee local to a plugin function and modifying would not modify the original variable as I understand.
- I may misunderstand the concept of how javascript works, so any answer appreciated.
I have the following structure
// script1.js
jQuery(document).ready(function($) {
var somevar;
$('somelem').myPlugin();
});
// script2.js
(function($) {
$.fn.myPlugin = function(options) {
// access and modify 'somevar' here so that it gets modified
// in the function which called a plugin
};
});
- I want the 'somevar' variable to get modified by plugin and I would be able to work with already modified variable further in the plugin caller function's scope.
- I do not want to use global variable.
- I see no use of passing the variable as an option to a plugin as it would bee local to a plugin function and modifying would not modify the original variable as I understand.
- I may misunderstand the concept of how javascript works, so any answer appreciated.
- Javascript scope can be quite plicated and I don't use Jquery, but to me it looks like the somevar variable has local scope as it's contained within an anonymous function and you've instantiated it with 'var'. – James Commented Dec 8, 2011 at 10:11
- @jayp Sure, it's local. That actually is a problem the question is about. I do not want to make it global. Making it global solves the question, but, as I can see, causes a memory leak in IE, because 'somevar' conatains a large amount of data in my real script and IE doesn't seem to manage it right. – noname Commented Dec 8, 2011 at 10:28
- 1 Have a look at this -> stackoverflow./questions/1830496/… – Manse Commented Dec 8, 2011 at 10:30
- 1 You could create a class, create an instance of the class and then use that to contain somevar and your other data. That way the global scope won't be polluted and you will be able to access the class properties / methods from wherever you like. The class itself will have to be accessible globally, though. – James Commented Dec 8, 2011 at 10:31
- ManseUK - that is a nifty workaround. – James Commented Dec 8, 2011 at 10:31
4 Answers
Reset to default 3When you pass a primitive type, it is passed by value. But, if you pass an object then it'll pass by reference. So, you can do that -
jQuery(document).ready(function($) {
var somevar = {val: 5};
$(document).myPlugin(somevar);
alert(somevar.val);
});
// script2.js
(function($) {
$.fn.myPlugin = function(options) {
options.val ++;
// access and modify 'somevar' here so that it gets modified
// in the function which called a plugin
};
})(jQuery);
see the live demo :: http://jsfiddle/rifat/EdRFm/
you could create a singleton class for your global variables.
You could let the plugin function return a value and assign that to somevar
somevar = $('someelem').myPlugin();
Or you could pass an callback as parameter to your plugin method
// Script 1
var somevar;
$('someelem').myPlugin(function(newValue) {
somevar = newValue;
});
// Script 2
$.fn.myPlugin = function(callback) {
...
callback(newValueForSomeVar);
}
You can write function that will set value from variable and then call she in another script.
//script1.js
var somevar;
function setSomevar(value){
somevar = value;
}
function getSomevar(){
return somevar;
}
jQuery(document).ready(function($) {
$('somelem').myPlugin();
});
Now you can call function setSomevar and pass the value to variable. I hope that helps. Best Regards.