JavaScript详解(二)
js的流程控制
- if语句:
if (条件表达式A){
xx;
}else if (条件表达式B){
xx;
}
else{
xx;
}
- switch语句:
switch (表达式){
case 值1:
xxx;
break;
case 值2:
xxx;
break;
default: //所有case都不满足时执行
xxx;
}
- for语句:
for(初始化语句;循环判断语句;循环执行语句){
xxx;
}
- while语句:
while(循环判断语句){
xxx;
}
- do....while语句:
do{
xxx;
}while(循环判断语句);
JavaScript的本地对象
字符型对象String
有三种定义方法:
- var s = new String('字符串内容');
- var s = String('字符串内容');
- var s = '字符串内容';
字符串的属性length可以返回其长度,可通过索引返回指定位置字符,通过+拼接。
数字转字符串:nub.tostring()
字符串转数字:Number(str)
字符串对象常用方法:
- str.substring(start,end):截取字符串,如果只传一个参数,则默认截取到最后一个为止。左闭右开。
- str.slice(start,end):切片,左闭右开,r若两个参数为负数,必须保证abs(start)>abs(end)。
- str.split("?"):切割,按照指定参数进行切割,返回一个数组。
- str.indexOf("?"):查找并返回匹配字符串出现的位置,若没找到,返回-1.
- str.toUpperCase():全部转换成大写。
- str.toLowerCase():全部转换成小写。
- str.Replace("a","b"):用b替换字符串中的a,只能替换一个。
日期对象Date
定义一个日期对象:var date = new Date();返回的格式如下:
Tue Nov 20 2018 21:22:41 GMT+0800 (中国标准时间)
获取方法:
- date.getFullYear():返回年份
- date.getMonth():返回月份,月份为实际月份减一,即十二月为0.
- date.getDate():返回日期
- date.getHours():返回当前小时
- date.getMinutes():返回当前几分
- date.getSeconds():返回当前多少秒
- date.getDay():返回周期,周日为0.
设置方法:将date换成set将变成对应的设置方法,但没有设置秒,设置年份为四位数字、设置月份范围为0~11、小时为0~23。
还可以以时间戳设置时间,单位是毫秒:date.setTime().
转换方法:原本时间格式是Tue Nov 20 2018 21:42:05 GMT+0800 (中国标准时间)
- date.toString(): Tue Nov 20 2018 21:43:55 GMT+0800 (中国标准时间)
- date.toTimeString(): 21:43:55 GMT+0800 (中国标准时间)
- date.toDateString(): Tue Nov 20 2018
- date.toLocaleString(): 2018/11/20 下午9:43:55
- date.toLocaleTimeString(): 下午9:43:55
- date.toLocaleDateString(): 2018/11/20
数学对象Math
数学对象常用属性有:
- PI :圆周率
- E:常量e,近似于2.71828
- LN2:2的自然对数
- LN10:10的自然对数
- LOG2E:以2为底的e的对数
- LOG10E:以10为底的e的对数
数学对象常用方法:
- Math.abs():取绝对值
- Math.ceil():往上取整
- Math.floor():往下取整
- Math.round():四舍五入取整
- Math.max():返回所有参数中的最大值
- Math.pow(x,y):返回x的y次幂
- Math.sqrt():返回参数的平方根
- Math.random():随即返回一个0~1的数
定时器
创建一个定时器有三种方式:
- 第一种使用setTimeout方法,这个定时器只执行一次。
timer = setTimeout(function(){
//执行语句
},1000); //timer是创建的一个定时器对象,1000是间隔时间,单位是毫秒
- 第二种使用setInterval方法,这种定时器可以一直执行下去。
timer = setInterval(function (){
//执行语句
},1000);
- 第三种也是用setInterval方法,但他是配合另外的函数使用。
setInterval(函数名,1000);
消除定时器
- clearInterval(定时器对象);
- clearTimeout(定时器对象);
定时器小例子:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>定时器</title>
<style>
*{
padding:0;
margin:0;
}
div.content{
height:150px;
margin-top:50px;
text-align: center;
}
.time{
color:red;
font-weight: bolder;
font-size:19px;
}
.end_time{
color:purple;
font-size: 21px;
/*margin-top:65px;*/
}
#clock{
text-align: center;
}
</style>
</head>
<body>
<div class="content">敌军还有<span class="time" second="5">5</span>秒到达战场</div>
<div id="clock"></div>
<script>
otime = document.getElementsByClassName("time");
ocontent = document.getElementsByClassName("content");
oclock = document.getElementById("clock");
var nub = otime[0].getAttribute("second");
// alert(nub);
timer = setInterval(function(){
nub--;
otime[0].innerHTML = nub;
if (nub === 0){
ocontent[0].innerHTML = "<p class='end_time'>全军出击!!!</p>";
clearInterval(timer);
}
},1000);
function fn() {
var data = new Date;
var year =data.getFullYear();
var mon = data.getMonth()+1;
var day = data.getDate();
var hour = data.getHours();
var minute = data.getMinutes();
var second = data.getSeconds();
if (minute<10){
minute = "0" + minute;
}
if (hour<10){
hour = "0" + hour;
}
if (second<10){
second = "0" + second;
}
oclock.innerHTML = year + "年" + mon + "月" + day + "日" + hour + "时" + minute + "分" + second + "秒";
}
fn();
setInterval(fn,1000);
</script>
</body>
</html>