Javascript 语言基础4（条件语句、循环语句、错误语句、练习）

最新推荐文章于 2024-06-01 22:44:26 发布

litengbin

最新推荐文章于 2024-06-01 22:44:26 发布

阅读量421

点赞数

分类专栏：前端-HTML、CSS、Javascript

前端-HTML、CSS、Javascript 专栏收录该内容

26 篇文章 0 订阅

订阅专栏

JAVASCRIPT 条件语句

当条件成立时，就执行相应语句

1.条件成立时执行
if条件一定是一个Boolean类型的值，当为true时，执行对应的语句

<script>
 
var age = 15;
 
if(age<18){
   document.write("如果年纪小于18，就看 卡通");
}
</script>

2.条件不成立时执行
else表示当条件不成立时执行的代码

<script>
 
var age = 22;
 
if(age<18){
   document.write("年纪小于18就看卡通");
}
else{
   document.write("否则就看 你懂的");
}
</script>

3.多条件判断 - else if
else if 用于多条件判断
在本例中
小于 18是一个条件
19-21 是一个条件
大于21是一个条件

<script>
 
var age = 20;
 
if(age<18){
   document.write("小于18就看 卡通");
}
else if(age<22){
   document.write("大于等于18，并且小于22，就看 你懂的");
}
else{
   document.write("大于等于22就看 新闻联播");
}
</script>

4.多条件判断 - switch
switch 语句与else if一样，也是进行多条件判断的
需要注意的是，每个判断结束，都要加上break;

<script>
var day=new Date().getDay(); //通过日期对象获取数字形式的星期几
var today;
switch (day)
{
case 0:
  today="星期天";
  break;
case 1:
  today="星期一";
  break;
case 2:
  today="星期二";
  break;
case 3:
  today="星期三";
  break;
case 4:
 today="星期四";
  break;
case 5:
  today="星期五";
  break;
case 6:
  today="星期六";
  break;
}
 
document.write("今天是 ： "+today);
 
</script>

JAVASCRIPT 循环语句

常用的循环语句有： for, while, do-while, for-each
都是用于在满足条件的前提下，重复执行代码用的

1.for
使用 for打印0-4
注意：进行循环的时候，一定要设置好自增和结束条件，否则会导致无限循环，浏览器直接挂掉。

<script>
function p(s){
  document.write(s);
  document.write("<br>");
}
 
document.write("使用for循环打印 0 到 4<br>");
 
for(var i=0;i<5;i++){
  p(i);
}
 
</script>

2.while
其实 while就是另一种形式的for
使用while打印0-4
注意：进行循环的时候，一定要设置好自增和结束条件，否则会导致无限循环，浏览器直接挂掉。

<script>
document.write("使用while循环打印 0 到 4<br>");
function p(s){
  document.write(s);
  document.write("<br>");
}
 
var i = 0;
while(i<5){
  p(i);
  i++;
}
 
</script>

3.do-while
其实do-while与while的区别在于，至少会执行一次
使用do-while打印0-4
注意：进行循环的时候，一定要设置好自增和结束条件，否则会导致无限循环，浏览器直接挂掉。

<script>
function p(s){
  document.write(s);
  document.write("<br>");
}
document.write("使用do-while循环打印 0 到 4<br>");
var i = 0;
 
do{
 p(i);
 i++;
} while(i<5);
 
</script>

4.forEach
forEach是增强的for循环，主要用于遍历数组。

<script>
function p(s){
  document.write(s);
  document.write("<br>");
}
 
var x = new Array(3,1,4);
p('当前数组是:'+x);
p("使用普通的for循环遍历数组");
for(i=0;i<x.length;i++){  //普通for循环
  p(x[i]);
}
p("使用增强for循环遍历数组");
for(i in x){  //for in 循环
  p(x[i]);
}
</script>

5.continue
continue 表示放弃本次循环，进行下一次循环

<script>
function p(s){
  document.write(s);
  document.write("<br>");
}
  
document.write("使用for循环打印 0 到 4<br>如果发现是3，就<span style='color:red'>放弃本次循环，并且进入下一次</span>循环<br>");
  
for(i=0;i<5;i++){
  if(i==3)
    continue;
  p(i);
}
  
</script>

6.break
break表示终止循环，循环体结束

<script>
function p(s){
  document.write(s);
  document.write("<br>");
}
   
document.write("使用for循环打印 0 到 4<br>如果发现是3，就<span style='color:red'>终止循环，循环体结束 </span><br>");
   
for(i=0;i<5;i++){
  if(i==3)
    break;
  p(i);
}
   
</script>

JAVASCRIPT 错误处理

JavaScript提供了一种try catch的错误处理机制，当有错误抛出的时候，可以catch住。

1.调用不存在的函数
在本例中故意调用不存在的函数f2, 因为函数f2不存在，所以会出错，并且会中断执行。导致后面的代码也不会执行了。

<script>
document.write("试图调用不存在的函数f2()就会报错，并且导致javascript中止执行，后面的代码也不会执行了");
 
function f1(){
  //函数f1是存在的
}
f2();  //调用不存在的函数f2();
document.write("剩下的代码");
</script>

2.try catch
对f2()调用进行try catch的处理。捕捉到了该方法未定义的错误。并打印出来。
后续的代码，也就可以继续执行了。

<script>
 
function f1(){
  //函数f1是存在的
}
try{
   document.write("试图调用不存在的函数f2()<br>");
    f2();  //调用不存在的函数f2();
}
catch(err){
   document.write("捕捉到错误产生:");
    document.write(err.message);
}
 
document.write("<p>因为错误被捕捉了，所以后续的代码能够继续执行</p>");
 
</script>

练习

<style>
table{
 border-collapse:collapse;
}
td{
  border:1px silver solid;
  padding: 5px;
  font-size:12px;
}
input{
  width:180px;
}
</style>
<script>
/*取幂函数*/
function p(base, power){
    if(1==power)
       return base
    if(0==power)
       return 1;
    var result = base;
    for(var i = 0; i<power-1; i++){
        result = result*base;
    }
    return result;
}
 
/*取复利*/
function fuli(rate, year){
    var result = 0;
    for(var i=year;i>0;i--){
      result+=p(rate,i);
    }
    return result;
}
 
function calc(){
    var initMoney= getIntValue("initMoney");
    var rate= getIntValue("rate");
    var year= getIntValue("year");
    var each= getIntValue("each");
    var sum1 = (year-1)*each+initMoney;
    var sum3=each* fuli(  (1+rate/100),(year-1)) + initMoney*p( (1+rate/100) ,year);
    var sum2 = sum3-sum1;
    setValue("sum1",sum1);
    setValue("sum2",sum2);
    setValue("sum3",sum3);
}
 
function setValue(id,value){
    document.getElementById(id).value=value;
}
 
function getIntValue(id){
    return parseInt(document.getElementById(id).value);
}
</script>
<table>
<tr>
  <td>起始资金</td>
  <td><input type="text" id="initMoney" value='10000'> ￥</td>
<tr>
  <td>每年收益</td>
  <td><input type="text" id="rate" value='5'> %</td>
</tr>
<tr>
  <td>复利年数</td>
  <td><input type="text" id="year" value='10'> 年</td>
</tr>
<tr>
  <td>每年追加资金</td>
  <td><input type="text" id="each" value='10000'> ￥</td>
</tr>
<tr>
   <td colspan="2" align="center"><input type="button" value="计算" οnclick="calc()"></td>
</tr>
<tr>
  <td>本金和</td>
  <td><input type="text" id="sum1" disabled="disabled"  value='0'> ￥</td>
</tr>
<tr>
  <td>利息和</td>
  <td><input type="text" id="sum2"  disabled="disabled" value='0'> ￥</td>
</tr>
<tr>
  <td>本息和</td>
  <td><input type="text" id="sum3"  disabled="disabled" value='0'> ￥</td>
</tr>
</table>

litengbin

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Javascript 语言基础4（条件语句、循环语句、错误语句、练习）

JAVASCRIPT 条件语句当条件成立时，就执行相应语句1.条件成立时执行if条件一定是一个Boolean类型的值，当为true时，执行对应的语句 var age = 15; if(age<18){ document.write("如果年纪小于18，就看卡通");}2.条件不成立时执行else表示当条件不成立时执行的代码 var ag
复制链接

扫一扫

专栏目录