JavaScript基础(十三)

Math对象

   方法+说明

ceil()  对数进行上舍入    

例:Math.ceil(12.5)返回13;                                 Math.ceil(-12.5)返回-12                            (简单点来记就是ceil返回的值要比传入的大

   var math1= Math.ceil(12.5)

   console.log(math1);

   var math2= Math.ceil(-12.5)

   console.log(math2);

3770c988975945fdb808beecc1ff6d83.png

 

floor()   对数进行下舍入  

例:Math.floor(12.5)返回12;                               Math.floor(-12.5)返回-13                           (简单点来记就是floor返回的值要比传入的小

   var math1=Math.floor(12.5);

   console.log(math1);

   var math2=Math.floor(-12.5);

   console.log(math2);

653dc2f9eba84ea4ae8ff87f4a3d2502.png

 

round()   把数四舍五入为最接近的数  

例:Math.round(12.5)返回13;                             Math.round(-12.6)返回-13

   var math1= Math.round(12.5)

   console.log(math1);

   var math2= Math.round(-12.6)

   console.log(math2);

70b9167e7b8340f2be0a40a69d35a207.png

 

random()   返回0.0-0.1的随机数

例:

   var num= Math.random();

   console.log(num);

f7d2fbc2cddd442d93fbdc0c3ea17f77.png

比如这有个例子:

一盒鸡蛋有21个,这里有64个蛋能放几盒?
那多的咱不能扔了,这个是不是就要向上取值:
   var num=Math.ceil(64/21);
   console.log(num);

24bbf7b4fa2144ef8382f5f22dcd95fb.png

还有别的情况,我们要结果也不是非要取个近似值,我们只想要整数部分

有个方法,parseInt直接删掉小数点后内容

var num=parseInt(-20.9999);

console.log(num);

dc0627d8843f43ddaea9d8cc8530287e.png

 那ceil和floor都有简单记法,round不总结一下这不有失偏颇吗,

那必须总结一下round()四舍五入,简单来记

//正数:直接就四舍五入,没什么好说的;

//负值:不考虑负号,只对数字进行升降,小数点后<=0.5舍去,否则进上去。

var num=Math.round(-25.5);

console.log(num);

var num1=Math.round(-25.51);

console.log(num1);

46e27be305d84053a7076c78d8e9bc22.png

肯定要把情况考虑全面,有时候我们肯定还需要绝对值,还有一个取绝对值的方法Math.abs()

var num=Math.abs(-12.12);

console.log(num);

var num1=Math.abs(11.99);

console.log(num1);

7b34b6d5141f4f9898616f5657ba3fa5.png

大体这块没什么东西了,再生偏的就自己查文档了,那好,我现在想让你生成0-10的随机数怎么整?

先分析一下,肯定要用到random随机数,乘个10是不是就行了,再取整就OK了:

//随机数

var num =Math.random()*10;

//加上取整

var num1 =Math.round(Math.random()*10);

console.log(num1);

也不一定非要这么写,单举这一个方法

d87445b296814819979a44da71a78246.png

初识函数绑定事件获取input的值

这里函数是指我们制定的规则,不是数学上那些乱七八糟的东西,例如:我们定义的函数log

function log(){

   console.log("你真聪明");

   console.log("你真有活");

   console.log("你真帅");

}

调用函数:函数名()

log();

cf881b3c199c446b96730114e524cc56.png

函数可以包任意的东西

点击事件

顾名思义,点击某个地方就发生某个事件,举个例子,我们在body中写一个按钮

<body>

   <button>点击</button>

</body>

写出来,除了能点一下,什么功能都没有,想实现功能就要绑定事件,什么意思,就是你通过方法或函数写一个功能,然后通过一定方法绑定到某个标签上,然后点击标签生成的对应部分,发生你所绑定的事件:

这里我们写的button,通过onclick绑定:

 <button οnclick="">点击</button>

我们可以绑个弹窗,点一下弹出来:

<body>

   <button οnclick="alert('不长眼睛!你点到我了!!')">点击</button>

</body>

505ec203b4ce46ae8d059b995311fddc.png

但我们不是为了实现这种狗屁功能,我们可以写个函数,在onclick内绑个函数:

<!-- onclick内接函数名 -->

<body>

   <button οnclick="on()">点击</button>

</body>

<script>

   function on(){

      console.log('事件发生');

   }

</script> 

我们还没点,控制台什么事都没有

00191a8cb83a440eac451cba58056c36.png

我们点几次,后台这个函数就被调用了几次

1b2f427c1813477aa1a59c2d2da97bea.png

比如那些小广告,小弹窗啥的,绑一个clear函数,到时候一点把弹窗板块清除就行了

例如,这里我们需要判断用户输入的用户名是否合法,要求至少输入三个字:

<!-- 这里我起了个id名,下面用id名找到input框 -->

<body>

   用户名:<input type="text" id="yh" value="">

   <button οnclick="on()">注册</button>

</body>

<script>

   function on(){

      //找到input框,获取value值

      var nam=document.getElementById('yh').value;

      // console.log(nam);

      if (nam.length == 0){

         alert('用户名不能为空')

      }else if(nam.length<3){

         alert('用户名不能少于三个字')

      }else{

         alert('注册成功')

      }

   }

</script> 

d6b5f2dbca3340ee8b64db12e0927160.png

830a09ebe5234769829a8478580dc70e.png

00a1153a49804f71b00a1fd8a0020f59.png 

很轻松我们就实现这么一个功能,后面再改改默认样式好看点就行了。

上面input后value内可以写个默认名字, 用户名:<input type="text" id="yh" value="李二狗">,一点开就默认有个李二狗

39f2cd981a1a4d178bc49ec04af7bc69.png

 

有人也可能发现问题了,这里我真正注册了没有?没有,我只不过就这样写的,所以其实有很多糊弄人的代码,给你弹个清理也不一定清理,但放心啊,正规网站都是有人审查代码,这不用担心,我们知道就行。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值