这些被同事喷的JS代码风格你写过多少？(3)

NO：函数功能混乱，一个函数包含多个功能。最后就像能以一当百的老师傅一样，被乱拳打死（乱拳（功能复杂函数）打死老师傅（老程序员））

function sendEmailToClients(clients) {  
  clients.forEach(client => {  
    const clientRecord = database.lookup(client)  
    if (clientRecord.isActive()) {  
      email(client)  
    }  
  })  
} 

YES： 功能拆解,

function sendEmailToActiveClients(clients) {  //各个击破，易于维护和复用  
  clients.filter(isActiveClient).forEach(email)  
}  
function isActiveClient(client) {  
  const clientRecord = database.lookup(client)  
  return clientRecord.isActive()  
} 

（6）优先使用命令式编程

NO: 使用for循环编程

for(i = 1; i <= 10; i++) { // 一看到for循环让人顿生不想看的情愫  
   a[i] = a[i] +1;  
} 

YES：使用命令式编程

let b = a.map(item => ++item) // 怎么样，是不是很好理解，就是把a的值每项加一赋值给b就可以了。现在在javascript中几乎所有的for循环都可以被map,filter,find,some,any,forEach等命令式编成取代。 

（7）函数中过多的采用if else ..

No： if else过多

if (a === 1) {  
    ...  
} else if (a ===2) {  
    ...  
} else if (a === 3) {  
    ...  
} else {  
   ...  
} 

YES: 可以使用switch替代或用数组替代

switch(a) {  
   case 1:  
           ....  
   case 2:  
           ....  
   case 3:  
           ....  
  default:  
       ....  
}  
Or  
let handler = {  
    1: () => {....},  
    2: () => {....}.  
    3: () => {....},  
    default: () => {....}  
}  
handler[a]() || handler['default']() 

三、尽量使用ES6，有可以能的话ES7中新语法

（只罗列最常用的新语法，说实话，有些新语法不怎么常用）

（1）尽量使用箭头函数

NO：采用传统函数

function foo() {  
  // code  
}  
YES：使用箭头函数  
let foo = () => {  
  // code  
} 

（2）连接字符串

NO：采用传统+号

var message = 'Hello ' + name + ', it's ' + time + ' now' 

YES：采用模板字符

var message = `Hello ${name}, it's ${time} now` 

（3）使用解构赋值

NO：使用传统赋值：

var data = { name: 'dys', age: 1 };  
var name = data.name;  
var age = data.age;  
var fullName = ['jackie', 'willen'];  
var firstName = fullName[0];  
var lastName = fullName[1]; 

（编辑：ASP站长网）