提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档
目录
提示:以下是本篇文章正文内容,下面案例可供参考
一、流程控制语句
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
/*
JS中的程序是从上到下一行一行执行的
* 通过流程控制语句可以控制程序执行流程
* 使程序可以根据一定条件来选择执行
* - 语句的分类:
* 1.条件判断语句
* 2.条件分支语句
* 3.循环语句
*
*
* 第一种:条件判断语句
* - 使用条件判断语句在执行某个语句之前进行判断
* 如果条件成立才会执行语句,条件不成立则语句不执行
* - if语句
* 语法规则:
* if(条件表达式)
* {
* 语句1;
* 语句2;
* ……
* }
*
* if语句在执行的时候,会先对条件表达式进行求值判断
* 如果条件表达式的值为true,则执行if后面的语句
* 如果条件表达式的值为false,则不会执行if后的语句。
* if语句只能控制紧随其后的那个语句,
* 但是如果希望if语句可以控制多条语句
* 可以将这些语句统一放到一个代码块中{}
* if语句后面的代码块不是必须的,但是在开发中尽量写上代码块,即使代码只有一行
*
*
* */
/*第一种:条件判断语句:举例*/
/*var a = 10;
if(a>9)
{
alert("a比9大~~~~");
alert("加上大括号变为语句1")
}*/
var a = 15;
/*同时满足多个条件的时候才会输出语句1*/
if(a>10 && a<=20)//true&&true=true
{
alert("a大于10,并且a小于等于20");
}
</script>
</head>
<body>
</body>
</html>
二、if语句
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*
if语句
* 语法规则二:
* if(条件表达式){
* 语句....
* }else{
* 语句....
* }
* if……else……语句
* 当该语句执行时,会先对if后的条件表达式进行求值判断
* 如果该值为true,则执行if后的语句
* 如果该值为false, 则执行else后的语句
*
* (选择多种)
* 语法规则二:
* if(条件表达式){
* 语句……
* } else if(条件表达式){
* 语句……
* }else if(条件表达式){
* 语句……
* }else{
* 语句……
* }
* if……else if…… else语句
* 当该语句执行的时候,会从上到下依次对表达式进行求值判断
* 如果值为true,则执行当前语句
* 如果值为false,则继续向下判断else if里面的表达式
* 如果值为false,则继续向下判断else if里面的表达式
* 一个一个判断,直到有条件为true,才会执行该语句
如果都不成立,那么就执行最后一个else
(顺序有要求,从大到小/// 从小到大也可以,但是必须要完善逻辑代码,否则会出现死代码)
*
*
*
*
*/
/*if……else if…… else语句
相当于分支判断,往下执行
一个一个判断,直到条件为true,才会执行该语句
如果都不成立,那么就执行最后一个else
* */
var age =65;
if(age > 100){//false
alert("age大于100");
}else if(age>80){//false
alert("age小于100大于80");
}else if(age>60){//true 输出当前语句
alert("age小于80大于60");
}else{
alert("age小于60");
}
</script>
</head>
<body>
</body>
</html>
三、if语句的练习
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*
* 从键盘输入小明的期末成绩:
* 当成绩为100时,"奖励一辆BMW"
* 当成绩为[80-99]时,"奖励一台iphone15s"
* 当成绩为[60-80]时,"奖励一本JavaScript语法书"
* 其他时,什么都没有
*
*/
/*
输入:prompt()可以弹出一个提示框,该提示框中会有一个文本框
用户可以找文邦框中输入一段内容,该函数需要一个字符串作为参数
该字符串将会作为提示框的提示文字
* 将用户输入的内容将会作为函数的结果返回给一个变量,所以需要定义一个变量来接收
*
* */
//嵌套
/*var score = prompt("请输入分数0-100:");
* if(score>100||score<0 || isNaN(score))//判断是否合法 , isNaN(score)输入字母的时候
* {
* alert("输入不合法");
*
* }else{
* if(score==100){
alert("奖励一辆BMW");
}else if(score<=99&&score>=80){
alert("奖励一台iphone15s");
}
else if(score<=79&&score>=60){
alert("奖励一本JavaScript语法书");
}else{
alert("害!都还没及格,还想要奖励啊!!")
}
}
*/
/*练习二:*/
/*var height = prompt("输入身高");
var money = prompt("输入存款");
var face = prompt("输入颜值度");
if(height>=180 && money>=1000 && face>=500 ){
alert("我一定要嫁给他");
}else if(height>=180 || money>=1000 || face>=500 ){
alert("我就勉强一下嫁给他吧");
}else{
alert("活该单身");
}
*/
/*练习三:
编写程序,由键盘输入三个数变量num1、num2、num3
输出从大到小
* */
/* var num1 = prompt("请输入num1");
var num2 = prompt("请输入num2");
var num3 = prompt("请输入num3");*/
//var max=num1;
/*max = num1>mum2?(unm1>num3?num1:num3):(num2>num3?num2:num3);求出最大值*/
//num1最小
/*if (num1>num2 && num1>num3) {
if (num2>num3) {
alert("从小到大的顺序为:"+num3 +num2 +num1);
}else{
alert("从小到大的顺序为:"+num2 +num3 +num1);
}
}else if(num2>num1 && num2>num3){
if(num1>num3){
alert("从小到大的顺序为:"+num1 +num3 +num2);
}else{
alert("从小到大的顺序为:"+num3 +num1 +num2);
}
}else if(num3>num1 && num3>num2){
if (num1>num2) {
alert("从小到大的顺序为:"+num2 +num1 +num3);
}else{
alert("从小到大的顺序为:"+num1 +num2 +num3);
}
}*/
</script>
</head>
<body>
</body>
</html>
四、if语句求三个数的从小到大
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*
三个数从小到大排序
prompt();这个函数返回的是一个字符串,所以用的时候需要注意在前面加 +prompt() 让它的返回结果变成数值
*/
var num1 = +prompt("输入num1的值");
var num2 = +prompt("输入num2的值");
var num3 = +prompt("输入num3的值");
//num1最小
if (num1<num2 && num1<num3) {
if (num2<num3) {
alert("从小到大的顺序为"+num1+"," +num2+","+num3);
}else{
alert("从小到大的顺序为"+num1+","+num3+","+num2);
}
}//num2最小
else if(num2<num1 && num2<num3){
if(num1<num3){
alert("从小到大的顺序为"+num2+","+num1+","+num3);
}else{
alert("从小到大的顺序为"+num2+","+num3+","+num1);
}
}//num3最小
else if(num3<num2 && num3<num1){
if (num2<num1) {
alert("从小到大的顺序为"+num3+","+num2+","+num1);
}else{
alert("从小到大的顺序为"+num3+","+num1+","+num2);
}
}
//可以有多种方式:临时存放值也可以
</script>
</head>
<body>
</body>
</html>
五、条件分支语句
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*
条件分支语句:
* switch(条件表达式){
* case 表达式1:
* 语句...
* break;
* case 表达式2:
* 语句...
* break;
* case 表达式2:
* 语句...
* break;
* …………
* default:
* 语句...
* break;
* }
*
* 执行流程:
* switch...case..语句
* 在执行时会依次将case后面的表达式的值和switch后的条件表达式的值进行全等的比较
* 如果比较结果为true,则从当前case处开始执行代码(所以必须要break跳出)跟着brake才不会执行其他的case
* 如果比较结果为false,则继续向下比较
* 如果所有的case都为false,那就执行default语句
*
* 可以相互代替
* switch语句和if语句的功能实际上有重复的,使用switch可以实现if的功能
* 同样使用if也可以实现switch的功能,使用的时候可以根据个人喜好来解决
*
*
*
*
*
*
*/
/*var num = 1;
if(num===1){
alert("1");
}else if(num==2){
alert("2");
}else if(num==3){
alert("3");
}太过于麻烦,从上到下一个一个判断*/
/*改写成switch语句*/
var num = 1;
switch(num){
case 1:
console.log("1==壹");
//使用break可以用来退出switch语句
break;
case 2:
console.log("2==贰");
break;
case 3:
console.log("3==叁");
break;
default:
console.log("输入无效");
}
</script>
</head>
<body>
</body>
</html>
六、switch语句练习1
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*
大于等于60合格,小于60不合格
* */
/* var num = +prompt("输入在0-100以内的的数字");//prompt的出string 需要转型
switch(parseInt(num/60)){//使用parseInt()函数来将成绩除以60的结果变为整型数字
方法一
//switch(parseInt(num/10)):有6种情况10 9 8 7 6 default
case 1:
alert("合格");
break;
case 0:
alert("不合格");
break;
default:
alert("输入不合法,需要在0-100以内的的数字");
}*/
/*方法二
* 更简单的*/
/*js中的方法:
利用了switch语句和case语句比较是否为真的
* */
var num = +prompt("输入在0-100以内的的数字");
switch(true){//Boolean(1)
case num>=60:
alert("及格");
break;
case num<60:
alert("不及格");
break;
default:
alert("输入不合法,需要在0-100以内的的数字");
}
</script>
</head>
<body>
</body>
</html>
七、switch语句练习2
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*
1-7打印对应星期几
*
* */
var n = +prompt("请输入数值");
switch (n){
case 7:
alert("星期天放假了");
break;
case 6:
alert("星期六放假了");
break;
case 5:
alert("星期五,马上放假了");
break;
case 4:
alert("星期四,还有一天放假了");
break;
case 3:
alert("星期三,还有两天放假了");
break;
case 2:
alert("星期二,放假遥遥无期,安心上课把");
break;
case 1:
alert("星期一,刚开始你就想着上课,想屁吃呢!");
break;
default:
alert("输入的是什么鬼东西");
break;
}
</script>
</head>
<body>
</body>
</html>
八、循环语句
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*
循环语句:连续输出
*
*
*
*
*
* */
/*document.write(1+ <br/>);//document是写入到body中的,所以需要用网页的换行<br/>
document.write(2+ <br/>);//而\n是在控制台中换行的*/
/*var n =1;
document.write(n++ <br/>);/
* */
/*
循环语句:
* 通过循环语句可以反复的执行一段代码多次
*
*
*
while循环
* - 语法:
* while循环语句(条件表达式){
* 语句.....
* }
* - while语句执行流程:
* 先对括号里面的条件表达式进行求值判断,
* 如果值为true,则执行循环体
* 循环体执行完毕以后,继续对表达式进行判断
* 如果再为true,则继续执行循环体,以此类推
* 如果判断表达式为false,那么执行循环体结束(终止循环)
*
*
do....while循环
* - 语法:
* do{
* 语句.....
* }while(条件表达式)
*
* - do... while语句执行流程:
* 先执行循环体do{}
* 执行循环体完毕以后,在对while后的的条件表达式进行判断
* 如果结果为true,则继续执行循环体,执行完毕继续判断,依次类推
* 如果结果为false,则终止循环
*
*
* 区别:while语句先判断后执行,
* 而do... while先执行再判断
* do... while()可以保证至少执行一次
* 而while()不能
*
*
*
*
* */
/*举例*/
/*var n = 1;
while (true){
alert(n++)
break;
}
这种将条件表达式写死为true的循环,叫死循环
该循环不会停止,除非浏览器关闭,死循环在开发中慎用
可以使用break,来终止循环
while 好像一个可以执行多次的if语句
* */
/*方式一 var n = 1;
while (true){
alert(n++);
//判断当n是否是10的时候退出循环
if (n==10) {
//退出循环
break;
}
}
*/
/*
方式二:
创建一个循环,往往需要三个步骤
1.创建初始化一个变量
var i=0;
2.在循环循环中设置一个条件表达式
while(i < 10){
3.定义一个更新表达式,每次更新初始化变量(离条件越来越近)
i++;
}
* */
/*while举例:*/
var i = 1;
/*while(i <=5000){
document.write(i++ +"<br />");
}*/
/*do while举例:*/
do{
document.write(i++ +"<br />");
}while(i <=5000);
</script>
</head>
<body>
</body>
</html>
九、while循环语句练习
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*
假如投资的年的利率为5%,试求从1000块增长到5000块,需要花费多少年
*
*
* 1000 1000*1.05
* 1050 1050*1.05
*
*
* */
var n=1000;
//定义一个计数器,默认值是0
var i=0;
while(n < 5000){
/*n=parseInt(n*1.05);*/
/*n = n*1.05;*/
n*=1.05;
//记录循环的次数
i++;
}
//document.write("从1000块增长到5000块需要"+n+"钱")
document.write("从1000块增长到5000块需要"+i+"年");
</script>
</head>
<body>
</body>
</html>
十、循环输入的练习
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
//将prompt放入到一个循环中,循环判断输入
while(true){
var score = +prompt("请输入分数0-100:");
//判断用户输入的是否合法
if(score >=0 && score <=100){
//满足条件则证明用户输入合法,退出循环,还继续往下执行代码
break;
}
alert("输入不合法,请点击确定/ok后再次输入");
}
//开始执行解决问题的程序
if(score>100||score<0 || isNaN(score))//判断是否合法 , isNaN(score)输入字母的时候
{
alert("输入不合法");
}else{
if(score==100){
alert("奖励一辆自行车");
}else if(score<=99&&score>=80){
alert("奖励一台本蝴蝶书");
}
else if(score<=79&&score>=60){
alert("奖励一本JavaScript语法书");
}else{
alert("害!都还没及格,还想要奖励啊!!")
}
}
</script>
</head>
<body>
</body>
</html>
总结
以上是本人js学习阶段的小例子以及自己的理解,还希望大神提意见,谢谢大家。