常用的JavaScript編程風格

工作中好的編程風格會更友好,不好的編程風格會讓隊友難受

變量的聲明

使用let和const代替var(var存在變量提升等副作用),聲明常量使用const
// bad
var name = 'zero'
// good
let name = 'zero'
// bad
var MAX = 100
// good
const MAX = 100

命名規範

使用小駝峯命名,變量名可讀性好
// bad
let l_name = 'zero'
// good
let lastName = 'zero'

使用變量說明

不要出現讓人覺得晦澀難懂的變量
// bad
if (time < 120) {
    todo()
}
// good
const MINUTES_IN_TWO_HOUR = 120;
if (time < MINUTES_IN_TWO_HOUR) {
    todo()
}

不要重複命名

當一個對象名有意義的時候,對象裏面的key的命名不需要重複對象名
// bad
let Student = {
    studentName = 'zero',
    studentAge = 18
}
// good
let Student = {
    name = 'zero'
    age = 18
}

字符串命名

靜態字符串使用單引號,動態字符串使用反引號
// bad
let name = "zero"
let myName = 'my name is ' + name
// good
let name = 'zero'
let myName = `my name is ${name}`

使用解構賦值

使用數組或者對象給變量賦值的時候,使用解構賦值
let arr = [1, 2, 3, 4]
let obj = {
    name:'zero',
    age:18
}
// bad
let first = arr[0]
let second = arr[1]
let name = obj.name
let age = obj.age
// good
let [first, second] = arr
let {name,age} = obj

使用Object.assign

當給對象賦多個值得時候,使用Object.assign
let obj = {}
// bad
obj.name = 'zero'
obj.age = 18
// good
Object.assign(obj,{
    name:'zero',
    age:18
})

函數參數

函數參數較多的情況,使用對象進行傳參
// bad
function Student(name,age,sex){
    //...
}
// good
let studentConfig = {
    name:'zero',
    age:18,
    sex:'man'
}
function Student(studentConfig){
    //...
}

封裝判斷條件

判斷條件過多的情況可以封裝成一個函數
// bad
if(a===1 && b===2){
    //...
}
// good
function isTure(a,b){
    return a===1 && b===2
}
if(isTrue(a,b)){
    //...
}
其他
1.使用函數的默認傳參來避免對函數參數的判斷
2.函數名要表達出函數是幹什麼的,比如 isEmail(),讓人一看就知道是判斷email的,而且返回值是布爾類型
3.對於數組,少用for循環,Array.forEach,Array.every,Array.some,Array.map,Array.filter基本可以滿足for循環想得到的效果
以上就是平時比較常見的編程風格,還有很多沒列出來,更多的請參考編程風格
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章