r4 - 13 Nov 2006 - 17:23:54 - TravisVachonYou are here: OSAF >  Projects Web  >  CosmoHome > CosmoDevelopmentHome > JavaScriptStyleguide

JS Styleguide

These are merely guidelines. They should not be adhered to mechanically, especially if a deviation would make your code more readable.

General

  1. Code SHOULD be indented with spaces only.
  2. Each level of indentation SHOULD consist of 4 spaces.
  3. Files SHOULD include the Apache License Version 2 notice and the OSAF copyright notice at the top.
  4. Lines SHOULD be 80 characters max.

Naming

Overview

Construct Convention Examples
Class name CamelCase with an initial capital letter MightyBalrog, MagicWeapon
Public method camelCase with an initial lowercase letter castDimensionalDoorway, rollForInitiative
Public variable camelCase with an initial lowercase letter materialComponents, hasTrackingAbilities
Private method camelCase with an initial lowercase letter and underscore _getHealth
Private variable camelCase with an initial lowercase letter and underscore _backstabAbility
Method arguments camelCase with an initial lowercase letter halfOrcArmy
Local variables camelCase with an initial lowercase letter isHumanoid, levelCount
Constant Uppercase with underscores CLERIC_PLAYER, GAME_MASTER

Notes

  1. Variable/method names in all lowercase with underscores SHOULD NOT be used unless mimicking another API.
    • Incorrect:
      wizard_hat, vorpal_blade
    • Correct:
      wizardHat, vorpalBlade
  2. Acronyms in variable/method names SHOULD NOT be upppercased.
    • Incorrect:
      bartenderNPC, newRPG
    • Correct:
      bartenderNpc, newRpg
  3. Variable/method names SHOULD be written in English.
    • Incorrect:
      dekaiKatana
    • Correct:
      giganticSword
  4. Variable/method names SHOULD NOT be abbreviated to the point of being unclear.
    • Incorrect:
      wndMnstr[3]
    • Correct:
      wanderingMonster[3]

Variables

  1. Variables SHOULD be initialized where they are declared, if possible in a way that indicates what type of value they will hold. Null initializations are acceptable.
    • Incorrect:
      var magicItemCount;
      var wizardNpc;
    • Correct:
      var magicItemCount = 0;
      var wizardNpc = null;
  2. Variable declarations SHOULD NOT include extra spaces before the equals sign to align the variable values.
    • Incorrect:
      var currentThiefLevel = 8;
      var canBackstab       = true;
      var isNpc             = true;
    • Correct:
      var currentThiefLevel = 8;
      var canBackstab = true;
      var isNpc = true;
  3. Variable names SHOULD NOT include 'temp' or 'tmp'. -- all local variables are by definition temporary.
    • Incorrect:
      tempString, tmpDate
    • Correct:
      str, dt
  4. Magic numbers SHOULD NOT be used. Use a constant instead.
    • Incorrect:
      42
    • Correct:
      ANSWER_TO_THE_QUESTION_OF_LIFE

Coding Style

Overview

  1. Function declaration:
    function checkForTraps(dexterity, level) {
        // Do stuff to check for traps here
    }
  2. If statements:
    if (gotInitiative) {
        attackDragon();
    }
    else if (speaksDragon) {
        tryNegotiating();
    }
    else {
        runAway();
    }
  3. For statements:
    for (var i = 0; i < guards.length; i++) {
        rollTwentySided(guards[i]);
    }
  4. While statements:
    while (charactersInjured) {
        castCureLightWounds();
        charactersInjured = checkCharacterHealth();
    }
  5. Switch statements:
    switch (characterClass) {
        case 'ranger':
            // Ranger special stuff here
            // Fallthrough
        case 'fighter':
            // Do fighter stuff
            break;
        case 'magicUser':
            // Do mage-specific stuff
            break;
        default:
           // do nothing
    }
  6. Try-catch-finally statements:
    try {
        pickPocket();
    }
    catch(e) {
        lookInconspicuous();
        reportBack(e);
    }
    finally {
        runLikeHell();
    }

  1. Object literal:
    var obj = {
        spellName: 'Invisible Stalker',
        numberOfFighters: 3,
        checkForTraps = function() {
            // Do trap checking
        } 
    }
    
    var obj = { staff: 'Staff of the Magi', wand: 
        'Wand of Negation', misc: 'Boots of Elvenkind' }
    

Notes

  1. If-else statements (also while, et al) MAY be written on a single line, but MUST use brackets.
    • Incorrect:
      if (isUndead) grabFire();
    • Correct:
      if (isUndead) { grabFire(); }
  2. Parenthesis in conditional statements (if, while, for, etc.) SHOULD have a space before them.
    • Incorrect:
      if(isNpc) { 
          ignoreTalk(); 
      }
    • Correct:
      if (isNpc) { 
          ignoreTalk(); 
      }
  3. Parenthesis in function declarations SHOULD NOT have a space before them.
    • Incorrect:
      function getArmorClass (armorType, dexterity) {
          // Get AC stuff here
      }
    • Correct:
      function getArmorClass(armorType, dexterity) {
          // Get AC stuff here
      }
  4. Commas SHOULD be followed by spaces.
    • Incorrect:
      getExperiencePoints(monster,hitPoints);
    • Correct:
      getExperiencePoints(monster, hitPoints);
  5. The colon in object literal notation SHOULD have no space in front of it, and be followed by a single space.
    • Incorrect:
      var newCharacter = {
          race:'gnome',
          class:'figheter'
          isNpc:false;
      }
    • Also incorrect:
      var newCharacter = {
          race : 'gnome',
          class : 'figheter'
          isNpc : false;
      }
    • Correct:
      var newCharacter = {
          race: 'gnome',
          class: 'figheter'
          isNpc: false;
      }
  6. The conditional operator (?) and the colon used with it SHOULD both have a space before and after.
    • Incorrect:
      var message = speaksDrow? getMessageinDrow():'You do not speak Drow.'
    • Correct:
      var message = speaksDrow ? getMessageinDrow() : 'You do not speak Drow.'
  7. Lengthy DOM element IDs or other string parameters SHOULD be placed into variables before using.
    • Incorrect:
      var elem = document.getElementById('charClass-' + charClass + 
          + '_combatStats-' + armorClass + '-' + toHitBonus);
    • Correct:
      var char = 'charClass-' + charClass;
      var combat = 'combatStatus-' + armorClass + '-' + toHitBonus;
      var elem = document.getElementById(char + '_' + combat);
Edit | WYSIWYG | Attach | Printable | Raw View | Backlinks: Web, All Webs | History: r4 < r3 < r2 < r1 | More topic actions
 
Open Source Applications Foundation
Except where otherwise noted, this site and its content are licensed by OSAF under an Creative Commons License, Attribution Only 3.0.
See list of page contributors for attributions.