關於codestyle

若是你的代碼易於閱讀,那麼代碼中bug也將會不多,由於一些bug能夠很容被調試,而且,其餘開發者參與你項目時的門檻也會比較低。所以,若是項目中有多人蔘與,採起一個有共識的編碼風格約定很是有必要。git

以todomvc的編碼要求爲例:github

General Rules

  • Tab indentation
  • Single-quotes
  • Semicolon
  • Strict mode
  • No trailing whitespace
  • Variables at the top of the scope
  • Multiple variable statements
  • Space after keywords and between arguments and operators
  • Return early
  • JSHint valid
  • Consistency

Example:mvc

'use strict';

function foo(bar, fum) {
    var i, l, ret;
    var hello = 'Hello';

    if (!bar) {
        return;
    }

    for (i = 0, l = bar.length; i < l; i++) {
        if (bar[i] === hello) {
            ret += fum(bar[i]);
        }
    }

    return ret;
}

Read idiomatic.js for general JavaScript code style best practices.app

Anonymous Functions

When using anonymous functions, leave a space between the function name and opening parenthesis.dom

Example:ide

(function () {
    'use strict';

    var thanks = 'mate';
})

Strict mode

Strict mode should be used wherever possible, but must never be globally applied. Instead, use it inside an IIFE as shown aboveui

Comments

Inline comments are a great way of giving new users a better understanding of what you're doing and why.this

It's also helpful to let your functions breathe, by leaving additional lines between statements.編碼

Example:spa

// Ok.
var removeTodo = function (todoItem) {
    var todoModel = todoItem.getModel(); // Grab the model from the todoItem.
    todoItem.find('.destroy').click(); // Trigger a click to remove the element from the <ul>.
    todoModel.remove(); // Removes the todo model from localStorage.
};

// Better.
var removeTodo = function (todoItem) {
    // Grab the model from the todoItem.
    var todoModel = todoItem.getModel();

    // Trigger a click to remove the element from the <ul>.
    todoItem.find('.destroy').click();

    // Removes the todo model from localStorage.
    todoModel.remove();
};

RequireJS

When using RequireJS, please format your code to these specifications:

define('Block', [
    'jQuery',
    'Handlebars'
], function ($, Handlebars) {
    'use strict';

    // Code here.
});

JSHint

When you submit your pull request, one of the first things we will do is run JSHint against your code.

You can help speed the process by running it yourself:

jshint path/to/your/app/js

Your JSHint code blocks must follow this style:

/*global define, App */
/*jshint unused:false */

 

一些達成共識的JavaScript編碼風格約定

http://www.iteye.com/news/28028-JavaScript-code-style-guide

相關文章
相關標籤/搜索