js的随机数,判断语句(简述随机数方法的实现过程js)
特殊的值
null
undefined
NaN (not a number) 非数字的集合 六亲不认,不会和任何人相等,包括自己
规定null==undefined
<script> // isNaN() console.log(null === null); console.log(undefined === undefined); // 两个等号判断的是值相等 console.log(null == undefined); // 规定 // true转数字 console.log(2 == true); // false console.log(NaN === NaN); // false var x = 3; console.log(typeof x); // number // isNaN()用于判断是NaN console.log(isNaN(x)); //false // !isNaN()用于判断是数字 console.log(!isNaN(x)); //true // 字符串和字符串比较的时候,比较ASCLL值,是一位一位的比 console.log('a' > 'A'); // true // 字符串的比较,是一位一位的比 console.log('212' > '2'); // false // 字符串和数字比较的值 转数字进行比较 console.log('12' > 2);//true </script> 复制代码
Math对象
Math.random() 产生0-1之间的随机数,包含0,不包含1
Math.ceil() 向上取整
Math.floor() 向下取整
Math.round() 四舍五入取整
<script> var x = Math.random(); console.log(x); // 0-100之间的随机数 // x = x * 100 ; x *= 100; //0-100 console.log(x); x = Math.round(x); console.log(x); // 10-20之间的随机整数???? // 0-1之间的随机数 最小值0 x // 最小值需要变成10 x+10 y 10-11 var y = Math.random(); // 0-1 y = y * 10; // 0-10 y = y + 10; //10-20 // y = Math.round(y); 可能取到最大值20 // y = Math.ceil(y); 可能取到最大值20,取到大值的概率大一点 // y = Math.floor(y); 娶不到最大值,取到小值的概率大一点 console.log(y); </script> 复制代码
计算机精度的丢失
console.log(0.1 + 0.2); // 0.30000000000000004 console.log(9999999999999999 == 10000000000000000); // true 复制代码
精度丢失不止是js的问题,而是计算机的问题
解决方法:
四舍五入取整,取小数点
(0.1*10 + 0.2*10)/10
小数化为整数
随机数。随机取三位小数
<script> var x = Math.random(); // 100-1000之间,娶不到1000 x *= 900; x += 100; x = Math.floor(x);//向下取整 console.log(x); var bai = x / 100; bai = Math.floor(bai) console.log(bai); // 取百位的余数 var shi = x % 100 / 10; shi = Math.floor(shi); console.log(shi); var ge = x % 10; </script> 复制代码
随机数小结:
产生0-1之间的随机数 x
产生0-任何值max之间的随机数 x * max
产生min-max之间的随机数 x * (max - min) + min
简写:var a = Math.round(Math.random() * (max - min) + min)
<script> // 10-20之间 var x = Math.random(); var y = x * (20 - 10) + 10; // y = Math.round(y) y = Math.ceil(y) 都可以取到最大值 y = Math.floor(y) // 娶不到最大值 var si = Math.random(); // si = si * (10000 - 1000) + 1000 ; // si = Math.floor(si) si = si * (9999 - 1000) + 1000; si = Math.round(si); // 1234 var qian = Math.floor(si / 1000); // 234 var bai = Math.floor(si % 1000 / 100); // 34 var shi = Math.floor(si % 100 / 10); var ge = Math.floor(si % 10 / 1); // 3682s 小时,分钟,秒 1 1 22s var s = 3682; var day = Math.floor(s / (24 * 3600)); var hour = Math.floor(s % (24 * 3600) / 3600); var minute = Math.floor(s % 3600 / 60); var second = s % 60; console.log(hour, minute, second); </script> 复制代码
最大值与最小值
Math.min();
Math.max();
操作标签对象
认识对象 : 属性 + 方法(函数)
带括号的叫函数,列如
console.log() Math.random() Math.floor() document.write(参数)
不带括号叫属性例如:
obi.value obj.style obj.onclick
<script> // console.log() // Math.random() 函数 0-1 // Math.floor() // 首先找到这个对象 input // 在文档中 找到id为inp的元素 var oInp = document.getElementById('inp'); console.log(oInp); oInp.value = '666' oInp.style.color = 'red' var oP = document.getElementById('p'); oP.style.color = 'green' </script> 复制代码
求和
<body> <input type="number" id="inp1"> <span>+</span> <input type="text" id="inp2"> <button id="btn">=</button> <input type="text" name="" id="result"> <script> // 拿到相关的对象 var oInp1 = document.getElementById('inp1') var oInp2 = document.getElementById('inp2') var oBtn = document.getElementById('btn') var oResult = document.getElementById('result'); console.log(oInp1, oInp2, oBtn, oResult); // 注意:如果出现null 表示对象没有拿到手 -- id写错了 // var n1 = oInp1.value ; // console.log(n1); // 拿不到数据 因为js在页面打开的时候,就执行完毕了 // 当点击按钮的时候,用户就已经输入了两个数字 // 绑定点击事件 oBtn.onclick = function() { // alert(666) // 拿到第一个输入框的值 var n1 = oInp1.value; console.log(n1); // 拿第二个输入框的值 var n2 = oInp2.value; console.log(n2); // 发现页面上的数据都是字符串 var sum = n1 * 1 + Number(n2); console.log(sum); // 计算的结果赋值给输入框 oResult.value = sum; } </script> </body> 复制代码
判断语句
程序的三大流程控制语句
顺序结构 从上而下执行代码
选择结构 判断
循环结构 重复的做一件
单分支语句:有条件的执行代码
语法: if(条件) { 条件满足时执行的代码 }
// 此处的每一条单分支语句都会执行判断 if(light === 'green') { alert('go'); } if(light === 'red') { alert('stop'); } if(light === 'yellow') { alert('wait'); } //这种不建议写,执行效率低,每一个判断都会执行一次 复制代码
双分支语句:
语法: if(条件) { 条件满足执行的代码 } else { 条件不满足执行的代码 }
var score = 66 ; if(score >= 60) { alert('666') } else { alert('下个班见'); } 复制代码
多分支语句:
多分支: 语法: if(条件) { 条件满足执行的代码 }
else if(条件2) { 条件不满足执行的代码 }
else if(条件3) { 条件不满足执行的代码 }
... else { 以上条件都不满足就执行这里 }
var light = 'red'; if (light === 'red') { alert('stop') } else if (light === 'green') { alert('go') } else if (light === 'yellow') { alert('wait') } // 底下的else可有可无 else { alert('灯坏了') } 复制代码
if的嵌套
if() { if() {} }
例题做一个简易计算器
<body> //先拿对象,尽量不要把拿对象放在点击对象里面,因为这个事件会执行很多次 //section的使用,option里面的value要么写要么不写,不能空着,js在获取值的时候,优先拿value,没有value就拿option的内容。 //value不能提前保存。 <input type="text" id="inp1"> <select id="fuhao"> <option value="" disabled selected> 请选择运算符</option> <option value="+">+</option> <option value="-">-</option> <option value="*">*</option> <option value="/">/</option> </select> <input type="text" id="inp2"> <button id="btn">=</button> <input type="text" id="inp3"> <script> //拿对象 var oInp1 = document.getElementById("inp1") var oInp2 = document.getElementById("inp2") var oInp3 = document.getElementById("inp3") var oBtn = document.getElementById("btn") var oFuhao = document.getElementById("fuhao") //console.log(inp1) //绑定点击事件 oBtn.onclick = function() { var a = oInp1.value var b = oInp2.value var result = oInp3.value if (a === "" || b === "") { alert("输入不能为空") } else if (isNaN(a) || isNaN(b)) { alert("请输入数字") } else { if (oFuhao.value === "+") { result = Number(a) + Number(b); inp3.value = result } else if (oFuhao.value === "-") { result = Number(a) - Number(b); inp3.value = result } else if (oFuhao.value === "*") { result = Number(a) * Number(b); inp3.value = result } else if (oFuhao.value === "/") { result = Number(a) / Number(b); inp3.value = result } } } </script> </body> 复制代码
例题讲一个随机五位数分解位数
<body> <div> <button id="btn1">随机五位数</button> <input type="text" id="inp1"> <button id="btn2">分解</button> <br/> <div> <span>万位:</span><input type="text" id="inp2"> <span>千位:</span><input type="text" id="inp3"> <span>百位:</span><input type="text" id="inp4"> <span>十位:</span><input type="text" id="inp5"> <span>个位:</span><input type="text" id="inp6"> </div> </div> <script> var oBtn1 = document.getElementById("btn1") var oBtn2 = document.getElementById("btn2") var x; oBtn1.onclick = function() { //随机数: x = Math.floor(Math.random() * (100000 - 10000) + 10000); inp1.value = x; var y = x; console.log(x) oBtn2.onclick = function() { var a = Math.floor(y / 10000); inp2.value = a; var b = Math.floor(y % 10000 / 1000); inp3.value = b; var c = Math.floor(y % 1000 / 100); inp4.value = c; var d = Math.floor(y % 100 / 10); inp5.value = d; var e = Math.floor(y % 10); inp6.value = e; } } </script> </body> 复制代码
例题做年月日的判断
<body> <span>年</span> <input type="text" id="year"> <span>月</span> <input type="text" id="month"> <span>日</span> <input type="text" id="day"> <button id="btn">判断</button> <script> // 要求:判断输入的日期是否合法 // 年1000-2000之间 // 思路: // 先判断年份 // 再判断月份 // 再判断日期 var oYear = document.getElementById('year'); var oMonth = document.getElementById('month'); var oDay = document.getElementById('day'); var oBtn = document.getElementById('btn'); // 写点击 oBtn.onclick = function() { // 判断年 var y = oYear.value; if (y >= 1000 && y <= 2000 && y % 1 === 0) { // 判断月份 var m = oMonth.value; if (m >= 1 && m <= 12 && m % 1 === 0) { // 判断日期 var d = oDay.value; // 日期判断是根据月份来判断 var maxDay; if (m == 1 || m == 3 || m == 5 || m == 7 || m == 8 || m == 10 || m == 12) { maxDay = 31 } else if (m == 4 || m == 6 || m == 9 || m == 11) { maxDay = 30 } else if (m == 2) { // 2月的天数根据年判断 if (y % 4 === 0 && y % 100 !== 0 || y % 400 === 0) { maxDay = 29 } else { maxDay = 28 } } if (d >= 1 && d <= maxDay && d % 1 === 0) { alert('ok') } else { alert('天数输入错误') } } else { alert('月份输入错误') } } else { alert('年份输入错误') } } </script> </body> 复制代码
作者:不吃鱼d猫
链接:https://juejin.cn/post/7038989695082037261