js十进制转换二进制

平常使用的话用toString(2),或者parseInt(要转换的数字,2)便可转换为二进制。这里用原生代码实现一下十进制转二进制。

<body>
    <input id="dec-number" type="number" placeholder="输入一个十进制非负数">
    <button id="trans-btn">转化为二进制</button>
    <p id="result">运算结果</p>
    <script>
        function trans(){
            var dec_number=document.getElementById("dec-number").value;//获得输入的值
            var str=dec_number+"";//将值转换为字符串
            if(isNaN(Number(str))){//判断输入值是否是数字(因为input标签已经确定type为number,所以这个判断是不必要的)
                console.log("输入一个十进制非负数错误");
                mistake();
            }else if(dec_number==0){//判断输入值是否等于零
                console.log("输入十进制为0");
                zero();
            }else if(str.indexOf(".")==-1){//判断输入值是否是整数
                console.log("所输入数据为十进制非负整数")
                integer();
            }else if(str.indexOf(".")!=-1){//判断输入值是否是小数
                console.log("所输入数据为实际值非负小数");
                decimal();
            }
        }
        function mistake(){
            document.getElementById("result").innerHTML="所输入十进制非负数错误";
        }
        function zero(){
            document.getElementById("result").innerHTML=0;
        }
        function integer(){
            var dec_number=document.getElementById("dec-number").value;//获取值
            var quotient=dec_number;//用于储存商的值
            var remainder;//用于存储余数
            var bin_array=[];//用于储存余数并编排
            while(quotient!=1){
                remainder=quotient%2;
                quotient=Math.floor(quotient/2);
                bin_array.unshift(remainder);//将得到的余数插入数组的前排
            }
            bin_array.unshift(1);
            document.getElementById("result").innerHTML=(bin_array.join(""));
        }
        function decimal(){
        
            var dec_number=document.getElementById("dec-number").value;
            var int_number=dec_number.toString().substring(0,((dec_number.toString()).indexOf(".")));//获取小数点之前的数字,即整数部分
            var decimal_number=parseFloat("0"+"."+dec_number.substring((((dec_number.toString()).indexOf("."))+1)));//获取小数点之后的数字,即小数部分
            var int_quotient=int_number;//用于储存整数部分的商的值
            var int_remainder;//用于存储整数部分的余数
            var int_bin_array=[];//用于储存整数部分的余数并编排
            var dec_product;//用于储存小数部分的乘积的值
            var dec_difference=decimal_number;//用于储存小数部分的差的值
            var dec_bin_array=[];//用于储存小数部分的商并编排
            if(dec_number>1){//小数大于1时
            //整数部分的二进制转换
                while(int_quotient!=1){
                    int_remainder=int_quotient%2;
                    int_quotient=Math.floor(int_quotient/2);
                    int_bin_array.unshift(int_remainder);
                }
                int_bin_array.unshift(1);
                var int_bin_number=int_bin_array.join("");
                //小数部分的二进制转换
                var i=0;
                while(dec_difference!=0||i<20){//i<20考虑的是无限小数的情况,限定只允许20位小数
                    dec_product=Math.floor(dec_difference*2);
                    if((dec_difference*2)<1){
                        dec_difference=dec_difference*2;
                    }else{
                        dec_difference=dec_difference*2-1;
                    }
                    dec_bin_array.push(dec_product);
                    i++;
                }
                var result=Number(int_bin_number+"."+dec_bin_array.join(""));
            }else{
                var i=0;
                while(dec_difference!=0||i<20){//i<20考虑的是无限小数的情况,限定只允许20位小数
                    dec_product=Math.floor(dec_difference*2);
                    if((dec_difference*2)<1){
                        dec_difference=dec_difference*2;
                    }else{
                        dec_difference=dec_difference*2-1;
                    }
                    dec_bin_array.push(dec_product);
                    i++;
                }
                var result=Number("0"+"."+dec_bin_array.join(""));
            }
            document.getElementById("result").innerHTML=result;
        }
        document.getElementById("trans-btn").addEventListener("click",trans);
        // 实现当点击转化按钮时,将输入的十进制数字转化为二进制,并显示在result的p标签内
    </script>
</body>
posted @ 2019-07-31 15:27  Syinho  阅读(3288)  评论(0编辑  收藏  举报