In this example, I have incorporated the best practices, and used special naming conventions, so that the code is organized, and set for scalability.
Explanation of what each line does
line:1 = this is a self invoking function, while passing a parameter of the window.jQuery object; all functions and variables here will be closed off from the outer scope.
line:82 = on window ready, the MyComponent.init(); public method of the MyComponent will be called.
line:11 = this will be the declaration of the Module.
line:13 = this is where the Constants will be used throughout the Module; here you can include the data-arribute names, HTML element classNames, modifier classnames, etc…
line:20 = this is where the Module level variables will be saved;
variables like $myComponent, with $ as prefix, means that these variables are holding Jquery objects.
variables like pingUrl, with no $, means that these variables are holding standard data.
line:30 = notice the init() function has no under_scores like the other function. No under_score in the function name means that this is a public function.
line:31 = DO NOTHING, do not run any code when the HTML element is NOT on the page.
line:32-34 = set Jquery objects and other types of data to the variables, declaration on line 20.
line:36 && line:37 = here we register the open and close button.
functions with the under_scores, means that this is a private function.
functions with the without under_scores, means that this is a public function, and public functions should be exposed in line:76, from the return statement.
line:45 = _registerOpenButton(), private function; this cannot be called outside of the Module.
line:57 = _registerCloseButton(), private function; this cannot be called outside of the Module.
line:69 = _makePingCall(), private function; this cannot be called outside of the Module.
line:76 = this return declaration is used to reveal public methods that can be called by the self invoking function. In this case, only the init() function is public.
Read Full Blog
Please use this thread to ask the related questions.