- 1.組件名聽從駝峯形式,第一個字母大寫
- 2.方法名、參數名、成員變量、局部變量聽從駝峯形式,第一個字母必須小寫
- 3.常量命名所有大寫,單詞間用下劃線隔開,力求語義表達完整清楚,不要嫌名字長;
- 4.私有方法,方法名前面加下劃線
複製代碼
- 1.公共組件使用說明
- 2.各組件中重要函數或者類說明
- 3.複雜的業務邏輯處理說明
- 4.特殊狀況的代碼處理說明,對於代碼中特殊用途的變量、存在臨界值、使用了某種算法或思路等須要進行註釋描述
複製代碼
indent
function hello (name) {
console.log('hi', name)
}
複製代碼
quotes
console.log('hello there')
$("<div class='box'>")
複製代碼
no-unused-vars
function myFunction () {
var result = something() // ✗ avoid
}
複製代碼
keyword-spacing
if (condition) { ... } // ✓ ok
if(condition) { ... } // ✗ avoid
複製代碼
space-before-function-paren
function name (arg) { ... } // ✓ ok
function name(arg) { ... } // ✗ avoid
run(function () { ... }) // ✓ ok
run(function() { ... }) // ✗ avoid
複製代碼
===
替代 ==
。 例外: obj == null
能夠用來檢查 null || undefined
。eqeqeq
if (name === 'John') // ✓ ok
if (name == 'John') // ✗ avoid
if (name !== 'John') // ✓ ok
if (name != 'John') // ✗ avoid
複製代碼
space-infix-ops
// ✓ ok
var x = 2
var message = 'hello, ' + name + '!'
// ✗ avoid
var x=2
var message = 'hello, '+name+'!'
複製代碼
comma-spacing
// ✓ ok
var list = [1, 2, 3, 4]
function greet (name, options) { ... }
// ✗ avoid
var list = [1,2,3,4]
function greet (name,options) { ... }
複製代碼
brace-style
// ✓ ok
if (condition) {
// ...
} else {
// ...
}
// ✗ avoid
if (condition) {
// ...
}
else {
// ...
}
複製代碼
curly
// ✓ ok
if (options.quiet !== true) console.log('done')
// ✓ ok
if (options.quiet !== true) {
console.log('done')
}
// ✗ avoid
if (options.quiet !== true)
console.log('done')
複製代碼
handle-callback-err
// ✓ ok
run(function (err) {
if (err) throw err
window.alert('done')
})
// ✗ avoid
run(function (err) {
window.alert('done')
})
複製代碼
Exceptions are: document, console and navigator.
no-undef
window.alert('hi') // ✓ ok
javascript
no-multiple-empty-lines
// ✓ ok
var value = 'hello world'
console.log(value)
// ✗ avoid
var value = 'hello world'
console.log(value)
複製代碼
operator-linebreak
// ✓ ok
var location = env.development ? 'localhost' : 'www.api.com'
// ✓ ok
var location = env.development
? 'localhost'
: 'www.api.com'
// ✗ avoid
var location = env.development ?
'localhost' :
'www.api.com'
複製代碼
one-var
// ✓ ok
var silent = true
var verbose = true
// ✗ avoid
var silent = true, verbose = true
// ✗ avoid
var silent = true,
verbose = true
複製代碼
===
)錯寫成了等號(=
)。no-cond-assign
// ✓ ok
while ((m = text.match(expr))) {
// ...
}
// ✗ avoid
while (m = text.match(expr)) {
// ...
}
複製代碼
block-spacing
function foo () {return true} // ✗ avoid
function foo () { return true } // ✓ ok
複製代碼
camelcase
function my_function () { } // ✗ avoid
function myFunction () { } // ✓ ok
var my_var = 'hello' // ✗ avoid
var myVar = 'hello' // ✓ ok
複製代碼
comma-dangle
var obj = {
message: 'hello', // ✗ avoid
}
複製代碼
comma-style
var obj = {
foo: 'foo'
,bar: 'bar' // ✗ avoid
}
var obj = {
foo: 'foo',
bar: 'bar' // ✓ ok
}
複製代碼
dot-location
console.
log('hello') // ✗ avoid
console
.log('hello') // ✓ ok
複製代碼
eol-last
func-call-spacing
console.log ('hello') // ✗ avoid
console.log('hello') // ✓ ok
複製代碼
key-spacing
var obj = { 'key' : 'value' } // ✗ avoid
var obj = { 'key' :'value' } // ✗ avoid
var obj = { 'key':'value' } // ✗ avoid
var obj = { 'key': 'value' } // ✓ ok
複製代碼
new-cap
function animal () {}
var dog = new animal() // ✗ avoid
function Animal () {}
var dog = new Animal() // ✓ ok
複製代碼
new-parens
function Animal () {}
var dog = new Animal // ✗ avoid
var dog = new Animal() // ✓ ok
複製代碼
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
}
}
複製代碼
constructor-super
class Dog {
constructor () {
super() // ✗ avoid
}
}
class Dog extends Mammal {
constructor () {
super() // ✓ ok
}
}
複製代碼
no-array-constructor
var nums = new Array(1, 2, 3) // ✗ avoid
var nums = [1, 2, 3] // ✓ ok
複製代碼
no-caller
function foo (n) {
if (n <= 0) return
arguments.callee(n - 1) // ✗ avoid
}
function foo (n) {
if (n <= 0) return
foo(n - 1)
}
複製代碼
no-class-assign
class Dog {}
Dog = 'Fido' // ✗ avoid
複製代碼
no-const-assign
const score = 100
score = 125 // ✗ avoid
複製代碼
no-constant-condition
if (false) { // ✗ avoid
// ...
}
if (x === 0) { // ✓ ok
// ...
}
while (true) { // ✓ ok
// ...
}
複製代碼
no-control-regex
var pattern = /\x1f/ // ✗ avoid
var pattern = /\x20/ // ✓ ok
複製代碼
no-debugger
function sum (a, b) {
debugger // ✗ avoid
return a + b
}
複製代碼
no-delete-var
var name
delete name // ✗ avoid
複製代碼
no-dupe-args
function sum (a, b, a) { // ✗ avoid
// ...
}
function sum (a, b, c) { // ✓ ok
// ...
}
複製代碼
no-dupe-class-members
class Dog {
bark () {}
bark () {} // ✗ avoid
}
複製代碼
no-dupe-keys
var user = {
name: 'Jane Doe',
name: 'John Doe' // ✗ avoid
}
複製代碼
no-duplicate-case
switch (id) {
case 1:
// ...
case 1: // ✗ avoid
}
複製代碼
no-duplicate-imports
import { myFunc1 } from 'module'
import { myFunc2 } from 'module' // ✗ avoid
import { myFunc1, myFunc2 } from 'module' // ✓ ok
複製代碼
no-empty-character-class
const myRegex = /^abc[]/ // ✗ avoid
const myRegex = /^abc[a-z]/ // ✓ ok
複製代碼
no-empty-pattern
const { a: {} } = foo // ✗ avoid
const { a: { b } } = foo // ✓ ok
複製代碼
no-eval
eval( "var result = user." + propName ) // ✗ avoid
var result = user[propName] // ✓ ok
複製代碼
no-ex-assign
try {
// ...
} catch (e) {
e = 'new value' // ✗ avoid
}
try {
// ...
} catch (e) {
const newVal = 'new value' // ✓ ok
}
複製代碼
no-extend-native
Object.prototype.age = 21 // ✗ avoid
複製代碼
no-extra-bind
const name = function () {
getName()
}.bind(user) // ✗ avoid
const name = function () {
this.getName()
}.bind(user) // ✓ ok
複製代碼
no-extra-boolean-cast
const result = true
if (!!result) { // ✗ avoid
// ...
}
const result = true
if (result) { // ✓ ok
// ...
}
複製代碼
no-extra-parens
const myFunc = (function () { }) // ✗ avoid
const myFunc = function () { } // ✓ ok
複製代碼
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()
}
複製代碼
no-floating-decimal
const discount = .5 // ✗ avoid
const discount = 0.5 // ✓ ok
複製代碼
no-func-assign
function myFunc () { }
myFunc = myOtherFunc // ✗ avoid
複製代碼
*不要對全局只讀對象從新賦值。java
####eslint: no-global-assign
正則表達式
window = {} // ✗ avoid
複製代碼
####eslint: no-implied-eval
算法
setTimeout("alert('Hello world')") // ✗ avoid
setTimeout(function () { alert('Hello world') }) // ✓ ok
複製代碼
no-inner-declarations
if (authenticated) {
function setAuthUser () {} // ✗ avoid
}
複製代碼
no-invalid-regexp
RegExp('[a-z') // ✗ avoid
RegExp('[a-z]') // ✓ ok
複製代碼
no-irregular-whitespace
function myFunc () /*<NBSP>*/{} // ✗ avoid
api
__iterator__
。####eslint: no-iterator
數組
Foo.prototype.__iterator__ = function () {} // ✗ avoid
瀏覽器
no-label-var
var score = 100
function game () {
score: 50 // ✗ avoid
}
複製代碼
no-labels
label:
while (true) {
break label // ✗ avoid
}
複製代碼
no-lone-blocks
function myFunc () {
{ // ✗ avoid
myOtherFunc()
}
}
function myFunc () {
myOtherFunc() // ✓ ok
}
複製代碼
no-mixed-spaces-and-tabs
no-multi-spaces
const id = 1234 // ✗ avoid
const id = 1234 // ✓ ok
複製代碼
no-multi-str
const message = 'Hello \ world' // ✗ avoid
new 建立對象實例後須要賦值給變量。
eslint: no-new
new Character() // ✗ avoid
const character = new Character() // ✓ ok
複製代碼
no-new-func
var sum = new Function('a', 'b', 'return a + b') // ✗ avoid
bash
no-new-object
let config = new Object() // ✗ avoid
app
no-new-require
const myModule = new require('my-module') // ✗ avoid
less
no-new-symbol
const foo = new Symbol('foo') // ✗ avoid
no-new-wrappers
const message = new String('hello') // ✗ avoid
no-obj-calls
const math = Math() // ✗ avoid
no-octal
const num = 042 // ✗ avoid
const num = '042' // ✓ ok
複製代碼
no-octal-escape
const copyright = 'Copyright \251' // ✗ avoid
__dirname
和__filename
時儘可能避免使用字符串拼接。no-path-concat
const pathToFile = __dirname + '/app.js' // ✗ avoid
const pathToFile = path.join(__dirname, 'app.js') // ✓ ok
複製代碼
__proto__
。no-proto
const foo = obj.__proto__ // ✗ avoid
const foo = Object.getPrototypeOf(obj) // ✓ ok
複製代碼
no-redeclare
let name = 'John'
let name = 'Jane' // ✗ avoid
let name = 'John'
name = 'Jane' // ✓ ok
複製代碼
no-regex-spaces
const regexp = /test value/ // ✗ avoid
const regexp = /test {3}value/ // ✓ ok
const regexp = /test value/ // ✓ ok
複製代碼
no-return-assign
function sum (a, b) {
return result = a + b // ✗ avoid
}
function sum (a, b) {
return (result = a + b) // ✓ ok
}
複製代碼
no-self-assign
name = name // ✗ avoid
no-self-compare
if (score === score) {} // ✗ avoid
no-sequences
if (doSomething(), !!test) {} // ✗ avoid
no-shadow-restricted-names
let undefined = 'value' // ✗ avoid
Sparse arrays
)。no-sparse-arrays
let fruits = ['apple',, 'orange'] // ✗ avoid
no-tabs
no-template-curly-in-string
const message = 'Hello ${name}' // ✗ avoid
const message = `Hello ${name}` // ✓ ok
複製代碼
no-this-before-super
class Dog extends Animal {
constructor () {
this.legs = 4 // ✗ avoid
super()
}
}
複製代碼
no-throw-literal
throw 'error' // ✗ avoid
throw new Error('error') // ✓ ok
複製代碼
no-trailing-spaces
no-undef-init
let name = undefined // ✗ avoid
let name
name = 'value' // ✓ ok
複製代碼
no-unmodified-loop-condition
for (let i = 0; i < items.length; j++) {...} // ✗ avoid
for (let i = 0; i < items.length; i++) {...} // ✓ ok
複製代碼
no-unneeded-ternary
let score = val ? val : 0 // ✗ avoid
let score = val || 0 // ✓ ok\
複製代碼
no-unreachable
function doSomething () {
return true
console.log('never called') // ✗ avoid
}
複製代碼
no-unsafe-finally
try {
// ...
} catch (e) {
// ...
} finally {
return 42 // ✗ avoid
}
複製代碼
no-unsafe-negation
if (!key in obj) {} // ✗ avoid
no-useless-call
sum.call(null, 1, 2, 3) // ✗ avoid
no-useless-computed-key
const user = { ['name']: 'John Doe' } // ✗ avoid
const user = { name: 'John Doe' } // ✓ ok
複製代碼
no-useless-constructor
class Car {
constructor () { // ✗ avoid
}
}
複製代碼
no-useless-escape
let message = 'Hell\o' // ✗ avoid
import
, export
和解構操做中,禁止賦值到同名變量。no-useless-rename
import { config as config } from './config' // ✗ avoid
import { config } from './config' // ✓ ok
複製代碼
no-whitespace-before-property
user .name // ✗ avoid
user.name // ✓ ok
複製代碼
no-with
with (val) {...} // ✗ avoid
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
複製代碼
padded-blocks
if (user) {
// ✗ avoid
const name = getName()
}
if (user) {
const name = getName() // ✓ ok
}
複製代碼
rest-spread-spacing
fn(... args) // ✗ avoid
fn(...args) // ✓ ok
複製代碼
semi-spacing
for (let i = 0 ;i < items.length ;i++) {...} // ✗ avoid
for (let i = 0; i < items.length; i++) {...} // ✓ ok
複製代碼
space-before-blocks
if (admin){...} // ✗ avoid
if (admin) {...} // ✓ ok
複製代碼
space-in-parens
getName( name ) // ✗ avoid
getName(name) // ✓ ok
複製代碼
space-unary-ops
typeof!admin // ✗ avoid
typeof !admin // ✓ ok
複製代碼
spaced-comment
//comment // ✗ avoid
// comment // ✓ ok
/*comment*/ // ✗ avoid
/* comment */ // ✓ ok
複製代碼
template-curly-spacing
const message = `Hello, ${ name }` // ✗ avoid
const message = `Hello, ${name}` // ✓ ok
複製代碼
use-isnan
if (price === NaN) { } // ✗ avoid
if (isNaN(price)) { } // ✓ ok
複製代碼
valid-typeof
typeof name === 'undefimed' // ✗ avoid
typeof name === 'undefined' // ✓ ok
複製代碼
wrap-iife
const getName = function () { }() // ✗ avoid
const getName = (function () { }()) // ✓ ok
const getName = (function () { })() // ✓ ok
複製代碼
yield-star-spacing
yield* increment() // ✗ avoid
yield * increment() // ✓ ok
複製代碼
yoda
if (42 === age) { } // ✗ avoid
if (age === 42) { } // ✓ ok
複製代碼
semi
window.alert('hi') // ✓ ok
window.alert('hi'); // ✗ avoid
複製代碼
no-unexpected-multiline
// ✓ ok
;(function () {
window.alert('ok')
}())
// ✗ avoid
(function () {
window.alert('ok')
}())
// ✓ ok
;[1, 2, 3].forEach(bar)
// ✗ avoid
[1, 2, 3].forEach(bar)
// ✓ ok
;`hello`.indexOf('o')
// ✗ avoid
`hello`.indexOf('o')
複製代碼
備註:上面的寫法只能說聰明過頭了。
;[1, 2, 3].forEach(bar)
var nums = [1, 2, 3]
nums.forEach(bar)
複製代碼
控制檯輸出,用完即刪除或註釋