Is it bad practice for parameters through a sequence of functions?

Question

im creating a fairly large JS application, and I wanted to get your opinion on some logic. I would like to know if the bad practice in question can pass a parameter through a string of functions, for example.

function start(){ var param1 = 'me'; secondFunction(param1); } function secondFunction(param1){ //i dont want to user the param in this function $.ajax('url',data,success(){ third(param1); }); } function third(param1){ alert(param1); } 

I guess the alternative is to use global varialbes as shown below. But in my case, I already have a ton of global variables, and, in my opinion, some things are not important enough for the global operation of the application.

 var param1; function start(){ param1 = 'me'; secondFunction(); } function secondFunction(){ //i dont want to user the param in this function $.ajax('url',data,success(){ third(); }); } function third(){ alert(param1); } 

As you would say, passing parameters through more than one function is okay or should I do it differently?

thanks

Answer 1

Actually, this is a good practice, because it avoids any global state (that is, ideally, the behavior of a function depends only on its parameters).

If you have many parameters that will be passed in this way, I would combine them together into a separate object (the "environment" object), but other than that it is completely beautiful.

Performing this method gives you great flexibility - if you want the function to work with different data once, you would just pass different values, and not change the global state, which could affect everything else (The absence of such global side effects makes it easy parallelize functions, even if it’s not so important for JavaScript).

Answer 2

It is much better to pass parameters through several functions that use global variables.

For example, it allows you to start a process several times without messing up the global state.

Answer 3

In short, I would stick with passing variables to avoid scope conflicts and keep the simultaneous calls working correctly. However, I would change the format in which you pass them:

Because JavaScript is so flexible with objects, I like to have one all-encompassing parameter for functions that may require several parameters. This improves visibility when calling a function, simplifies the extension of the function to support additional parameters and additional parameters, and in your case, simplifies the transfer of parameters to additional functions in the chain. The only drawback is the longer function calls, but I find it worth it. For instance:

 /** * .. * * params.test1 Test 1 does blah * params.test2 Test 2 does blah 2 * params.test3 Test 3 does blah 3 * params.test4 Test 4 does blah 4 */ function test(params){ //Initialize Parameters var test1 = params.test1; var test2 = params.test2; //function code .. test2(params); .. } /** * .. * * params.test1 Test 3 does blah 3 * params.test2 Test 4 does blah 4 */ function test2(params){ var test3 = params.test3; var test4 = params.test4; //function code using test3 and test4 .. } //Call the test function test({test1: 'foo1', test2: 'foo2', test3: 'foo3', test4: 'foo4'}); 

Answer 4

I see nothing wrong with any style. The preference method is here, really.

The only drawback of globals is that they remain in memory for the life of the application.

Answer 5

javascript has a special path to scope variables, in the first example you define param1 at the beginning, so all threads and functions that were called in and in the context of the initial functions have the param1 "inherit" variable for call at some point. therefore, all operators used outside the beginning do not have the param1 variable. Therefore, you need to use this area of ​​variables only when you need to use a variable in a stream or a series of called functions.

the second example uses the global scope of the variable, which means that the variable is used with a global value no matter what thread you called, this only applies if you have not defined param1 inside another context.

it depends on what you do triyng, in the above example mosst's efficiency is second

Answer 6

This is a rather difficult question to answer, since it all depends on the task.

The reason for passing a parameter to each function is that you can reuse functions for other purposes or in a different order. In this situation, you definitely want to pass a parameter.

If the other two functions are used only for the first function, then creating a function / object that wraps things up would be a good approach.

 var ObjectName = { var param = null; function mainFunc(p) { pararm = p; func2(); } function func2() { // Use "param" func3(); } function func3() { // Use "param" } } // At this level of the code, the param variable is out of scope. 

Answer 7

Too many global variables is a bad idea: you will lose information about what-to-serve-what.

Too many parameters in a function is a bad idea: it will be difficult to confuse / difficult to remember which parameters go with which functions.

At first you can think about your design first.

Grouping them by object, as suggested by Alexander Gessler, is a good idea.

Another idea is to create a different area for your function / variables ... (not necessarily in the object). Functions in functions, if you prefer.

Answer 8

Something like this would be good for you.

 var cakes = function() { // Sets a varable called param1, will use it in the prototype below this.param1 = 'i like cakes'; // Calls the init prototype, setup below. this.init(); }; cakes.prototype = { init: function() { // this.param1 is set above. console.log(this.param1); $.ajax({ // For example I'm just passing back the page which this javascript is in, so something returns url: window.location.href, // _this stores the full object, so you can get it in the callback below. _this: this, // success calls the ajaxCallback function, below success: this.ajaxCallback }); }, ajaxCallback: function() { // this here refers to the ajax call console.log(this); // this._this refers to the original object, captured above. console.log(this._this); // this._this.param1 refers to the text set above. console.log(this._this.param1); } }; // Make sure you include this or it won't work var x = new cakes(); // or you could just do this if you are only planning on using one instance of this object on a page. // new cakes(); 

Answer 9

Don't be afraid to use private variables, here is a quick jsbin example . This may not correspond to what you need, but it is important to remember that you do not always choose between global and parameter. There are many options in between.

 var MyNamespace = function () { // private variable var myPrivateVariable = 'me'; // private methods var secondFunction = function () { }; // return an object, this becomes MyNamespace return { // expose a method called start start: function (arg1) { // take the arg and assign it to a private myPrivateVariable = arg1; // call a private variable, we can only call / access privates from within the returned object assigned to MyNamespace secondFunction(); }, // expose a method called third third: function () { // alert out our private variable alert(myPrivateVariable); } }; } (); // here we're assigning the result of this function call to MyNamespace and closing around all the privates // Usage: MyNamespace.start('me'); MyNamespace.third(); 

Answer 10

Passing a parameter end-to-end is the smartest and actually the only possible way if you have an ajax asynchronous call. You cannot guarantee that a global variable can be overwritten by another start () call until ajax calls the first start () callback.