Thursday, March 17, 2016

JavaScript Coding Convention

Intro

javascript(이하 js)로 개발함에 있어서 개발자들간에 지켜야할 코딩 규약을 정하고자 한다.

Convention

Javascript File

  1. file encoding은 UTF-8로 한다.
  2. file extention은 .js로 한다. ex) Test.js
  3. javascript 코드는 기본적으로 HTML 파일에 들어가지 않는것을 권장한다.
  4. HTML에서 javascript include는 <script src="filename.js"> 형태로 기술한다.

Indentation & Line

  1. indent는 space 4칸으로 한다.(tab 지양)
  2. line length는 가능한 80 line에 맞추도록 한다.

Declaration

Variable

  1. 변수 선언은 반드시 var 를 사용한다.
  2. var statement는 function body의 최상단에 위치한다.
  3. var statement는 alphabetical ascending order로 배치 될수 있도록 한다.
    변수선언 샘플
    ...
    function printName() {
        var channel;
        var program;
        var size;
        ...
    }

Function

  1. function은 가능한 expressive하게 선언하지 않고 declarative하게 선언하는것을 권장한다.
    함수선언 샘플
    // suggest not to use if you can.
    var foo = function (arg1, arg2) {
        ...
    };
    // suggest to use this style.
    function foo(arg1, arg2) {
    ...
    }
  2. named function은 function keyword와 name 사이 space 1칸, parameter와 { 사이 space 1칸으로 한다.
    named function
    function myName(arg1, arg2) {
        ...
    }
  3. anonymous function은 function keyword와 argument 사이 space 1칸, parameter와 { 사이 space 1칸으로 한다.
    named function
    var af = function (arg1, arg2) {
        ...
    };
  4. inner function의 정의는 var statement 다음에 위치하도록 한다.
    named function
    function myName(arg1, arg2) {
        var v1;
        function inner(a1) {
            ...
        }
        ...
    }
  5. immediate function invocation은 괄호"()" 사이에 function이 위치할 수 있도록 한다.
    named function
    var af = (function (arg1, arg2) {
        var a;
        ...
        return a;
    }());

Naming

  1. variable naming은 lowercase와 숫자, underscore(_)의 조합으로 만들도록 한다.
    named function
    var channel_number;
    var program_name;
    ...
  2. underscore(_)로 시작하는 이름은 private에 한해서만 사용하도록 한다.
  3. method로 사용할 function명은 lowercase로 시작된 camel type을 사용한다.
    named function
    function doStuff() {
        ...
    }
  4. constructor로 사용될 function명은 uppercase로 시작된 camel type을 사용한다.
    named function
    function ChannelManager() {
        ...
    }
    ...
    var ch = new ChannelManager();
  5. global variable은 어떻게 할까?...고민중

Statement

  1. statement는 마지막에 항상 semicolon(;)을 붙이도록 한다.
  2. compound statement는 아래와 같은 패턴을 사용하도록 권장한다.
    named function
    // if-else
    if (condition) {
        statements
    }
         
    if (condition) {
        statements
    else {
        statements
    }
    if (condition) {
        statements
    else if (condition) {
        statements
    else {
        statements
    }
    // for
    for (initialization; condition; update) {
        statements
    }
    for (variable in object) {
        if (filter) {
            statements
        }
    }
    // while
    while (condition) {
        statements
    }
    // do-while
    do {
        statements
    while (condition);
    // switch
    switch (expression) {
    case expression:
        statements
    default:
        statements
    }
    // try-catch
    try {
        statements
    catch (variable) {
        statements
    }
    try {
        statements
    catch (variable) {
        statements
    } finally {
        statements
    }

Comparator

  1. ==와 != 대신 ===와 !==를 사용하는 것을 권장한다.

Additional

  1. eval은 보안상의 문제가 있으니 되도록 쓰지않도록 한다."eval is evil"
  2. with는 알기 힘든 버그를 만들어 낼수 있으니 되도록 쓰지 않도록 한다.
    http://yuiblog.com/blog/2006/04/11/with-statement-considered-harmful/
  3. global scope이 필요한 경우가 아니면 Function constructor는 사용을 자제한다.