Category Archives: JavaScript

4 Keys to a Clean Angular Implementation

tldr

  1. Modify all model properties in the controller rather than the view; let the view have access to the capability via controller functions.
  2. Keep all magic values (if you must have them at all) in the controller accessing them in the view via controller functions.
  3. Evaluate all comparison, computation, and logical expressions in the controller, giving the view access to them via controller functions.
  4. Pass to a controller function only what it does not already know: the loop parameter if in a loop, or no parameters at all if outside of a loop.

4 Keys to a Clean Angular Implementation

The Friendship Algorithm in JavaScript

I’m a big fan of The Big Bang Theory and I couldn’t resist playing around with Sheldon’s friendship algorithm. It’s pretty much one object represented as Sheldon guided by the module pattern (thanks to Addy Osmani).

I encourage you to fork this code and get some zen coding in. Since the logic is “safely” protected by Sheldon, you should be able to integrate any boilerplate of your choice for some fun interfaces. Also, feel free to refactor the logic when needed. It could always be better. That said, kudos to Wolowitz for plotting out the loop counter and escape.

The Friendship Algorithm

You can also view the demo here, here.

Chase down rogue console.log(); statements

Find console.log(); statements line-by-line by loading this JavaScript snippet to the top of your code (the higher the better):


['log', 'warn'].forEach(function(method) {
  var old = console[method];
  console[method] = function() {
    var stack = (new Error()).stack.split(/\n/);
    // Chrome includes a single "Error" line, FF doesn't.
    if (stack[0].indexOf('Error') === 0) {
      stack = stack.slice(1);
    }
    var args = [].slice.apply(arguments).concat([stack[1].trim()]);
    return old.apply(console, args);
  };
});

Be sure to remove this before entering production!

Thanks to, Remy Sharp.

What’s an Object in JavaScript?

Almost everything is an object.

  • Primitives: numbers, booleans, strings, null, undefined
  • Objects: Math, Date, JSON, window, document, objects you create, array, function, numbers, booleans, strings

Functions are “first class” values.

  • Assign a function to a variable.
  • Store a function as a value in an array or object.
  • Pass a function to a function.
  • Return a function from a function.

Primitives don’t look like objects.


var phoneNumber = "555-1212";	//phoneNumber is a primitive.
console.log(phoneNumber.length);//Now we need phoneNumber to be an object.
/*********************
*	BEHIND THE SCENES
*
*	phoneNumber is converted to a string object.
*	.length property is then accessed
*	
**********************/	
console.log(phoneNumber);		//phoneNumber is a primitive again.

Dos and Don’ts in JavaScript

Best Practices:

  • Choose short but readable variable names.
  • Avoid global variables.
  • Use only one global object to encapsulate any global variables you really need.
  • Always use var to declare your variables.
  • Indent your code so it’s readable.
  • Use curly braces to define blocks of code.
  • Comment your code.
  • Always use semi-colons.
  • Be aware of where automatic semi-colon insertion happens.
  • Declare variables outside loops.
  • Reduce DOM operations.