当前位置：网站首页 > 网页前端技术 > 正文

在JavaScript中，将存储布尔值的变量转换为“0”或“1”的常用方法 - Web前端

作者：98wpeu发布时间：2026-09-16分类：网页前端技术浏览：3

导读：在javascript中，谈到布尔值跟0和1之间的关系，相信大家不会陌生，那么想要将存储布尔值的变量转换为整数“0”或“1”，可以使用多种方法进行转换。今天介绍下常用四种：1、使用...

在javascript中，谈到布尔值跟0和1之间的关系，相信大家不会陌生，那么想要将存储布尔值的变量转换为整数“0”或“1”，可以使用多种方法进行转换。今天介绍下常用四种：

1、使用三元或条件“（）？：”运算符。

2、使用一元+运算符。

3、使用按位和（＆）或按位或（|）运算符。

4、使用Number()函数。它将数据类型转换为数字。

1、使用三元或条件“（）？：”运算符

语法：

var i = value ? 1 : 0;

示例：

<!DOCtype html> 
<HTML> 
<head> 
    <meta charset="UTF-8">
</head> 
<body> 
    <center> 
    	<h2 id="h" style="color:green"></h2>
        <h4>单击按钮，将布尔值更改为数字</h4> 
        <button onclick="myfunction()">转换</button> 
        <p>变量的数值为：</p> 
        <p id="result" style="color:green"></p> 
        <script> 
        	// 将boolvalue初始化为true
            var boolvalue = true
            document.getElementById("h").innerHTML="变量boolvalue的值为："+boolvalue;
            function myFunction() { 
                var i = boolvalue ? 1 : 0; 
                document.getElementById("result").innerHTML = i; 
            } 
        </script> 
  </center> 
</body> 
  
</html>

4、使用一元“+”运算符

语法：

var i = + boolvalue;

示例：

<!DOCTYPE html> 
<html> 
	<head> 
	   	<meta charset="UTF-8">
	</head> 
<body> 
    <center> 
    	<h2 id="h" style="color:green"></h2>
        <h4>单击按钮，将布尔值更改为数字</h4> 
        <button onclick="myFunction()">转换</button> 
        <p>变量的数值为：</p> 
        <p id="result" style="color:green"></p> 
        <script> 
        	// 将boolvalue初始化为true
            var boolvalue = true
            document.getElementById("h").innerHTML="变量boolvalue的值为："+boolvalue;
            function myFunction(){ 
                var i = + boolvalue; 
                document.getElementById("result").innerHTML = i; 
            }
        </script> 
  </center> 
</body> 
  
</html>

3、使用按位和（＆）或按位或（|）运算符

语法：

var i = boolvalue & 1; // 按位和（＆）
var j = boolvalue | 0; // 按位或（|）

例子：

<!DOCTYPE html> 
<html> 
	<head> 
	   	<meta charset="UTF-8">
	</head> 
<body> 
    <center> 
    	<h2 id="h" style="color:green"></h2>
    	<h2 id="h2" style="color:green"></h2>
        <h4>单击按钮，将布尔值更改为数字</h4> 
        <button onclick="myFunction()">转换</button> 
        <p>boolvalue的值现在为：</p> 
        <p id="result"></p> 
        <p>boolvalue2的值现在为：</p> 
        <p id="result2"></p> 
        <script> 
        	// 将boolvalue初始化为true
            var boolvalue = true; 
            // 将boolvalue2初始化为false
            var boolvalue2 = false; 
            document.getElementById("h").innerHTML="变量boolvalue的值为："+boolvalue;
            document.getElementById("h2").innerHTML="变量boolvalue2的值为："+boolvalue2;
            function myFunction(){ 
                var i = boolvalue & 1;
                var j = boolvalue2 | 0;
                document.getElementById("result").innerHTML = i;
                document.getElementById("result2").innerHTML = j;
            }
        </script> 
  </center> 
</body> 
</html>

4、使用Number()函数

Number()函数将数据类型转换为数字，语法：

var i = Number(boolvalue);

示例：

<!DOCTYPE html> 
<html> 
	<head> 
	   	<meta charset="UTF-8">
	</head> 
<body> 
    <center> 
    	<h2 id="h" style="color:red"></h2>
        <h4>单击按钮，将布尔值更改为数字</h4> 
        <button onclick="myFunction()">转换</button> 
        <p style="color:red">变量boolvalue的数值现在为：</p> 
        <p id="result" style="color:red"></p> 
        <script> 
        	// 将boolvalue初始化为false
            var boolvalue = false
            document.getElementById("h").innerHTML="变量boolvalue的值为："+boolvalue;
            function myFunction(){ 
                var i = + boolvalue; 
                document.getElementById("result").innerHTML = i; 
            }
        </script> 
  </center> 
</body> 
  
</html>

总结

每天一小步，成功一大步！

标签：转换为变量常用方法布尔值 Web

上一篇：这些CSS3动画库，您是否都了解和应用过？ - Web前端
下一篇：汇总IOS下奇葩BUG以及iframe嵌套页面带来的一些困扰 - Web前端

在JavaScript中，将存储布尔值的变量转换为“0”或“1”的常用方法 - Web前端

1、使用三元或条件“（）？ ：”运算符

4、使用一元“+”运算符

3、使用按位和（＆）或按位或（|）运算符

4、使用Number()函数

总结

相关推荐

1、使用三元或条件“（）？：”运算符