Changes between Version 27 and Version 28 of WebInspectorCodingStyleGuide


Ignore:
Timestamp:
Jun 18, 2020 1:29:09 PM (2 years ago)
Author:
Devin Rousso
Comment:

--

Legend:

Unmodified
Added
Removed
Modified
  • WebInspectorCodingStyleGuide

    v27 v28  
    2020* The `{` after a named, non-inlined function goes on the next line. Anywhere else, the `{` stays on the same line.
    2121* Style for object literals is: `{key1: value1, key2: value2}`. When key and variable names coincide, use the syntax `{key}` rather than `{key: key}`. If the object is complex enough, each `key: value,` should be on its own line.
     22* Always include a trailing comma for object literals.
    2223* Add new lines before and after different tasks performed in the same function.
    2324* Else-blocks should share a line with leading `}`.
    2425* Long promise chains should place `.then()` blocks on a new line.
    25 * Calling a constructor with no arguments should have no parenthesis `'()'`. (ex: `var map = new Map;`)
     26* Calling a constructor with no arguments should have no parenthesis `()`. (ex: `var map = new Map;`)
    2627* Put anonymous functions inline if they are not used as a subroutine.
    2728* Prefer `let` to `var`, unless the variable is not used in a block scoping manner. Be careful when using `let` with `case` switches, as [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let#Temporal_dead_zone_and_errors_with_let all switch cases share the same block by default]. Only use `const` for values that will not change between executions (i.e. actual constants).
     
    4142
    4243* Use `Map` and `Set` collections instead of plain objects if the key values are unknown or not monotonic (i.e., frequently added then removed).
    43 * Use `hsla()` over hex or `rgba` for colors in CSS.
     44* Use `hsla()` over hex or `rgba()` for colors in CSS.
    4445* Use `for..of` syntax when performing actions on each element. Use `forEach` when chaining methods in a functional style. Use a classical for loop when doing index math.
    4546* When using `forEach` or `map`, use an arrow function or supply the `this`-object as the optional second parameter rather than binding it.
     
    94953   let foo = (val) => val;
    95964   let foo = (val) => { return value++; }
    96 5   let foo = function doStuff(val) { return value++; }
     975   let foo = (val) => {
     98        return value++;
     99    };
     1006   let foo = function doStuff(val) { return value++; }
     1017   let foo = function doStuff(val) {
     102        return value++;
     103    }
    97104}}}
    98105
     
    103110In cases where the expression computes a value (a + 42) or performs a side effect (++a), prefer option (4).
    104111In some sense, curly braces are a signpost to the effect of "careful, we do actual work here".
     112
     113If the implicit return is not used (4, 5, 6, 7), always put the function body on new lines from the `{` and `}` (as demonstrated in 5 and 7).
    105114
    106115GOOD: