Immediately-Invoked Function Expression (IIFE) / (jQuery Self Executing Closure Pattern) and other useful javascript snippets

script.js

// “self-executing anonymous function” (or self-invoked anonymous function) 

// Reference: http://stackoverflow.com/questions/188663/jquery-javascript-design-self-executing-function-or-object-literal

;(function($) {     
   
    var myPrivateFunction = function() {
    };

    var init = function() {
        myPrivateFunction();
    };

    $(init);    

})(jQuery);

// http://benalman.com/news/2010/11/immediately-invoked-function-expression/

// Immediately-Invoked Function Expression (IIFE)

// Either of the following two patterns can be used to immediately invoke
// a function expression, utilizing the function's execution context to
// create "privacy."

(function(){ /* code */ }()); // Crockford recommends this one

(function(){ /* code */ })(); // But this one works just as well


// Pactpub.KnockoutJS.Starter.Nov.2012

// Define the namespace
window.myApp = {};

(function(myApp) {
  // Product Constructor Function
	function Product() {
		var self = this;
		// "SKU" property
		self.sku = ko.observable("");
		// "Description" property
		self.description = ko.observable("");
		// "Price" property
		self.price = ko.observable(0.00);
		// "Cost" property
		self.cost = ko.observable(0.00);
		// "Quantity" property
		self.quantity = ko.observable(0);
	}
	// add to our namespace
	myApp.Product = Product;
}(window.myApp));

// Usage
// create an instance of the Product class
var productA = new myApp.Product();
// "set" the 'sku' property
productA.sku('12345')
// "get" the 'sku' property value
var skuNumber = productA.sku();

// Products ViewModel
(function(myApp) {
	// constructor function
	function ProductsViewModel() {
		var self = this;
		// the product that we want to view/edit
		self.selectedProduct = ko.observable();
	}
	// add our ViewModel to the public namespace
	myApp.ProductsViewModel = ProductsViewModel;
}(window.myApp));


// http://skilldrick.co.uk/2011/04/closures-explained-with-javascript/
function f(x) {
    function g() {
        return x;
    }
    return g;
}

//Tell f to create a new g
var g5 = f(5);

//g5 is a function that always returns 5
alert(g5());

//Tell f to create another new g
var g1 = f(1);

//g1 is a function that always returns 1
alert(g1());



function person(name) {
    function get() {
        return name;
    }
    
    function set(newName) {
        name = newName;
    }
    
    return [get, set];
}

var getSetDave = person('Dave');
var getDave = getSetDave[0];
var setDave = getSetDave[1];

alert(getDave()); //'Dave'

setDave('Bob');

alert(getDave()); //'Bob'


var getSetMary = person('Mary');
var getMary = getSetMary[0];
var setMary = getSetMary[1];

alert(getMary()); //'Mary'

jQuery equivalent of JavaScript's addEventListener method
http://stackoverflow.com/questions/2398099/jquery-equivalent-of-javascripts-addeventlistener-method

As of jQuery 1.7, .on() is now the preferred method of binding events, rather than .bind():

From http://api.jquery.com/bind/:

As of jQuery 1.7, the .on() method is the preferred method for attaching event handlers to a document. For earlier versions, the .bind() method is used for attaching an event handler directly to elements. Handlers are attached to the currently selected elements in the jQuery object, so those elements must exist at the point the call to .bind() occurs. For more flexible event binding, see the discussion of event delegation in .on() or .delegate().
The documentation page is located at http://api.jquery.com/on/