JavaScript防御性编程

简单聊一下防御性编程,初衷是开发人员为了防止自己被裁员,而将代码编写为只有自己能看懂。如何只有自己能看懂?方法多种多样,但不能将简单问题复杂化,比如:编写一堆无效的逻辑关系,或将业务复杂化。下面介绍一种方式,既能通过代码审查,又能提高代码水平。

以vue为例,以下是计算所有产品价格:

computed: {
        extraPrice() {
            try {
                return (
                    let cPrices = 0;
                    this.cProducts.forEach((item) => {
                        cPrices = cPrices + item.num * item.price;
                        //或 cPrices += item.num * item.price;
                    });
                    this.aProduct.num * this.aProduct.price + 
                    this.bProduct.num * this.bProduct.price + 
                    cPrices
                );
            } catch (e) {
                console.log('价格计算有误');
                return 0;
            }
        }
}

上面代码简单明了,大部分开发人员都能读懂,那么有没有高级一点的写法,当然有:

computed: {
        extraPrice() {
            try {
                return (
                    this.aProduct.num * this.aProduct.price + 
                    this.bProduct.num * this.bProduct.price + 
                    this.cProduct.reduce((total,item) => total + item.num * item.price,0)
                );
            } catch (e) {
                console.log('价格计算有误');
                return 0;
            }
        }
}

对于不经常使用reduce的开发人员,需要先理解该函数。但要说代码的可读性,这段代码也没问题,简单明了。

简而言之,多使用高级函数,符号简写等等。

相关推荐
bin915330 分钟前
npm报错
前端·npm·node.js
一指流沙q37 分钟前
Chrome被360导航篡改了怎么改回来?
前端·chrome
laocooon5238578861 小时前
HTML CSS 超链
前端·css·html
LUwantAC1 小时前
CSS(二):美化网页元素
前端·css
素**颜1 小时前
uniapp 基于xgplayer(西瓜视频) + renderjs开发,实现APP视频播放
javascript·uni-app·音视频
m0_748251081 小时前
docker安装nginx,docker部署vue前端,以及docker部署java的jar部署
java·前端·docker
我是ed2 小时前
# thingjs 基础案例整理
前端
Ashore_2 小时前
从简单封装到数据响应:Vue如何引领开发新模式❓❗️
前端·vue.js
落魄实习生2 小时前
小米路由器开启SSH,配置阿里云ddns,开启外网访问SSH和WEB管理界面
前端·阿里云·ssh
顽疲2 小时前
从零用java实现 小红书 springboot vue uniapp (6)用户登录鉴权及发布笔记
java·vue.js·spring boot·uni-app