Sonar 代码检测常见问题及修改实例（前端JS 版本一）

目录

前言

问题

1. Correct this attempt to modify "candidates" or use "let" in its declaration.

2. Expected an assignment or function call and instead saw an expression.

3. Consider using "forEach" instead of "map" as its return value is not being used here.

4. Unreachable code.

5. Duplicate key 'speakerDeviceList'.

6. Add the "let", "const" or "var" keyword to this declaration of "win" to make it explicit.

7. Add a "return" statement to this callback.

8. Rename "package" identifier to prevent potential conflicts with future evolutions of the JavaScript language.

9. Extract this nested ternary operation into an independent statement
​​​​​​​

---

下一篇：《Sonar 代码检测常见问题及修改实例（前端JS版本二）》

前言

Sonar 作为优秀的代码静态检测工具，咱们怎么能落下呢。这不，今天就把环境搭起来了，先拿一个 JS 工程试一试吧。

问题

rcroom 工程是一个 JS 语言为主的工程项目，集成到 Sonar 检测系统中，果然有不少问题，具体的问题清单，如下图所示：

Sonar 中所有的问题按照类型划分，可以分为 Bug、漏洞、异味三种，按照严重程度划分，可以分为阻断、严重、主要、次要、提示五档。如上图所示，该项目 Bug 69个，漏洞0个，异味71个；阻断的19个，主要42个，次要8个，严重和提示均为0个。下面针对上述问题中比较典型展开讨论。

1. Correct this attempt to modify "candidates" or use "let" in its declaration.

问题代码：

修复：

candidates 变量声明时使用 let 代替 const。

2. Expected an assignment or function call and instead saw an expression.

问题代码：

修复：

其实是一个笔误的 bug，修改成赋值语句或者函数调用的形式，而不是表达式。

去掉一个等号 “=” 即可。

3. Consider using "forEach" instead of "map" as its return value is not being used here.

问题代码：

修复：

把 map 方法替换为 forEach 方法即可。

4. Unreachable code.

问题代码：

修复：

去掉 break; 代码行，其实，有些规则不必太死板，有些编码规则就要求每个 case 后边必须跟一个 break；语句。也是可以存在特例的。

5. Duplicate key 'speakerDeviceList'.

问题代码： 

修复：

报错原因是重复声明了，不提示的话确实不容易看出来，哈哈。 瞬间发现了 Sonar 的好处。

6. Add the "let", "const" or "var" keyword to this declaration of "win" to make it explicit.

问题代码：

修复：

显式的定义一个全局变量 win，代码如下：

let win

7. Add a "return" statement to this callback.

问题代码：

修复：

可以增加 return 语句，修改如下：

this.state.agentMapList.map((item) => {

        console.log('item=====>>>', item);

        item.status = 'offline'

        this.agentMap.setItem(item.clientId, JSON.stringify(item))

        tempArray.push(item)

        return null

})

但是，这样修改之后，很可能会触发问题3的提示，所以，一本万利的做法就是直接用 forEach 方法替换 map 方法。

8. Rename "package" identifier to prevent potential conflicts with future evolutions of the JavaScript language.

问题代码：

修复：

原因是检查器认为“package”标识符可能会与JavaScript语言的未来更新迭代发生潜在的冲突，所以，重命名变量名即可。 

9. Extract this nested ternary operation into an independent statement

问题代码：

修复：

其实就是代码写的过于集中臃肿了，把独立的逻辑拆分出来就好了。 

作者简介：😄大家好，我是 Data-Mining（liuzhen007），是一位典型的音视频技术爱好者，前后就职于传统广电巨头和音视频互联网公司，具有丰富的音视频直播和点播相关经验，对 WebRTC、FFmpeg 和 Electron 有非常深入的了解，😄公众号：玩转音视频。同时也是 CSDN 博客专家、华为云享专家（共创编辑）、InfoQ 签约作者，欢迎关注我分享更多干货！😄