style-guide-open-questions.js

// Open Questions


// Q: Should we use void 0 or undefined?
// ---
// A: Very old versions of JS allow for assigning to `undefined`, which was an argument for preferring `void 0`,
// but strict mode will throw an error on attempted assignment to non-writeable properties (like `undefined`)
// ---
// tldr; `void 0` is JS trivia, prefer more expressive and totally safe `undefined`
// ----
// More details: http://johnkpaul.com/blog/2013/10/27/avoid-void-0/

// Q: Do we need to include `constructor` in our components if it doesn't do anything besides call `super`?
// ---
// A: no, there is no need to have a constructor if it only calls super
// ---
// tldr; no, there is no need to have a constructor if it only calls super
// ---
// More details: http://cheng.logdown.com/posts/2016/03/26/683329



// Style Guide Stuff



// ---
// 1. import brace spacing
// ---
// a: bad
import {method} from 'file'
// b: good
import { method } from 'file'


// ---
// 2. destructuring spacing
// ---
// a: good
const { a, b } = myObject
const { a: aAlias, b: bAlias } = myObject
// b: bad
const {a, b} = myObject
const {a: aAlias, b: bAlias} = myObject

// ---
// 3. array access spacing
// ---
// a: bad
const veggie = vegetables[ 0 ]
// b: good
const veggie = vegetables[0]

// ---
// 3. array initialization spacing
// ---
// a: good
const vegetables = [ 'green bean', 'broccoli' ]
// b: bad
const vegetables = ['green bean', 'broccoli']

// ---
// 4. semi-colons
// ---
// a: bad
const insect = 'cricket';
// b: good
const insect = 'cricket'

// ---
// 5. import order
// ---
// a: good
import aAction from '../actions/a-action'
import bStore from '../stores/b-store'
import cAction from '../actions/c-action'
import {dUtil, aUtil} from '../../common/utils/niche-utils'

class Potato extends React.Component { ... }

// b: bad
import aAction from '../actions/a-action'
import cAction from '../actions/c-action'

import bStore from '../stores/b-store'

import {dUtil, aUtil} from '../../common/utils/niche-utils'

class Potato extends React.Component { ... }

// ---
// 6. useless contructors
// ---
// a: bad
class Potato extends React.Component {
    constructor(props, context) {
        super(props, context)
    }
    render() {}
}
    
// b: good
class Potato extends React.Component {
    render() {}
}