项目中前端开发碰到的问题小结

前端规范很重要，养成一个良好的代码规范对日后的维护非常方便，这里总结下碰到的问题，写在这里。

我自己想到的几点关于代码规范

• 必要的注释，方便自己方便他人。

• 命名尽量要有意义，无论是变量还是函数，尽量用英文单词，多个单词使用【动词+名词】格式，驼峰写法。

• 代码缩进，既美观，又方便快捷。

• 捕捉接口返回数据是否成功，若成功则处理，否则提示错误。不要不管返回的数据是否正确就处理，导致一些方法报错，如join()、split()。

• 理清逻辑之后，按顺序在js中写要用的方法。

• 变量、常量初始化、全局函数尽量放在最上层。

新版v6调用接口规范

之前调用接口相对来说繁琐了点，v6版本之后，调用接口，只需要serciceId和相关参数即可，十分方便，以调用获取租户信息接口为例：

 //获取当前登陆账户的租户名、类型
            self.getCustomerName = function(){
                var eiInfo = new EiInfo();
                eiInfo.set("serviceId","OC00_GETTENANTBYID");
                //eiInfo.set("tenantID",self.currentCustomerId);
                eiInfo.set("tenantID",_user.customerId);
                eiInfo.set("showCount",true);
                eihttp.send({service: 'BC20',method: 'invokeBWService',eiinfo: eiInfo}, getCustomerNameByIDSuccess, error);
            }
            function getCustomerNameByIDSuccess(eiInfo){
                //console.log("获取租户名-------->",JSON.stringify(eiInfo));
                //var status = eiInfo.status;
                // 获取最外层的status使用 eiInfo.getStatus() 或eiInfo.status;
                // 内层的是eiInfo.get("status");

                var status = eiInfo.getStatus();
                if(status=='0'){
                    // 展示当前租户名、资源组类型
                    self.currentCustomerName = eiInfo.get("tenantName");
                    self.currentCustomerGroupType = eiInfo.get("tenantGroupType");
                    self.showDefaultInfo = self.currentCustomerName + "  " + "("+  self.currentCustomerGroupType +")";
                }else{
                    toaster.error({title: "失败" , body: "获取当前登陆租户名称失败！"} );
                    console.log("获取当前登陆租户名失败---->",eiInfo.msg);
                }
            }
            function error(){
                console.log("eihttp error---->");
            }
            self.getCustomerName();

eihttp.send({service: 'BC20',method: 'invokeBWService',eiinfo: eiInfo}, onSuccess, onError);接口即使错误，也并不会进入onError回掉函数中

前期我以为eihttp发送请求的时候,后面跟的是两个回掉函数，一个成功回掉，一个失败回掉。

• 如果成功就会执行onSuccess这个成功回掉函数中，

• 如果失败就会执行onError函数中。

理论上是没有问题的，但是后期我发现，只要是接口异常的，它都不会进入onError函数中，这也是后台问我前台报了什么错，我只能说出来现象，却说不出来具体的报错信息。

因为即使我在onErrpr中做了捕捉错误，但是它并不会进到onError，onError里面做的操作都是白搭。

• 后来发现，无论成功与否，接口都会返回给我数据，只是我要通过判断其状态，如果status为0，则成功，否则则失败。

代码如下：

function onSuccess(eiInfo){
                // 先看一下完整的数据
                console.log("接口返回outInfo数据-------->",JSON.stringify(eiInfo));
                // 拿到状态值
                var status = eiInfo.getStatus();
                
                // 状态为0则成功，否则失败
                if(status=='0'){
                    // 成功拿到数据，做的操作
                  
                }else{
                    //失败，提示错误，失败时的操作
                    toaster.error({title: "失败" , body: "接口掉用失败！"} );
                    console.log("errorMsg---->",eiInfo.msg);
                }
            }

• 通过打印eiInfo中的msg属性，就可以捕获到后台报错的详细信息了，然后你懂的，改bug！

在取状态status时要注意的问题

一般后台返回的status属性是与block块放在平级的，两者是平行关系。

如果外层评级中有status，同时block块中也有status，这样就不能直接使用get("status")方法。

【注意】：

• eiInfo.get("status");取到的是内层block中的status属性。
• eiInfo.status; 取到的是外层平级status
• eiInfo.getStatus(); 取到的是外层平级中的status

所以取外层的status状态值，使用以下两种写法：

            var status = eiInfo.status;
             // 获取最外层的status使用 eiInfo.getStatus() 或eiInfo.status;
             // 内层的是eiInfo.get("status");
            var status = eiInfo.getStatus();

---

未完待续...