From 4da2fdbdea0578e6fcbf58dae5ec224fc11db970 Mon Sep 17 00:00:00 2001 From: "Mark S. Everitt" Date: Tue, 12 Nov 2013 10:30:29 +0000 Subject: [PATCH] Updated for personal use up to line 455. --- README.md | 233 +++++++++++++++++++++++++----------------------------- 1 file changed, 109 insertions(+), 124 deletions(-) diff --git a/README.md b/README.md index 7f57340f79..b2ee6add25 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,8 @@ -# Airbnb JavaScript Style Guide() { +# Qubyte's personal style guide -*A mostly reasonable approach to JavaScript* +This guide is for my personal use, and has been derived from the [airbnb sytle guide](airbnb/javascript). If you find +yourself working with me on a project, and I am the lead developer or otherwise in the senior role for a JavaScript code +base, then I may have pointed you to this document. ## Table of Contents @@ -47,8 +49,8 @@ + `undefined` ```javascript - var foo = 1, - bar = foo; + var foo = 1; + var bar = foo; bar = 9; @@ -61,8 +63,8 @@ + `function` ```javascript - var foo = [1, 2], - bar = foo; + var foo = [1, 2]; + var bar = foo; bar[0] = 9; @@ -88,14 +90,14 @@ ```javascript // bad var superman = { - default: { clark: 'kent' }, - private: true + default: { clark: 'kent' }, + private: true }; // good var superman = { - defaults: { clark: 'kent' }, - hidden: true + defaults: { clark: 'kent' }, + hidden: true }; ``` @@ -104,17 +106,17 @@ ```javascript // bad var superman = { - class: 'alien' + class: 'alien' }; // bad var superman = { - klass: 'alien' + klass: 'alien' }; // good var superman = { - type: 'alien' + type: 'alien' }; ``` **[[⬆]](#TOC)** @@ -147,13 +149,13 @@ - When you need to copy an array use Array#slice. [jsPerf](http://jsperf.com/converting-arguments-to-an-array/7) ```javascript - var len = items.length, - itemsCopy = [], - i; + var len = items.length; + var itemsCopy = []; + var i; // bad for (i = 0; i < len; i++) { - itemsCopy[i] = items[i]; + itemsCopy[i] = items[i]; } // good @@ -164,10 +166,15 @@ ```javascript function trigger() { - var args = Array.prototype.slice.call(arguments); - ... + var args = Array.prototype.slice.call(arguments); + ... } ``` + + When this happens in Node.js, it's usually to turn an `arguments` object into an array. Since it will be such a small + modification, I expect the ES6 `Array.from` enhancement to be added to V8 some time within the next year. As soon as + this is available in a Node stable branch. Probably later, *rest parameters* from ES6 may also be added, at which + point these should be used instead of `arguments`. **[[⬆]](#TOC)** @@ -190,7 +197,7 @@ var fullName = 'Bob ' + this.lastName; ``` - - Strings longer than 80 characters should be written across multiple lines using string concatenation. + - Strings longer than 100 characters should be written across multiple lines using string concatenation. - Note: If overused, long strings with concatenation could impact performance. [jsPerf](http://jsperf.com/ya-string-concat) & [Discussion](https://github.com/airbnb/javascript/issues/40) ```javascript @@ -208,54 +215,53 @@ // good var errorMessage = 'This is a super long error that ' + - 'was thrown because of Batman.' + - 'When you stop to think about ' + - 'how Batman had anything to do ' + - 'with this, you would get nowhere ' + - 'fast.'; + 'was thrown because of Batman.' + + 'When you stop to think about ' + + 'how Batman had anything to do ' + + 'with this, you would get nowhere ' + + 'fast.'; ``` - When programatically building up a string, use Array#join instead of string concatenation. Mostly for IE: [jsPerf](http://jsperf.com/string-vs-array-concat/2). ```javascript - var items, - messages, - length, - i; - - messages = [{ - state: 'success', - message: 'This one worked.' - },{ - state: 'success', - message: 'This one worked as well.' - },{ - state: 'error', - message: 'This one did not work.' - }]; - - length = messages.length; + var messages = [ + { + state: 'success', + message: 'This one worked.' + }, + { + state: 'success', + message: 'This one worked as well.' + }, + { + state: 'error', + message: 'This one did not work.' + } + ]; // bad function inbox(messages) { - items = ''; } // good function inbox(messages) { - items = []; + var items = []; + var length = messages.length; - for (i = 0; i < length; i++) { - items[i] = messages[i].message; - } + for (var i = 0; i < length; i++) { + items.push(messages[i].message); + } - return ''; + return ''; } ``` @@ -269,17 +275,17 @@ ```javascript // anonymous function expression var anonymous = function() { - return true; + return true; }; // named function expression var named = function named() { - return true; + return true; }; // immediately-invoked function expression (IIFE) (function() { - console.log('Welcome to the Internet. Please follow me.'); + console.log('Welcome to the Internet. Please follow me.'); })(); ``` @@ -296,10 +302,11 @@ // good var test; + if (currentUser) { - test = function test() { - console.log('Yup.'); - }; + test = function test() { + console.log('Yup.'); + }; } ``` @@ -308,12 +315,12 @@ ```javascript // bad function nope(name, options, arguments) { - // ...stuff... + // ...stuff... } // good function yup(name, options, args) { - // ...stuff... + // ...stuff... } ``` @@ -327,8 +334,8 @@ ```javascript var luke = { - jedi: true, - age: 28 + jedi: true, + age: 28 }; // bad @@ -342,12 +349,12 @@ ```javascript var luke = { - jedi: true, - age: 28 + jedi: true, + age: 28 }; function getProp(prop) { - return luke[prop]; + return luke[prop]; } var isJedi = getProp('jedi'); @@ -368,97 +375,75 @@ var superPower = new SuperPower(); ``` - - Use one `var` declaration for multiple variables and declare each variable on a newline. + - Use one `var` per variable for multiple variables. Commas are a common source of errors, so avoid them everywhere that they are not required. ```javascript // bad - var items = getItems(); - var goSportsTeam = true; - var dragonball = 'z'; - - // good var items = getItems(), goSportsTeam = true, dragonball = 'z'; - ``` - - - Declare unassigned variables last. This is helpful when later on you might need to assign a variable depending on one of the previous assigned variables. - - ```javascript - // bad - var i, len, dragonball, - items = getItems(), - goSportsTeam = true; - - // bad - var i, items = getItems(), - dragonball, - goSportsTeam = true, - len; - + // good - var items = getItems(), - goSportsTeam = true, - dragonball, - length, - i; + var items = getItems(); + var goSportsTeam = true; + var dragonball = 'z'; ``` - - Assign variables at the top of their scope. This helps avoid issues with variable declaration and assignment hoisting related issues. + - Assign variables when declare them, or above branchs that need them. If you do not know the term 'hoisting', then you should stop coding and familiarise yourself with the concept. ```javascript // bad function() { - test(); - console.log('doing stuff..'); + test(); + console.log('doing stuff..'); - //..other stuff.. + //..other stuff.. - var name = getName(); + var name = getName(); - if (name === 'test') { - return false; - } + if (name === 'test') { + return false; + } - return name; + return name; } // good function() { - var name = getName(); + var name = getName(); - test(); - console.log('doing stuff..'); + test(); + console.log('doing stuff..'); - //..other stuff.. + //..other stuff.. - if (name === 'test') { - return false; - } + if (name === 'test') { + return false; + } - return name; + return name; } // bad function() { - var name = getName(); + var name = getName(); - if (!arguments.length) { - return false; - } + if (!arguments.length) { + return false; + } - return true; + return true; } // good function() { - if (!arguments.length) { - return false; - } + if (!arguments.length) { + return false; + } - var name = getName(); + var name = getName(); - return true; + return true; } ``` @@ -481,17 +466,17 @@ // variable hoisting. Note: the assignment // value of `true` is not hoisted. function example() { - console.log(declaredButNotAssigned); // => undefined - var declaredButNotAssigned = true; + console.log(declaredButNotAssigned); // => undefined + var declaredButNotAssigned = true; } // The interpreter is hoisting the variable // declaration to the top of the scope. // Which means our example could be rewritten as: function example() { - var declaredButNotAssigned; - console.log(declaredButNotAssigned); // => undefined - declaredButNotAssigned = true; + var declaredButNotAssigned; + console.log(declaredButNotAssigned); // => undefined + declaredButNotAssigned = true; } ```