Recommended coding standards

The following are the coding standards that the Cocos Creator development team use. They are included in the manual for game developers and tool developers reference.

Naming standards

  • When we name the variables, functions and living examples, we use camelCase nomenclature

     // bad
     var FOOBar = {};
     var foo_bar = {};
     function FOOBar () {}
    
     // good
     var fooBar = {};
     function fooBar () {}
    
  • When we name types or modules, we use PascalCase nomenclature

     // bad
     var foobar = cc.Class({
         foo: 'foo',
         bar: 'bar',
     });
     var foobar = require('foo-bar');
    
     // good
     var FooBar = cc.Class({
         foo: 'foo',
         bar: 'bar',
     });
     var FooBar = require('foo-bar');
    
  • It is recommended to use full uppercase underline to name “constant”.

     // bad
     const PRIVATE_VARIABLE = 'should not be unnecessarily uppercased within a file';
    
     // bad
     var THING_TO_BE_CHANGED = 'should obviously not be uppercased';
    
     // bad
     let REASSIGNABLE_VARIABLE = 'do not use let with uppercase variables';
    
     // ---
    
     // allowed but does not supply semantic value
     export const apiKey = 'SOMEKEY';
    
     // better in most cases
     export const API_KEY = 'SOMEKEY';
    
     // ---
    
     // bad - unnecessarily uppercases key while adding no semantic value
     export const MAPPING = {
         KEY: 'value'
     };
    
     // good
     export const Type = {
         SIMPLE: 'value'
     };
    
  • Use underscores _ when naming private attributes

     // bad
     this.__firstName__ = 'foobar';
     this.firstName_ = 'foobar';
    
     // good
     this._firstName = 'foobar';
    
  • We use dash nomenclature for files

     // bad
     fooBar.js
     FooBar.js
    
     // good
     foo-bar.js
    

Grammar standards

  • Use Object.create(null) to create an object

     // bad
     var obj = new Object();
    
     // bad
     var obj = {};
    
     // good
     var obj = Object.create(null);
    
  • Use [] to create an array

     // bad
     var array = new Array();
    
     // good
     var array = [];
    
  • Try your best to use single quotation marks '' to define a string in js code

     // bad
     var str = "Hello World";
    
     // good
     var str = 'Hello World';
    
  • When defining multi-lines string, try your best to use +

     // bad
     const errorMessage = 'This is a super long error that was thrown out because of Batman. When you stop to think about how Batman had anything to do with this, you would get nowhere fast.';
    
     // bad
     const errorMessage = 'This is a super long error that was thrown out because \
     of Batman. When you stop to think about how Batman had anything to do \
     with this, you would get nowhere \
     fast.';
    
     // good
     const errorMessage = 'This is a super long error that was thrown out because ' +
       'of Batman. When you stop to think about how Batman had anything to do ' +
       'with this, you would get nowhere fast.';
    
  • Use === and !== rather than == and !=.

Grammar standards

  • Choose quadruple spacing or double spacing for indentation according to your own habits and the primary code writer's format.

     // bad
     function() {
     ∙var name;
     }
    
     // very bad
     function() {
     ∙∙<tab>∙∙var name;
     }
    
     // good
     function() {
     ∙∙var name;
     }
    
     // good
     function() {
     ∙∙∙∙var name;
     }
    
  • Do not leave spaces at the end of the line. Leave an empty line at the bottom of the file

     // bad
     function () {∙
     ∙∙∙∙var name;∙
     }
     /* EOF */
    
     // good
     function () {
     ∙∙∙∙var name;
     }
    
     /* EOF */
    
  • Please add ; at the end of the statement.

     // bad
     proto.foo = function () {
     }
    
     // good
     proto.foo = function () {
     };
    
     // bad
     function foo () {
         return 'test'
     }
    
     // very bad
     //   returns `undefined` instead of the value on the next line,
     //   always happens when `return` is on a line by itself because of Automatic Semicolon Insertion!
     function foo () {
         return
             'test'
     }
    
     // good
     function foo () {
         return 'test';
     }
    
     // bad
     function foo () {
     };
    
     // good, this is not the end of the statement
     function foo () {
     }
    
  • Try to put { and the expression in the same line

     // bad
     if ( isFoobar )
     {
     }
    
     // good
     if ( isFoobar ) {
     }
    
     // bad
     function foobar()
     {
     }
    
     // good
     function foobar() {
     }
    
     // bad
     var obj =
     {
         foo: 'foo',
         bar: 'bar',
     }
    
     // good
     var obj = {
         foo: 'foo',
         bar: 'bar',
     }
    
  • Put a space before {

     // bad
     if (isJedi){
         fight();
     }
     else{
         escape();
     }
    
     // good
     if (isJedi) {
         fight();
     }
     else {
         escape();
     }
    
     // bad
     dog.set('attr',{
         age: '1 year',
         breed: 'Bernese Mountain Dog',
     });
    
     // good
     dog.set('attr', {
         age: '1 year',
         breed: 'Bernese Mountain Dog',
     });
    
  • Please put a space before ( of the logic state expressions ( if, else, while, switch)

     // bad
     if(isJedi) {
         fight ();
     }
     else{
         escape();
     }
    
     // good
     if (isJedi) {
         fight();
     }
     else {
         escape();
     }
    
  • Leave one space between the binary ternary operators

     // bad
     var x=y+5;
     var left = rotated? y: x;
    
     // good
     var x = y + 5;
     var left = rotated ? y : x;
    
     // bad
     for (let i=0; i< 10; i++) {
     }
    
     // good
     for (let i = 0; i < 10; i++) {
     }
    
  • The way some functions are declared

     // bad
     var test = function () {
         console.log('test');
     };
    
     // good
     function test () {
         console.log('test');
     }
    
     // bad
     function divisibleFunction () {
         return DEBUG ? 'foo' : 'bar';
     }
    
     // good
     var divisibleFunction = DEBUG ?
         function () {
             return 'foo';
         } :
         function () {
             return 'bar';
         };
    
     // bad
     function test(){
     }
    
     // good
     function test () {
     }
    
     // bad
     var obj = {
         foo: function () {
         }
     };
    
     // good
     var obj = {
         foo () {
         }
     };
    
     // bad
     array.map(x=>x + 1);
     array.map(x => {
         return x + 1;
     });
    
     // good
     array.map(x => x + 1);
    
  • Put a space between Block definitions

     // bad
     if (foo) {
         return bar;
     }
     return baz;
    
     // good
     if (foo) {
         return bar;
     }
    
     return baz;
    
     // bad
     const obj = {
         x: 0,
         y: 0,
         foo() {
         },
         bar() {
         },
     };
     return obj;
    
     // good
     const obj = {
         x: 0,
         y: 0,
    
         foo() {
         },
    
         bar() {
         },
     };
    
     return obj;
    
  • Do not use a comma to define

     // bad
     var story = [
           once
         , upon
         , aTime
     ];
    
     // good
     var story = [
         once,
         upon,
         aTime,
     ];
    
     // bad
     var hero = {
           firstName: 'Ada'
         , lastName: 'Lovelace'
         , birthYear: 1815
         , superPower: 'computers'
     };
    
     // good
     var hero = {
         firstName: 'Ada',
         lastName: 'Lovelace',
         birthYear: 1815,
         superPower: 'computers',
     };
    
  • Single line comments, please add a space after the slash

     //bad
     // good
    
  • Multiline comments

     /*
      * good
      */
    
  • A multiline comments that needs to be exported to the API document

     /**
      * good
      */
    

Airbnb JavaScript Style Guide

results matching ""

    No results matching ""