From 9e5bb0096959fa6c0dfe4cbd7d644f84a8098240 Mon Sep 17 00:00:00 2001 From: chalaschek Date: Sat, 1 Nov 2014 12:04:49 -0400 Subject: [PATCH 1/3] Additions from latest airbnb style guide; license added --- README.md | 167 ++++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 161 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 838d1f3611..d9e0bc7fe8 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# JavaScript Style Guide +# Voxa JavaScript Style Guide ###All code in any code-base should look like a single person typed it, no matter how many people contributed.### ###As a general rule of thumb, don't do stupid shit and everything will be ok.### @@ -28,6 +28,7 @@ 1. [Danger Zone](#danger-zone) 1. [Testing](#testing) 1. [Resources](#resources) + 1. [License](#license) ## Types @@ -1324,6 +1325,17 @@ }); ``` + - Use a leading underscore `_` when naming private properties in constructors or classes + + ```javascript + // bad + this.__firstName__ = 'Panda'; + this.firstName_ = 'Panda'; + + // good + this._firstName = 'Panda'; + ``` + - When saving a reference to `this` use `_this`. - **Note:** This is extremely bug prone and should only be done as a last resort. If you find you are having troubles with `this` being set to the wrong context, consider using the `#call`, `#apply` or `#bind` functions, or check the documentation to see if a `thisArg` can be passed into a function call. @@ -1634,6 +1646,68 @@ **[⬆ back to top](#table-of-contents)** + +## jQuery + + - Prefix jQuery object variables with a `$`. + + ```javascript + // bad + var sidebar = $('.sidebar'); + + // good + var $sidebar = $('.sidebar'); + ``` + + - Cache jQuery lookups. + + ```javascript + // bad + function setSidebar() { + $('.sidebar').hide(); + + // ...stuff... + + $('.sidebar').css({ + 'background-color': 'pink' + }); + } + + // good + function setSidebar() { + var $sidebar = $('.sidebar'); + $sidebar.hide(); + + // ...stuff... + + $sidebar.css({ + 'background-color': 'pink' + }); + } + ``` + + - For DOM queries use Cascading `$('.sidebar ul')` or parent > child `$('.sidebar > ul')`. [jsPerf](http://jsperf.com/jquery-find-vs-context-sel/16) + - Use `find` with scoped jQuery object queries. + + ```javascript + // bad + $('ul', '.sidebar').hide(); + + // bad + $('.sidebar').find('ul').hide(); + + // good + $('.sidebar ul').hide(); + + // good + $('.sidebar > ul').hide(); + + // good + $sidebar.find('ul').hide(); + ``` + +**[⬆ back to top](#table-of-contents)** + ## Danger Zone - `#eval`. Do not use it. It is insecure, can be difficult to debug, and is slow. @@ -1656,12 +1730,93 @@ ## Resources - - **Basis for the style guide** - + [Idiomatic.js](https://github.com/rwaldron/idiomatic.js/blob/master/readme.md) - + [airbnb javascript](https://github.com/airbnb/javascript) - + [Crockford's Code Conventions](http://javascript.crockford.com/code.html) - + [Google JS Style Guide](https://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml) + +**Read This** + + - [Annotated ECMAScript 5.1](http://es5.github.com/) + +**Tools** + + - Code Style Linters + + [JSHint](http://www.jshint.com/) - [Airbnb Style .jshintrc](https://github.com/airbnb/javascript/blob/master/linters/jshintrc) + + [JSCS](https://github.com/jscs-dev/node-jscs) - [Airbnb Style Preset](https://github.com/jscs-dev/node-jscs/blob/master/presets/airbnb.json) + +**Other Styleguides** + + - [Google JavaScript Style Guide](http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml) + - [jQuery Core Style Guidelines](http://docs.jquery.com/JQuery_Core_Style_Guidelines) + - [Principles of Writing Consistent, Idiomatic JavaScript](https://github.com/rwldrn/idiomatic.js/) + +**Other Styles** + + - [Naming this in nested functions](https://gist.github.com/4135065) - Christian Johansen + - [Conditional Callbacks](https://github.com/airbnb/javascript/issues/52) - Ross Allen + - [Popular JavaScript Coding Conventions on Github](http://sideeffect.kr/popularconvention/#javascript) - JeongHoon Byun + - [Multiple var statements in JavaScript, not superfluous](http://benalman.com/news/2012/05/multiple-var-statements-javascript/) - Ben Alman + +**Further Reading** + + - [Understanding JavaScript Closures](http://javascriptweblog.wordpress.com/2010/10/25/understanding-javascript-closures/) - Angus Croll + - [Basic JavaScript for the impatient programmer](http://www.2ality.com/2013/06/basic-javascript.html) - Dr. Axel Rauschmayer + - [You Might Not Need jQuery](http://youmightnotneedjquery.com/) - Zack Bloom & Adam Schwartz + - [ES6 Features](https://github.com/lukehoban/es6features) - Luke Hoban + +**Books** + + - [JavaScript: The Good Parts](http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742) - Douglas Crockford + - [JavaScript Patterns](http://www.amazon.com/JavaScript-Patterns-Stoyan-Stefanov/dp/0596806752) - Stoyan Stefanov + - [Pro JavaScript Design Patterns](http://www.amazon.com/JavaScript-Design-Patterns-Recipes-Problem-Solution/dp/159059908X) - Ross Harmes and Dustin Diaz + - [High Performance Web Sites: Essential Knowledge for Front-End Engineers](http://www.amazon.com/High-Performance-Web-Sites-Essential/dp/0596529309) - Steve Souders + - [Maintainable JavaScript](http://www.amazon.com/Maintainable-JavaScript-Nicholas-C-Zakas/dp/1449327680) - Nicholas C. Zakas + - [JavaScript Web Applications](http://www.amazon.com/JavaScript-Web-Applications-Alex-MacCaw/dp/144930351X) - Alex MacCaw + - [Pro JavaScript Techniques](http://www.amazon.com/Pro-JavaScript-Techniques-John-Resig/dp/1590597273) - John Resig + - [Smashing Node.js: JavaScript Everywhere](http://www.amazon.com/Smashing-Node-js-JavaScript-Everywhere-Magazine/dp/1119962595) - Guillermo Rauch + - [Secrets of the JavaScript Ninja](http://www.amazon.com/Secrets-JavaScript-Ninja-John-Resig/dp/193398869X) - John Resig and Bear Bibeault + - [Human JavaScript](http://humanjavascript.com/) - Henrik Joreteg + - [Superhero.js](http://superherojs.com/) - Kim Joar Bekkelund, Mads Mobæk, & Olav Bjorkoy + - [JSBooks](http://jsbooks.revolunet.com/) - Julien Bouquillon + - [Third Party JavaScript](http://manning.com/vinegar/) - Ben Vinegar and Anton Kovalyov + +**Blogs** + + - [DailyJS](http://dailyjs.com/) + - [JavaScript Weekly](http://javascriptweekly.com/) + - [JavaScript, JavaScript...](http://javascriptweblog.wordpress.com/) + - [Bocoup Weblog](http://weblog.bocoup.com/) + - [Adequately Good](http://www.adequatelygood.com/) + - [NCZOnline](http://www.nczonline.net/) + - [Perfection Kills](http://perfectionkills.com/) + - [Ben Alman](http://benalman.com/) + - [Dmitry Baranovskiy](http://dmitry.baranovskiy.com/) + - [Dustin Diaz](http://dustindiaz.com/) + - [nettuts](http://net.tutsplus.com/?s=javascript) **[⬆ back to top](#table-of-contents)** +## License + +(The MIT License) + +Copyright (c) 2014 Airbnb + +Permission is hereby granted, free of charge, to any person obtaining +a copy of this software and associated documentation files (the +'Software'), to deal in the Software without restriction, including +without limitation the rights to use, copy, modify, merge, publish, +distribute, sublicense, and/or sell copies of the Software, and to +permit persons to whom the Software is furnished to do so, subject to +the following conditions: + +The above copyright notice and this permission notice shall be +included in all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. +IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY +CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, +TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE +SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. + +**[⬆ back to top](#table-of-contents)** \ No newline at end of file From 8073c88f1e9220c25d671d0d23636c7bb067a304 Mon Sep 17 00:00:00 2001 From: Chris Hourihan Date: Wed, 5 Nov 2014 16:41:50 -0500 Subject: [PATCH 2/3] removing use-strict requirements; updating jshintrc with additional excluded keywords --- README.md | 3 --- .../SublimeLinter.sublime-settings | 5 +---- linters/jshintrc | 19 ++++++++++++------- 3 files changed, 13 insertions(+), 14 deletions(-) diff --git a/README.md b/README.md index d9e0bc7fe8..6ce78353c6 100644 --- a/README.md +++ b/README.md @@ -1593,7 +1593,6 @@ ## Modules - The file should be named with snake case and match the name of the single export written in camel case. - - Always declare `'use strict';` at the top of the module. ```javascript // Node module @@ -1602,7 +1601,6 @@ module.exports = FancyInput; function FancyInput() { - 'use strict'; function doSomethingFancy(options) { options = options || {}; @@ -1617,7 +1615,6 @@ // Client-side module (function(global) { - 'use strict'; global.FancyModule = FancyModule; diff --git a/linters/SublimeLinter/SublimeLinter.sublime-settings b/linters/SublimeLinter/SublimeLinter.sublime-settings index a87783b6f0..893baeff44 100644 --- a/linters/SublimeLinter/SublimeLinter.sublime-settings +++ b/linters/SublimeLinter/SublimeLinter.sublime-settings @@ -65,9 +65,6 @@ "unused": true, // Enforce line length to 80 characters - "maxlen": 80, - - // Enforce placing 'use strict' at the top function scope - "strict": true + "maxlen": 80 } } diff --git a/linters/jshintrc b/linters/jshintrc index 808b2eda39..b3be071606 100644 --- a/linters/jshintrc +++ b/linters/jshintrc @@ -15,7 +15,15 @@ // Define other globals "globals": { - "angular": false + "angular": false, + "describe": false, + "it": false, + "beforeEach": false, + "afterEach": false, + "expect": false, + "browser": false, + "inject": false, + "sinon": false }, /* @@ -25,7 +33,7 @@ // Force all variable names to use either camelCase style or UPPER_CASE // with underscores. - "camelcase": true, + "camelcase": false, // Prohibit use of == and != in favor of === and !==. "eqeqeq": true, @@ -55,8 +63,5 @@ "unused": true, // Enforce line length to 80 characters - "maxlen": 80, - - // Enforce placing 'use strict' at the top function scope - "strict": false -} + "maxlen": 80 +} \ No newline at end of file From f787f46d7dcf00e2e6dc96ffd2d73fb88c9e9799 Mon Sep 17 00:00:00 2001 From: Chris Hourihan Date: Wed, 5 Nov 2014 16:43:15 -0500 Subject: [PATCH 3/3] camelcase back to true --- linters/jshintrc | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/linters/jshintrc b/linters/jshintrc index b3be071606..e6a6c95d4c 100644 --- a/linters/jshintrc +++ b/linters/jshintrc @@ -33,7 +33,7 @@ // Force all variable names to use either camelCase style or UPPER_CASE // with underscores. - "camelcase": false, + "camelcase": true, // Prohibit use of == and != in favor of === and !==. "eqeqeq": true,