幂等问题 vs 如何判断是否是4的幂

Posted 星期一研究室

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了幂等问题 vs 如何判断是否是4的幂相关的知识,希望对你有一定的参考价值。

🤹序言

我们以前在做数学的时候,经常会有各种幂等计算。比如说,40=1;41=4;42=16;43=64;44=256;像诸如此类的计算就是幂等。

那如果把它放到前端的程序中,又该如何来说判断呢?

🚴一、需求分析 - 判断是否是4的幂等

首先,我们想要实现的是,当输入一个数时,点击判断。如果符合4的幂,那么输入框里面的数变为绿色;反之不符合的话,那么输入框的数就变为红色。如下图所示:

那么接下来,我们由浅入深的来讲解一种实现效果。

🤾二、实现版本

1. 版本一:中规中矩法

先附上代码:

html 代码:

<input id="num" value="65536"></input>
<button id="checkBtn">判断</check>

CSS 代码:

#num {
  color: black;
}

#num.yes {
  color: green;
}

#num.no {
  color: red;
}

JS 代码:

funciton isPowerOfFour(num) {
    num = parseInt(num);
   	
    while(num > 1) {
        if(num % 4) return false;
        num /= 4;
    }
    return true;
}

最中规中矩的方法是上面这一种方法,首先先将 num4 取余,如果发现取余后不为 0 ,那么返回 false

如果满足,那么继续对 num 进行除以 4 操作,以此步骤进行循环,直到 num <= 1 为止。

2. 版本二:按位与

先附上代码:

HTML 代码:

<input id="num" value="65536"></input>
<button id="checkBtn">判断</check>

CSS 代码:

#num {
  color: black;
}

#num.yes {
  color: green;
}

#num.no {
  color: red;
}

JS 代码:

function isPowerOfFour(num) {
    num = parseInt(num);
    
    while(num > 1) {
        // 对4取余相当于判断二进制数的末两位
        if(num & 0b11) return false;
        // 将 num 右移两位
        num >>>= 2;
    }
    return true;
}

第二种方式我们可以采用按位与操作,对 4 取余就相当于判断二进制数的末两位,也就是 0b11 。之后将 num 右移两位,即 num >>>= 2

3. 版本三:按位与优化

先附上代码:

HTML 代码:

<input id="num" value="65536"></input>
<button id="checkBtn">判断</check>

CSS 代码:

#num {
  color: black;
}

#num.yes {
  color: green;
}

#num.no {
  color: red;
}

JS 代码:

function isPowerOfFour(num) {
    num = parseInt(num);
    
    return num > 0 &&
        	(num & (num - 1)) === 0 &&
        	(num & 0xAAAAAAAA) === 0
}

版本二事实上是 log(n) 的一个事件复杂度,那我们还可以再继续优化,也就是上面的版本三,常数复杂度的算法 O(1)

首先第一个条件是, num 必须大于 0

第二个条件呢,是 (num & (num - 1)) === 0 。用于在每一次计算后去掉当前数最末位的 1 。如果数字只有一个 1 时,过滤出数字里面只有一个 1 的二进制数。

第三个条件是判断,这些数的末位不能有 13579 等奇数个 0 的情况。

对于这种算法来说,算是性能相对较好、代码相对也比较简洁,所以在实际的使用中,还是值得使用的。

4. 版本四:正则匹配法

先附上代码:

HTML 代码:

<input id="num" value="65536"></input>
<button id="checkBtn">判断</check>

CSS 代码:

#num {
  color: black;
}

#num.yes {
  color: green;
}

#num.no {
  color: red;
}

JS 代码:

function isPowerOfFour(num) {
    // 先把 num 转成一个二进制的字符串
    num = parseInt(num).toString(2);
    // 再用正则表达式来匹配这个二进制的字符串
    return /^1(?:00)*$/.test(num);
}

如果遇到计算规模不是很大的时候,我们还可以用正则表达式的方式来处理。上面这种方法利用 javascript 转换字符串和正则的特性,来对 4 的幂等进行计算。

相比于第三种方法来说,时间开销确实会大一点,但还是算在可以接受的范围内。

⛹️三、结束语

在上面的文章中,我们使用了 4 种方法来解决幂等问题,有时间复杂度很低的按位与优化,还有简洁明了的正则匹配法。不知道大家是否都掌握了呢?

如果您觉得这篇文章有帮助到您的的话不妨点赞支持一下哟~~😉

🤼往期推荐

👉紧跟月影大佬的步伐,一起来学习如何写好JS(上)

👉紧跟月影大佬的步伐,一起来学习如何写好JS(下)

👉每天都在红绿灯前面梭行,不如自己来实现个红绿灯?

以上是关于幂等问题 vs 如何判断是否是4的幂的主要内容,如果未能解决你的问题,请参考以下文章

180705-一个简单的幂等工具类实现

如何保证接口的幂等性?常见的实现方案有哪些?

如何保证接口的幂等性?常见的实现方案有哪些?

如何保证接口的幂等性?常见的实现方案有哪些?

如何保证接口的幂等性?常见的实现方案有哪些?

如何避免重复提交?分布式服务的幂等性设计!