常用的JavaScript编程风格

更新日期: 2019-03-13 阅读: 2.9k 标签: 规范

工作中好的编程风格会更友好,不好的编程风格会让队友难受


变量的声明

使用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循环想得到的效果
以上就是平时比较常见的编程风格,还有很多没列出来,更多的请参考编程风格  


本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!

链接: https://fly63.com/article/detial/2868

相关推荐

什么是驼峰命名?骆驼式命名法规范

骆驼式命名法(Camel-Case)又称驼峰式命名法,是电脑程式编写时的一套命名规则(惯例)。正如它的名称CamelCase所表示的那样,是指混合使用大小写字母来构成变量和函数的名字

web开发,前后分离接口规范

目前我们现在用的前后端分离模式属于第一阶段,下一阶段可以在前端工程化方面,对技术框架的选择、前端模块化重用方面,可多做考量。也就是要迎来“==前端为主的 MV* 时代==”。

CSS规范

CSS 指层叠样式表 (Cascading Style Sheets),定义如何显示 HTML 元素,但由于 CSS 天生全局性,随着项目复杂度增加,极易出现样式覆盖以及其它的问题。

前端变量命名规范

程序开发过程中变量命名不仅是一个头疼问题,也是一个对开发者综合素质的检验,它会直接影响到代码的最终交付质量、代码Review人员心智承受力。如何写出具有创造性、优雅性、易读性的高质量代码,需要开发者在实际工作中不断总结、提炼

js中箭头函数的编码规范,如何更好的使用箭头函数

当您必须使用匿名函数,请使用箭头函数表示法,它创建了一个在 this 上下文中执行的函数的版本,这通常是你想要的,而且这样的写法更为简洁。如果你有一个相当复杂的函数,你或许可以把逻辑部分转移到一个声明函数上。

Web前端开发规范手册

文件命名规则:文件名称统一用小写的英文字母、数字和下划线的组合。引文件统一使用index.htm index.html index.asp文件名(小写),图片的名称分为头尾两部分,用下划线隔开,头部分表示此图片的大类性质

W3C标准及规范

W3C的意思是万维网联盟(World Wide Web Consortium),创建于1994年10月,是一个会员组织,它的工作是对web进行标准化--->W3C 致力于实现所有的用户都能够对 web 加以利用

web前端js中ES6的规范写法

引号的使用,单引号优先(如果不是引号嵌套,不要使用双引号)、空格的使用问题:(关键字后 符号后 排版 函数 赋值符号= )等、不写没有使用过的变量,如果定义了一个变量,后来一直没有参与过运算,那么不应该定义这个变量...

JavaScript 命名约定最佳实践

在开发过程中,遵循标准的命名约定可以提高代码的可读性。下面就来看看 JavaScript 中命名约定的最佳实践。JavaScript 变量名称是区分大小写的,大写和小写字母是不同的。

用standard来管理JavaScript 代码规范

standard是一个开源的JS代码规范库,制定了所谓standard(标准)的JS代码规范,配合编辑器插件可以实时检查代码规范以及语法错误,通过执行命令检查代码规范以及语法错误,自动修复(可以直接修复的)不合规范的代码,使其符合规范

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!