不确定此js代码在执行Calendar脚本

Question

This bit of code just makes my brain hurt, js is not my strong point

I have tried adapting it, and managed to make the browser crash (endless loop i am guessing)

to me it looks like if window.load != function then create new calendar, otherwise do whatever window.load wants to do, followed by create new calendar

is that correct?

Why would it need to be wrapped in (function() {} ?

(function() {
   var my = function() { new Calendar($option_str).show(); };
   var other = window.onload;
   window.onload = typeof other != 'function' ? my : function() { other(); my(); };
})();

Answer 1

The (function(){})() is an immediately invoked function expression (IIFE). The reason for doing that is to protect the global scope from being polluted by those variable names, and also to make it easier to be garbage collected going forward.

The reason this is possible is because the function expression creates a new execution context for the code executing. This execution context creates its own variable environment which is where the variable my and the variable other reside. The context also has access to the lexical environment which is where window resides.

As for saving the onload callback, checking if it is a function, and then calling what was there along with the new code that is to ensure that the onload function is not overwritten. This can be unfortunate when loading many libraries in the head of the document, and making sure not to step on other people's onload is important.

So basically the reason boils down to a few main aspects

• It makes garbage collection easier
• It avoids polluting the global namespace
• It preserves previous onload events