How to concisely assign and immediately invoke a function variable?

The following is a method for defining an anonymous function within a closure, invoke the function, and forget it:

(function () { "do stuff"; })();

This is used to maintain a limited scope without adding bulk to the script (IIFE: Immediately-Invoked Function Expression).

What if you're hoping to immediately execute a function, while still retaining the function for future use, like the following:

var doThing;
(doThing = function () { "do stuff"; })();

This works in the browsers I've tested (Chrome, FF, IE8, IE10), but this does not pass JSLint (Bad Invocation). Are there any compatibility issues with doing it this way?

Is there a way of accomplishing this that is looked kindly upon by JSLint?

Answers


If passing jslint is absolutely necessary then:

var doThing;
(doThing = function () { "do stuff"; }).call();

should do the job.


A slight reordering of your code will help.

var doThing = function () { "do stuff"; };
doThing();

or

var doThing = function () { "do stuff"; };
(doThing)();

You should not assign a function reference and invoke the function at the same time. This kind of thing would easily cause heads to explode, as it would add to the already existing possibilities of assigning a variable to a reference, assigning a variable to a return, or assigning a variable to the result of an assignment. The way to do so anyone else would be able to read your code would be to do it in 2 lines. If you want to wrap that in a function it would be something like:

var doThing = (function() {
  var inner = function() {
     //doThing body
  };
  inner();
  return inner;
})();

That by itself buys you nothing but obfuscation over doing it the simple way since the invocation wouldn't stick around regardless. You could however, if you really wanted create a function that does this:

var callAndRef = function(funk) {
  funk();
  return funk;
};

and then

var doThing = callAndRef(function() {
//doThing body
});

or if you were feeling even fancier and have JS gurus working with you, you could throw it on to the Function.prototype and chain it off the declaration. You can also pepper in call/apply to maintain the this reference and arguments (but it seems like that would just be noise for your present question).

All of this should be done with extreme prudence it's certainly not worth going this route to save yourself having to type a couple extra lines of one command each.


If you only want to fix the Bad Invocation problem you can do this:

var doThing;
doThing = function () { "do stuff"; };
doThing();

By splitting the declaration and assignment you make your code easier to understand and to maintain. Another option is to declare a function with a name:

function doThing() { "do stuff"; }
doThing();

JSLink is Crawford's personal opinion on how Javascript should be written. Most of it is excellent advice, but sometimes his opinion seems to get into the way.

This is the more "standard" way to write that line:

var doThing = (function () { "do stuff"; }());

Note the whole (function ...) is inside the parens.


Need Your Help

Set option element as selected based on two queries

php html

I am trying to figure out how to mark a dropdown option as selected by checking it's value, but the value is coming from another query.

how can i append a new <td> to nth <tr> using jquery?

javascript jquery html dynamic

im trying to create a tic-tac-toe board dynamically using a nested loop, i got this much:

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.