JavaScript Standard Style

English • Español (Latinoamérica) • Français • Bahasa Indonesia • Italiano (Italian) • 日本語 (Japanese) • 한국어 (Korean) • Português (Brasil) • 简体中文 (Simplified Chinese) • 繁體中文 (Taiwanese Mandarin)

Esto es un TL;DR (muy largo, no lo leí) de reglas JavaScript standard.

La mejor manera de aprender acerca de standard es instalarlo darle una prueba en tu código.

Reglas

Usar 2 espacios como sangría.

eslint: indent

function hello (name) {
  console.log('hi', name)
}

Usar comillas simples en cadenas de texto con la excepción para evitar escapado de texto.

eslint: quotes
```
console.log('hello there') // comillas simples
$("<div class='box'>") // escapado de texto
```

No dejar variables sin usar.

eslint: no-unused-vars

function myFunction () {
  var result = something()   // ✗ evitar
}

Espacio después de las palabras claves.

eslint: keyword-spacing

if (condition) { ... }   // ✓ ok
if(condition) { ... }    // ✗ evitar

Agregar un espacio antes de los paréntesis de la función declarada.

eslint: space-before-function-paren

function name (arg) { ... }   // ✓ ok
function name(arg) { ... }    // ✗ evitar

run(function () { ... })      // ✓ ok
run(function() { ... })       // ✗ evitar

Usar siempre === en vez de ==.
Excepción: obj == null permite comprobar si null || undefined.

eslint: eqeqeq

if (name === 'John')   // ✓ ok
if (name == 'John')    // ✗ evitar

if (name !== 'John')   // ✓ ok
if (name != 'John')    // ✗ evitar

Operadores infijos deben ser espaciados.

eslint: space-infix-ops

// ✓ ok
var x = 2
var message = 'hello, ' + name + '!'

// ✗ evitar
var x=2
var message = 'hello, '+name+'!'

Comas deben tener un espacio después de ellas.

eslint: comma-spacing

// ✓ ok
var list = [1, 2, 3, 4]
function greet (name, options) { ... }

// ✗ evitar
var list = [1,2,3,4]
function greet (name,options) { ... }

Mantener declaración else en la misma línea que sus llaves.

eslint: brace-style

// ✓ ok
if (condition) {
  // ...
} else {
  // ...
}

// ✗ evitar
if (condition) {
  // ...
}
else {
  // ...
}

Para declaraciones if multi-línea debe usar llaves.

eslint: curly

// ✓ ok
if (options.quiet !== true) console.log('done')

// ✓ ok
if (options.quiet !== true) {
  console.log('done')
}

// ✗ evitar
if (options.quiet !== true)
  console.log('done')

Siempre gestionar el parámetro err en las funciones.

eslint: handle-callback-err

// ✓ ok
run(function (err) {
  if (err) throw err
  window.alert('done')
})

// ✗ evitar
run(function (err) {
  window.alert('done')
})

En las variables globales usar el sufijo window..
Con la excepción de: document, console y navigator.

eslint: no-undef
```
window.alert('hi')   // ✓ ok
```

Múltiples líneas en blanco no está permitido.

eslint: no-multiple-empty-lines

// ✓ ok
var value = 'hello world'
console.log(value)

// ✗ evitar
var value = 'hello world'

console.log(value)


* **Para el operador ternario** en multi-línea, colocar el `?` y `:` en su propia nueva línea.

eslint: [`operator-linebreak`](http://eslint.org/docs/rules/operator-linebreak)

```js
// ✓ ok
var location = env.development ? 'localhost' : 'www.api.com'

// ✓ ok
var location = env.development
  ? 'localhost'
  : 'www.api.com'

// ✗ evitar
var location = env.development ?
  'localhost' :
  'www.api.com'

Para declaraciones var, escribir solo una asignación en cada declaración.

eslint: one-var

// ✓ ok
var silent = true
var verbose = true

// ✗ evitar
var silent = true, verbose = true

// ✗ evitar
var silent = true,
    verbose = true

Envolver asignaciones condicionales con paréntesis adicionales. Esto hace claro que la intención de la expresión es una asignación y no un error de igualdad (===).

eslint: no-cond-assign
```
// ✓ ok
while ((m = text.match(expr))) {
  // ...
}

// ✗ evitar
while (m = text.match(expr)) {
  // ...
}
```

Agregar espacios dentro de bloques de una sola línea.

eslint: block-spacing

  function foo () {return true}    // ✗ evitar
  function foo () { return true }  // ✓ ok

Usar camelcase al nombre variables y funciones.

eslint: camelcase

  function my_function () { }    // ✗ avoid
  function myFunction () { }     // ✓ ok

  var my_var = 'hello'           // ✗ avoid
  var myVar = 'hello'            // ✓ ok

Comas adicionales no está permitido.

eslint: comma-dangle

  var obj = {
    message: 'hello',   // ✗ avoid
  }

Comas deben colocarse al final de la línea actual.

eslint: comma-style

  var obj = {
    foo: 'foo'
    ,bar: 'bar'   // ✗ avoid
  }

  var obj = {
    foo: 'foo',
    bar: 'bar'   // ✓ ok
  }

El Punto debe ir en la misma línea que la propiedad.

eslint: dot-location

  console.
    log('hello')  // ✗ avoid

  console
    .log('hello') // ✓ ok

Archivos deben terminar con una nueva línea.

elint: eol-last
Sin espacios entre el identificador de la función y su invocación.

eslint: func-call-spacing
```
console.log ('hello') // ✗ avoid
console.log('hello')  // ✓ ok
```

Agregar espacio entre dos puntos (colon) y pares clave valor.

eslint: key-spacing

var obj = { 'key' : 'value' }    // ✗ avoid
var obj = { 'key' :'value' }     // ✗ avoid
var obj = { 'key':'value' }      // ✗ avoid
var obj = { 'key': 'value' }     // ✓ ok

Nombres de Constructor deben empezar con letra Mayúscula.

eslint: new-cap

function animal () {}
var dog = new animal()    // ✗ avoid

function Animal () {}
var dog = new Animal()    // ✓ ok

Constructor sin argumentos debe ser invocado con paréntesis.

eslint: new-parens

function Animal () {}
var dog = new Animal    // ✗ avoid
var dog = new Animal()  // ✓ ok

Objetos deben contener un getter cuando se ha definido un setter.

eslint: accessor-pairs

var person = {
  set name (value) {    // ✗ avoid
    this._name = value
  }
}

var person = {
  set name (value) {
    this._name = value
  },
  get name () {         // ✓ ok
    return this._name
  }
}

Constructores de clases derivadas deben llamar super.

eslint: constructor-super

class Dog {
  constructor () {
    super()   // ✗ avoid
  }
}

class Dog extends Mammal {
  constructor () {
    super()   // ✓ ok
  }
}

Usar array literales en vez de array constructor.

eslint: no-array-constructor

var nums = new Array(1, 2, 3)   // ✗ avoid
var nums = [1, 2, 3]            // ✓ ok

Evitar usar arguments.calle y arguments.caller.

eslint: no-caller

function foo (n) {
  if (n <= 0) return

  arguments.callee(n - 1)   // ✗ avoid
}

function foo (n) {
  if (n <= 0) return

  foo(n - 1)
}

Evitar modificar variables que fueron declaradas como clase.

eslint: no-class-assign
```
class Dog {}
Dog = 'Fido'    // ✗ avoid
```
Evitar modifidicar variables declaracas usando const.

eslint: no-const-assign
```
const score = 100
score = 125       // ✗ avoid
```

Evitar usar expresiones constantes en condicionales (a excepción de bucles).

eslint: no-constant-condition

if (false) {    // ✗ avoid
  // ...
}

if (x === 0) {  // ✓ ok
  // ...
}

while (true) {  // ✓ ok
  // ...
}

Evitar caracteres de control de expresiones regulares.

eslint: no-control-regex

var pattern = /\x1f/    // ✗ avoid
var pattern = /\x20/    // ✓ ok

Evitar sentencias debugger.

eslint: no-debugger

function sum (a, b) {
  debugger      // ✗ avoid
  return a + b
}

Evitar operador delete en variables.

eslint: no-delete-var
```
var name
delete name     // ✗ avoid
```

Evitar argumentos duplicados en definición de funciones.

eslint: no-dupe-args

function sum (a, b, a) {  // ✗ avoid
  // ...
}

function sum (a, b, c) {  // ✓ ok
  // ...
}

Evitar duplicados en miembros de clase.

eslint: no-dupe-class-members
```
class Dog {
  bark () {}
  bark () {}    // ✗ avoid
}
```

Evitar duplicado de claves en objetos literales.

eslint: no-dupe-keys

var user = {
  name: 'Jane Doe',
  name: 'John Doe'    // ✗ avoid
}

Evitar dublicados de etiqueta case en sentencias switch.

eslint: no-duplicate-case

switch (id) {
  case 1:
    // ...
  case 1:     // ✗ avoid
}

Usar una unica sentencia import por módulo.

eslint: no-duplicate-imports

import { myFunc1 } from 'module'
import { myFunc2 } from 'module'          // ✗ avoid

import { myFunc1, myFunc2 } from 'module' // ✓ ok

Evitar classes de carácteres vacia en expresiones regulares.

eslint: no-empty-character-class

const myRegex = /^abc[]/      // ✗ avoid
const myRegex = /^abc[a-z]/   // ✓ ok

Evitar patrones de destructuración vacíos.

eslint: no-empty-pattern

const { a: {} } = foo         // ✗ avoid
const { a: { b } } = foo      // ✓ ok

Evitar uso de eval().

eslint: no-eval

eval( "var result = user." + propName ) // ✗ avoid
var result = user[propName]             // ✓ ok

Evitar reasignar excepciones en cláusulas catch.

eslint: no-ex-assign

try {
  // ...
} catch (e) {
  e = 'new value'             // ✗ avoid
}

try {
  // ...
} catch (e) {
  const newVal = 'new value'  // ✓ ok
}

Evitar extender objetos nativos.

eslint: no-extend-native
```
Object.prototype.age = 21     // ✗ avoid
```

Evitar uso innecesario de bind en funciones.

eslint: no-extra-bind

const name = function () {
  getName()
}.bind(user)    // ✗ avoid

const name = function () {
  this.getName()
}.bind(user)    // ✓ ok

Evitar hacer cast a booleanos.

eslint: no-extra-boolean-cast

const result = true
if (!!result) {   // ✗ avoid
  // ...
}

const result = true
if (result) {     // ✓ ok
  // ...
}

Evitar paréntesis innecesario alrededor de expresión de funciones.

eslint: no-extra-parens

const myFunc = (function () { })   // ✗ avoid
const myFunc = function () { }     // ✓ ok

Usar break para evitar pasar de largo fallthrough en casos switch.

eslint: no-fallthrough

switch (filter) {
  case 1:
    doSomething()    // ✗ avoid
  case 2:
    doSomethingElse()
}

switch (filter) {
  case 1:
    doSomething()
    break           // ✓ ok
  case 2:
    doSomethingElse()
}

switch (filter) {
  case 1:
    doSomething()
    // fallthrough  // ✓ ok
  case 2:
    doSomethingElse()
}

Evitar decimales flotantes.

eslint: no-floating-decimal

const discount = .5      // ✗ avoid
const discount = 0.5     // ✓ ok

Evitar reasignación de declaraciones de funciones.

eslint: no-func-assign
```
function myFunc () { }
myFunc = myOtherFunc    // ✗ avoid
```
Evitar reasignación de variables globales de solo-lectura.

eslint: no-global-assign
```
window = {}     // ✗ avoid
```

Evitar usar eval() implícito.

eslint: no-implied-eval

setTimeout("alert('Hello world')")                   // ✗ avoid
setTimeout(function () { alert('Hello world') })     // ✓ ok

Evitar declaración de funciones en bloques anidados.

eslint: no-inner-declarations

if (authenticated) {
  function setAuthUser () {}    // ✗ avoid
}

Evitar cadenas de texto expresiones regulares invalidas en constructores RegExp.

eslint: no-invalid-regexp
```
RegExp('[a-z')    // ✗ avoid
RegExp('[a-z]')   // ✓ ok
```
Evitar espacios en blanco irregulares.

eslint: no-irregular-whitespace
```
function myFunc () /*<NBSP>*/{}   // ✗ avoid
```

Evitar uso de __iterator__.

eslint: no-iterator

Foo.prototype.__iterator__ = function () {}   // ✗ avoid

Evitar etiquetas que comparten el nombre de una variable en scope.

eslint: no-label-var

var score = 100
function game () {
  score: while (true) {      // ✗ avoid
    score -= 10
    if (score > 0) continue score
    break
  }
}

Evitar sentencias etiquetadas.

eslint: no-labels

label:
  while (true) {
    break label     // ✗ avoid
  }

Evitar bloques anidados innecesarios.

eslint: no-lone-blocks

function myFunc () {
  {                   // ✗ avoid
    myOtherFunc()
  }
}

function myFunc () {
  myOtherFunc()       // ✓ ok
}

Evitar mezclar espacios y tabulaciones para sangría.

eslint: no-mixed-spaces-and-tabs
Evitar uso de espacios en blanco múltiples a excepción de sangría.

eslint: no-multi-spaces
```
const id =    1234    // ✗ avoid
const id = 1234       // ✓ ok
```

Evitar cadenas de texto multi-línea.

eslint: no-multi-str

const message = 'Hello \
                 world'     // ✗ avoid

Evitar usar new sin asignar al objeto a una variable.

eslint: no-new

new Character()                     // ✗ avoid
const character = new Character()   // ✓ ok

Evitar uso de constructor Function.

eslint: no-new-func

var sum = new Function('a', 'b', 'return a + b')    // ✗ avoid

Evitar uso de constructor Object.

eslint: no-new-object
```
let config = new Object()   // ✗ avoid
```

Evitar uso de new require.

eslint: no-new-require

const myModule = new require('my-module')    // ✗ avoid

Evitar uso de constructor Symbol.

eslint: no-new-symbol

const foo = new Symbol('foo')   // ✗ avoid

Evitar envolturas de instancias primitivas.

eslint: no-new-wrappers
```
const message = new String('hello')   // ✗ avoid
```
Evitar llamar propiedades de objetos globles como funciones.

eslint: no-obj-calls
```
const math = Math()   // ✗ avoid
```

Evitar uso de octal literal.

eslint: no-octal

const octal = 042         // ✗ avoid
const decimal = 34        // ✓ ok
const octalString = '042' // ✓ ok

Evitar escapado de secuencia octal en cadena de texto literal.

eslint: no-octal-escape
```
const copyright = 'Copyright \251'  // ✗ avoid
```

Evitar concatenacion de cadena de texto para __dirname y __filename.

eslint: no-path-concat

const pathToFile = __dirname + '/app.js'            // ✗ avoid
const pathToFile = path.join(__dirname, 'app.js')   // ✓ ok

Evitar uso de __proto__. Use getPrototypeOf en su lugar.

eslint: no-proto

const foo = obj.__proto__               // ✗ avoid
const foo = Object.getPrototypeOf(obj)  // ✓ ok

Evitar re-reclaración de variables.

eslint: no-redeclare

let name = 'John'
let name = 'Jane'     // ✗ avoid

let name = 'John'
name = 'Jane'         // ✓ ok

Evitar múltiples espacios en expresiones regulares.

eslint: no-regex-spaces

const regexp = /test   value/   // ✗ avoid

const regexp = /test {3}value/  // ✓ ok
const regexp = /test value/     // ✓ ok

Asignación de variables en el retorno de funciones debe estar rodeado de paréntesis.

eslint: no-return-assign

function sum (a, b) {
  return result = a + b     // ✗ avoid
}

function sum (a, b) {
  return (result = a + b)   // ✓ ok
}

Evitar asignar una variable a sí misma.

eslint: no-self-assign
```
name = name   // ✗ avoid
```
Evitar comparar una variable consigo misma.

esint: no-self-compare
```
if (score === score) {}   // ✗ avoid
```
Evitar uso de secuencia separado por coma.

eslint: no-sequences
```
if (doSomething(), !!test) {}   // ✗ avoid
```
Nombres restringidos no deben ser cambiados (shadowed).

eslint: no-shadow-restricted-names
```
let undefined = 'value'     // ✗ avoid
```

Array dispersos no están permitidos.

eslint: no-sparse-arrays

let fruits = ['apple',, 'orange']       // ✗ avoid

No se deben usar Tabulaciones.

eslint: [no-tabs](http://eslint.org/docs/rule
Cadenas de textos regulares no deben contener placeholders de plantillas literales.

eslint: no-template-curly-in-string
```
const message = 'Hello ${name}'   // ✗ avoid
const message = `Hello ${name}`   // ✓ ok
```

super() debe ser llamado inmediatamente antes de usar this.

eslint: no-this-before-super

class Dog extends Animal {
  constructor () {
    this.legs = 4     // ✗ avoid
    super()
  }
}

Solo se puede lanzar (throw) un objeto Error.

eslint: no-throw-literal

throw 'error'               // ✗ avoid
throw new Error('error')    // ✓ ok

Espacios en blanco después del final línea no están permitidos .

eslint: no-trailing-spaces

Inicializar una variable con undefined no está permitido.

eslint: no-undef-init

let name = undefined    // ✗ avoid

let name
name = 'value'          // ✓ ok

Bucles no modificados no están permitidos.

eslint: no-unmodified-loop-condition

for (let i = 0; i < items.length; j++) {...}    // ✗ avoid
for (let i = 0; i < items.length; i++) {...}    // ✓ ok

Evitar usar operador ternario cuando existe una alternative más simple.

eslint: no-unneeded-ternary

let score = val ? val : 0     // ✗ avoid
let score = val || 0          // ✓ ok

Evitar dejar código inalcanzable después de sentencias return, throw, continue, y break.

eslint: no-unreachable
```
function doSomething () {
  return true
  console.log('never called')     // ✗ avoid
}
```

Evitar sentencias de control de flujo en bloques finally.

eslint: no-unsafe-finally

try {
  // ...
} catch (e) {
  // ...
} finally {
  return 42     // ✗ avoid
}

El operando izquierdo en operaciones relacionales no debe ser negado.

eslint: no-unsafe-negation
```
if (!key in obj) {}       // ✗ avoid
```
Evitar uso innecesario de .call() y .apply().

eslint: no-useless-call
```
sum.call(null, 1, 2, 3)   // ✗ avoid
```

Evitar usar constructores innecesarios.

eslint: no-useless-computed-key

const user = { ['name']: 'John Doe' }   // ✗ avoid
const user = { name: 'John Doe' }       // ✓ ok

Evitar uso innecesario de escapado de text.

eslint: no-useless-escape
```
let message = 'Hell\o'  // ✗ avoid
```

Renombrar import, export o destructuración con el mismo nombre no está permitido.

eslint: no-useless-rename

import { config as config } from './config'     // ✗ avoid
import { config } from './config'               // ✓ ok

Evitar espacios en blanco antes de una propiedad.

eslint: no-whitespace-before-property
```
user .name      // ✗ avoid
user.name       // ✓ ok
```
Evitar uso de sentencia with.

eslint: no-with
```
with (val) {...}    // ✗ avoid
```

Mantener consistencia de nuevas líneas entre las propiedades de un objeto.

eslint: object-property-newline

const user = {
  name: 'Jane Doe', age: 30,
  username: 'jdoe86'            // ✗ avoid
}

const user = { name: 'Jane Doe', age: 30, username: 'jdoe86' }    // ✓ ok

const user = {
  name: 'Jane Doe',
  age: 30,
  username: 'jdoe86'
}                                                                 // ✓ ok

Evitar espacios de relleno entre bloques.

eslint: padded-blocks

if (user) {
                            // ✗ avoid
  const name = getName()

}

if (user) {
  const name = getName()    // ✓ ok
}

Evitar espacios en blanco entre el operador de propagación y la expresión.

eslint: rest-spread-spacing
```
fn(... args)    // ✗ avoid
fn(...args)     // ✓ ok
```

Punto y coma (semicolon) debe tener un espacio en blanco después y no antes.

eslint: semi-spacing

for (let i = 0 ;i < items.length ;i++) {...}    // ✗ avoid
for (let i = 0; i < items.length; i++) {...}    // ✓ ok

Mantener espacio después de los bloques.

eslint: space-before-blocks

if (admin){...}     // ✗ avoid
if (admin) {...}    // ✓ ok

Evitar espacios en blanco entre paréntesis.

eslint: space-in-parens

getName( name )     // ✗ avoid
getName(name)       // ✓ ok

Operador unario debe tener espacio en blanco después.

eslint: space-unary-ops

typeof!admin        // ✗ avoid
typeof !admin        // ✓ ok

Usar espacios dentro de comentarios.

eslint: spaced-comment

//comment           // ✗ avoid
// comment          // ✓ ok

/*comment*/         // ✗ avoid
/* comment */       // ✓ ok

Evitar espacios en blanco dentro de placeholders de plantillas literales.

eslint: template-curly-spacing

const message = `Hello, ${ name }`    // ✗ avoid
const message = `Hello, ${name}`      // ✓ ok

Usar isNaN() cuando se desea chequear NaN.

eslint: use-isnan

if (price === NaN) { }      // ✗ avoid
if (isNaN(price)) { }       // ✓ ok

typeof debe ser comparado con una cadena de texto valida.

eslint: valid-typeof

typeof name === 'undefimed'     // ✗ avoid
typeof name === 'undefined'     // ✓ ok

Expressiones Funciones inmediatamente invocadas (IIFEs) deben ser envueltas en paréntesis.

eslint: wrap-iife

const getName = function () { }()     // ✗ avoid

const getName = (function () { }())   // ✓ ok
const getName = (function () { })()   // ✓ ok

El * en expresiones yield* deben tener un espacio en blanco antes y después.

eslint: yield-star-spacing
```
yield* increment()    // ✗ avoid
yield * increment()   // ✓ ok
```

Evitar condiciones Yoda.

eslint: yoda

if (42 === age) { }    // ✗ avoid
if (age === 42) { }    // ✓ ok

Puntos y comas (semicolons)

Sin puntos y comas. (ver: 1, 2, 3)

eslint: semi

window.alert('hi')   // ✓ ok
window.alert('hi');  // ✗ evitar

Nunca empezar una línea con (, [, o `. Este es el único problema cuando se omiten los puntos y comas, y standard te protege de problemas potenciales

eslint: no-unexpected-multiline
```
// ✓ ok
;(function () {
  window.alert('ok')
}())

// ✗ evitar
(function () {
  window.alert('ok')
}())
```
```
// ✓ ok
;[1, 2, 3].forEach(bar)

// ✗ evitar
[1, 2, 3].forEach(bar)
```
```
// ✓ ok
;`hello`.indexOf('o')

// ✗ evitar
`hello`.indexOf('o')
```
Nota: si te encuentras a menudo escribiendo código de esta manera, quizás estás tratando de ser muy listo.

Esta taquigrafía es rechazada, en favor a expresiones claras y legibles, cuando sea posible.

En vez de esto:
```
;[1, 2, 3].forEach(bar)
```
Se prefiere esto:
```
var nums = [1, 2, 3]
nums.forEach(bar)
```

Lectura de ayuda con referencia hacia los puntos y comas:

También un video:

Are Semicolons Necessary in JavaScript? - YouTube

Los minificadores de código populares hoy en día están basados en AST (Árbol abstracto de sintaxis), de manera que pueden gestionar JavaScript sin puntos y comas sin problemas (puntos y comas no son requeridos en JavaScript).

Extracto de "An Open Letter to JavaScript Leaders Regarding Semicolons":

[Depender de ASI (Inserción automática de puntos y comas)] es bastante seguro, y perfectamente válido que cualquier navegador web entiende, Compilador Closure, yuicompressor, packer y jsmin todos pueden perfectamente minificarlo. No existe impacto en la performance.

Lamento que, en vez de educarlos, sus líderes en este lenguaje les han dado mentiras y miedos. Que sinvergüenza. Yo te recomiendo aprender como las declaraciones realmente terminan en JavaScript (y en cuales casos no terminan), de esta manera tú puedes escribir código que encuentres hermoso.

En general, \n termina una declaración a menos que La declaración tiene sin cerrar un paréntesis, array literal, u objeto literal o termina de una manera no válida (por instancia, terminar con . o ,) La línea es -- o ++ (en este caso esto decrementa/incrementa el proximo token) Es un for(), while(), do, if(), o else, no exista una llave { La próxima línea empieza con [, (, +, *, /, -, ,, . o algún operador binario que solo se encuentra entre dos tokens en una sola expresión

El primero es bastante obvio. Incluso JSLint no tiene problemas con caracteres \n en JSON y constructores entre paréntesis, y con declaraciones var que lapsan múltiples líneas terminando con ,.

El segundo es super raro. Yo nunca he visto un caso (fuera de este tipo de conversaciones) donde quisieras escribir i\n++\nj, pero, de hecho eso es analizado como i; ++j;y no j++; j.

El tercero es bien entendido, es generalmente despreciado. if (x)\ny() es equivalente a if (x) { y() }. El constructor no termina hasta que alcanza un bloque o una declaración.

; es una declaración JavaScript válida, entonces if(x); es el equivalente a if(x){} o “Sí x, hacer nada” Esto es más comúnmente aplicado a bucles donde el bucle también chequea si la función actualiza, No es usual, pero existe.

El cuarto es generalmente el caso inducido “Oh no, necesitas puntos y comas”. Pero pasa que es bastante simple darle el prefijo a esas linas con puntos y comas, si no quieres que sean la continuación de la línea previa. Por ejemplo, en vez de esto:

foo();
[1,2,3].forEach(bar);

Podrías hacer esto:

foo()
;[1,2,3].forEach(bar)

La ventaja es que los prefijos son fáciles de notar, una vez te acostumbras a ver líneas que no empiecen con ( o [ sin puntos y comas.

Fin de la cita de "An Open Letter to JavaScript Leaders Regarding Semicolons".