4. “There are only two hard
things in Computer Science:
cache invalidation and
naming things.”
Tim Bray (quoting Phil Karlton)
5. Naming things
Variable names should be nouns
Function names should begin with a verb,
E.g. isValid(), hasItems(),
getProduct()
Avoid difficult to understand names,
E.g. arrUqFolders
6. Logical names
Requires commenting
var resBackup = function(loc) {
…
});
Improve your function and variables names
var restoreBackupTo =
function(destination) {
…
});
7. Add style to your code
• Indent your code correctly
• Comment your code only if it adds value
/**
* @method getList
* @param {Object} options
* @return {Object}
**/
var getList = function(options) {
}
8. Use blocks instead of one-liners
When Becomes
if a() if a()
b(); b();
c();
It looks like But really means
if a() { if a() {
b(); b();
c(); }
} c();
9. Use of spaces
Nice Less readable
if (found) { if(found) {
// good // bad
} }
function a() {…} function a () {…}
app.config.folder; app. config. folder;
10. Semicolon insertion
Good Bad
var good = function() { var bad = function ( )
return { {
sum: 12 return
}; {
} sum: 12
};
}
> good(); > bad();
{ sum: 12 } undefined
12. Faithful triplets === and !==
Always use `===` for equals and `!==` for
not-equals when you do comparisons
if (a === 5 && b !== 10) {
// feeling much better
}
13. Friendly parameters
Instead of large parameter lists
var address = build(f, l, c, s);
Use objects
var address = build({
first: f,
last: l,
city: c,
state: s
});
14. Augmenting Types
String.prototype.pluralize = function() {
return this + "s";
};
> "car".pluralize() // "cars"
You don’t own Object, Array, RegExp,
String, Number, Boolean, Date, Function
16. Global Scope
var message = “Wakanda”;
function greet() {
console.log(message + “ is great!”);
}
> message
“Wakanda”
> greet()
“Wakanda is great!”
17. Local Scope
function greet(what) {
var message = what;
console.log(message + “ is great!”);
}
> message
undefined
> greet(“Wakanda”)
“Wakanda is great!”
> message
undefined
18. Mixing scope
var outer = function() {
var a = 4, b = 5;
var inner = function() {
var b = 7, c = 11;
a = b + c;
};
console.log(a);
inner();
console.log(a);
};
19. Returning functions
var setup = function() {
var count = 0;
return function() {
return (count += 1);
}
}
// usage
var next = setup();
next(); // 1
next(); // 2
count // undefined
20. “A closure is a function
defined within another scope
that has access to all the
variables within the outer
scope.”
Tim Caswell
21. Consider this example…
/*
* jsfiddle.net/TnaMW
*/
var div = document.getElementById('div');
for (var i = 0; i < 10; i++) {
var link = document.createElement('a');
link.setAttribute('href', '#');
link.innerHTML = i + ' ';
link.onclick = function() { alert(i); };
div.appendChild(link);
}
// 0 1 2 3 4 5 6 7 8 9
22. …works with a Closure
/*
* jsfiddle.net/kxy5t
*/
var div = document.getElementById('div');
for (var i = 0; i < 10; i++) {
var link = document.createElement('a');
link.setAttribute('href', '#');
link.innerHTML = i + ' ';
link.onclick = function(k) {
return function() { alert(k); }
}(i);
div.appendChild(link);
}
// 0 1 2 3 4 5 6 7 8 9
23. Self-invoking functions
var person = function() {
// private
var name = "Juergen";
// public
return {
getName : function() {return name;},
setName : function(newName) {name = newName;}
};
}();
> person.name // undefined
> person.getName(); // ”Juergen"
> person.setName("Dan");
> person.getName(); // ”Dan"
Form follows function is a principle associated with modern architecture and industrial design in the 20th century. The principle is that the shape of a building or object should be primarily based upon its intended function or purpose.
Imagine you have to come back to your code in a month and you don’t know what the hell you were doing just by reading your code
You should always prefer block quotes instead of using one liners
Use K&R style braces `}` at the end of a structural block, because it matters! Modifying the previous code to use Allman style braces would look like this. The code on the right is broken
What is Git?
Because setup wraps the returned function, it creates a closure, and you can use that closure to store some private data, which is only accessible by the private function but not to the outside code.