JavaScript 是一门动态类型的语言，使用起来非常方便，但也很容易犯错。因此，许多开发者在编写 JavaScript 代码时会使用 JSHint 来检查代码中的潜在问题。其中一个常见的警告是：不要使用位运算符。
为什么 JSHint 反对位运算符？
JSHint 反对位运算符的主要原因是，它们通常会导致混淆和难以维护的代码。例如，以下代码使用了位运算符 & 和 | 来进行布尔逻辑操作：
var isReady = status & 1 && data & 2 | hasPermission;
这段代码可能很难理解，因为它需要记住每个位的含义，并且可能会产生奇怪的副作用。同样的操作，使用更明确的逻辑运算符，会更容易阅读和理解：
var isReady = (status === 1) && (data === 2 || hasPermission);
此外，位运算符还可能导致类型转换错误。例如，使用位运算符 ~（按位取反）来实现数组元素的删除：
var items = [1, 2, 3]; items[1] = items[items.length - 1]; items.length = items.length - 1;
这段代码可以使用位运算符 ~ 来实现更简单的删除：
var items = [1, 2, 3]; var indexToRemove = 1; items[indexToRemove] = ~indexToRemove && items.pop();
然而，这种方式可能会导致类型转换错误，因为 ~0 === -1，所以在删除第一个元素时，它会变成一个非零数字，从而导致剩余元素的移动。
如何改写代码？
避免使用位运算符是很好的建议，但有时候可能需要使用它们来解决一些特定的问题。在这种情况下，可以通过使用 ES6 的新功能，如模板字面量和位运算符，来改进代码。例如，以下代码使用位运算符 << 和 | 来创建一个状态字：
const STATUS_NEW = 1 << 0; const STATUS_PENDING = 1 << 1; const STATUS_COMPLETED = 1 << 2; const status = STATUS_NEW | STATUS_PENDING; console.log(status.toString(2)); // 输出 "11"
这段代码可以使用模板字面量和位运算符 | 来实现更简洁和易读的代码：
-- -------------------- ---- ------- ----- ------ - - ---- ------- -------- ------- ---------- ------- -- ----- ------ - ---------- - --------------- -------------------------------- -- -- ----
这段代码使用二进制字面量，将状态码与名称关联起来，并且使用位运算符 | 来创建一个状态字。最后，使用 toString(2) 方法将状态字转换为二进制字符串进行输出。
总结
避免使用位运算符是一个好的编程习惯，在大多数情况下，使用更明确和易读的逻辑运算符会更好地表示意图。然而，在一些特殊情况下，使用位运算符可以提高代码的性能和可读性。在编写 JavaScript 代码时，应该根据具体情况选择最佳的方法来表达代码的含义和目的。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/25604