命名

1.变量

变量命名推荐采用小驼峰命名法—即首字母小写,后每个单词首字母大写。

let name = '张三';
let userName = 'echo';


2.常量

常量命名推荐采用全字母大写命名,以便于与变量区分。

const PI = 3.141592653;


3.函数

函数命名推荐使用小驼峰命名法,条件允许情况下请采用动词前缀方式,请保证函数命名语义化明确。

// 判断是否能执行某个操作/权限
function canLogin() {};
// 判断是否有某个值
function hasUserName() {};
// 判断是否是某个值
function isUserName() {};
// 获取某个值
function getUserName() {};
// 设置某个值
function setUserName() {};
// 加载数据
function loadData() {};

编程规范

1.推荐使用对象直接量创建对象,而非构造器创建

// 创建普通对象
// 应该
let obj = {a: 1}
// 不应该
let obj = new Object();
obj.a = 1;

// 创建函数
// 应该
function getName(){}; //函数声明
let getName = function() {}; //函数表达式
// 不应该
let getName = new Function();

2.变量、函数请保证先声明后使用,统一作用域的变量声明请集中管理

虽然ES6使用let已经不存在变量提升,避免了这个问题,但若仍使用了var声明请遵守这一点

// 应该
function demo() {
    var a = 1;
    var b = 2;
    var c = 3;
    console.log(a);
    console.log(b);
};
// 不应该
function demo() {
    var a = 1;
    console.log(a);
    var b = 2;
    var c = 3;
    console.log(b);
};

虽然代码示例只有一个函数内,总体来说,写一段代码时,要注意哪些变量可能会修改,如何编写代码能让代码可读性更高是优秀代码的评判标准.

比如全局变量,可以放在整个代码块最开始声明,方便后续维护和理解.

代码示例

<script>
		// 获取字段1
		var field1 = FormUtil.getField('field1');
		// 声明字段2和字段2的值
		var field2 = 'field2';
		var field2Value = 'test';
		// 当字段1改变时,给字段2赋值
		$(field1).change(function(){
            setFormValue(field2,field2Value);
        })
		
		// 提供给下面的 setFormValue 函数使用
        function strInputArr(str,arr){
            var flag = false
            for(var i = 0;i<arr.length;i++){
                if(str == arr[i]){
                    flag =  true
                }
            }
            return flag
        }


		//设置表单字段值
		function setFormValue(fieldId,updateValue){
            var e=FormUtil.getField(fieldId);
            if(e.is('input')&&e.attr('type')&&e.attr('type')=='radio'){
                if(updateValue&&(e.attr('value')==updateValue)){
                    e.attr('checked','checked');
                }else{
                    e.removeAttr('checked');
                }
            }else if(e.is('input')&&e.attr('type')&&e.attr('type')=='checkbox'){
                if(updateValue&&strInputArr(e.attr('value'),updateValue.split(";"))){
                    e.attr('checked','checked');
                }else{
                    e.removeAttr('checked');
                }
            }else if(e.is('select')){
                $.each(e.find('option'),function(){
                    var opt=$(this);
                    if(updateValue&&strInputArr(opt.attr('value'),updateValue.split(";"))){
                        opt.attr('selected','selected');
                    }else{
                        opt.removeAttr('selected');
                    }
                });
                setTimeout(function(){ e.trigger("change");e.trigger("chosen:updated"); }, 500);
            }else{
                e.val(updateValue);
                e.change();
            }
        }
</script>

如果上段代码需要修改字段2的值,只需要修改代码最开始的变量值声明即可.


  • No labels