JavaScript(四)-全面详解(学习总结---从入门到深化)

时间:2022-07-09 00:42:29

JavaScript(四)-全面详解(学习总结---从入门到深化)

 ????????????  前端专栏:​​前端(从入门到实战)​​

 ???????????? 上一篇内容:​​JavaScript(三)-全面详解(学习总结---从入门到深化)​​

​​ 判断一个年份是闰年还是平年​​

​​ 条件语句之 switch​​

​​学习效果反馈​​

​​ switch实操​​

​​学习效果反馈​​

​​ 三元运算符​​

​​学习效果反馈​​

​​ 循环语句之for​​

​​学习效果反馈 ​​

​​ for循环语句实操​​

​​学习效果反馈​​

​​ 打印九九乘法表​​

​​学习效果反馈​​

​​ 循环语句之while​​

​​学习效果反馈​​

​​ 循环语句之do…while​​

​​学习效果反馈​​

​​学习效果反馈 ​​

 判断一个年份是闰年还是平年

润年公式:是4的倍数且不是100的倍数或是400的倍数

var year = 2016;
if (year % 4 == 0 && year % 100 !== 0 || year
% 400 == 0) {
console.log("今年是闰年!");
} else {
console.log("今年是平年!");
}

找到三个数中最小的数

JavaScript(四)-全面详解(学习总结---从入门到深化)

var a = 10;
var b = 20;
var c = 30;
if (a < b && a < c) {
console.log("a最小"+ a);
} else {
if (b < c) {
console.log("b最小" + b);
} else {
console.log("c最小" + c);
}
}

学习效果反馈

1.判断年份是闰年还是平年,横线处应填写代码是 :

var year = 2016;if (year % 4 == 0 ___ year % 100 !== 0 ___ year % 400 == 0) { console.log("今年是闰年!"); } else { console.log("今年是平年!"); }

A && &&

B || ||

C && ||

D || &&


2. 求三个数的最小值,横线处应填写代码是:

var a = 10;var b = 20; var c = 30; if (a < b ___ a < c) { console.log("a最小"+ a); } else { if (b < c) { console.log("b最小" + b); } else { console.log("c最小" + c); } }

A ==

B %

C &&

D ||

 条件语句之 switch

JavaScript(四)-全面详解(学习总结---从入门到深化)

 多个if...else连在一起使用的时候,可以转为使用更方便的switch结构

JavaScript(四)-全面详解(学习总结---从入门到深化)

switch (fruit) {
case "banana":
// ...
break;
case "apple":
// ...
break;
default:
// ...
}

需要注意的是,每个case代码块内部的break语句不能少,否则会接下去执行下一个case代码块,而不是跳出switch结构。

var x = 1;
switch (x) {
case 1:
console.log('x 等于1');
case 2:
console.log('x 等于2');
default:
console.log('x 等于其他值');
}
// x等于1
// x等于2
// x等于其他值

需要注意的是,switch语句后面的表达式,与case语句后面的表示 式比较运行结果时,采用的是严格相等运算符(===),而不是相 等运算符(==),这意味着比较时不会发生类型转换。

var x = 1;
switch (x) {
case true:
console.log('x 发生类型转换');
default:
console.log('x 没有发生类型转换');
}
// x 没有发生类型转换

学习效果反馈

1.下列swtich语句中,横线处应填写代码是 :

var x = 4;switch (x) { case 1: console.log('x 等于1'); break case 2: console.log('x 等于2'); ____ default: console.log('x 等于其他值'); // 打印x等于其他值 }

A swtich

B case

C break

D default


2. 下列代码运行结果是:

var x = 2;switch (x) { case 1: console.log('x 等于1'); case 2: console.log('x 等于2'); default: console.log('x 等于其他值'); }

A x 等于1 x 等于2 x 等于其他值

B x 等于1 x 等于2

C x 等于2 x 等于其他值

D x 等于1 x 等于其他值

 switch实操

JavaScript(四)-全面详解(学习总结---从入门到深化)

 根据数字显示对应的星期

var week = 1;
switch (week) {
case 1:
console.log('星期一');
break;
case 2:
console.log('星期二');
break;
case 3:
console.log('星期三');
break;
case 4:
console.log('星期四');
break;
case 5:
console.log('星期五');
break;
case 6:
console.log('星期六');
break;
case 7:
console.log('星期日');
break;
default:
console.log('星期数字错误');
}

输入月份,显示当月的天数, 利用case穿透简化代码

1、case穿透

2    1、3、5、7、8、10、12月份31天,4、6、9、11月份30天,2 月特殊

3、注意闰年和平年的2月份

var year = 2024;
var mon = 2;
switch(mon){
case 1: case 3: case 5: case 7: case 8: case 10: case 12:
console.log(year+"年"+mon+"月31天");
break;
case 4: case 6: case 9: case 11:
console.log(year+"年"+mon+"月30天");
break;
case 2:
if(year % 4 === 0 && year % 100 !==0){
console.log(year+ "年2月有29天");
}else{
console.log(year+ "年2月有28天");
}
break;
default:
console.log("输入错误");
}

学习效果反馈

1.下列swtich语句中,横线处应填写代码是 :

var week = 1;
switch (week) {
case 1:
console.log('星期一');
___;
case 2:
console.log('星期二');
break;
case 3:
console.log('星期三');
break;
case 4:
console.log('星期四');
break;
case 5:
console.log('星期五');
break;
case 6:
console.log('星期六');
break;
case 7:
console.log('星期日');
break;
default:
console.log('星期数字错误');
}

A swtich

B case

C break

D default

 2. 下列swtich语句实现月份获得当月天数,横线处应填写代码是 :

var year = 2024;
var mon = 2;
switch(mon){
case 1: case 3: case 5: case 7: case 8: case 10: case 12:
console.log(year+"年"+mon+"月31天");
___;
case 4: case 6: case 9: case 11:
console.log(year+"年"+mon+"月30天");
break;
case 2:
if(year%4==0__year% 100!==0___year%400==0){
console.log(year+ "年2月有29天");
}else{
console.log(year+ "年2月有28天");
}
break;
default:
console.log("输入错误");
}

A break && ||

B break || &&

C case && ||

D case && ||

 三元运算符

JavaScript(四)-全面详解(学习总结---从入门到深化)

 avaScript还有一个三元运算符(即该运算符需要三个运算子) ?: , 也可以用于逻辑判断。

 (条件) ? 表达式1 : 表达式2

 

JavaScript(四)-全面详解(学习总结---从入门到深化)

 这个三元运算符可以被视为if...else...的简写形式,因此可以用于多种场合。

 判断一个整数是奇数与偶数

if...else语句

var n = 100;
if (n % 2 === 0) {
console.log("偶数");
} else {
console.log("奇数");
}

三元运算符

var n = 100;
n % 2 === 0 ? '偶数' : '奇数'

学习效果反馈

1.以下代码是三元运算符,横线处应该填写 :

n % 2 === 0 ___ '偶数' ___ '奇数'

A && ||

B ? :

C >= <=

D == ===


2. 下列关于三元运算符表达式描述正确的是:

A if(条件){}else{}

B switch(条件){}

C if(条件){}

D (条件) ? 表达式1 : 表达式2

 循环语句之for

JavaScript(四)-全面详解(学习总结---从入门到深化)

 循环语句用于重复执行某个操作

for语句就是循环命令,可以指定循环的起点、终点和终止条件。它的格式如下

for (初始化表达式; 条件; 迭代因子)
语句
// 或者
for (初始化表达式; 条件; 迭代因子) {
语句
}

我们总是推荐大家使用带有{}的方式  for语句后面的括号里面,有三个表达式。

1、初始化表达式(initialize):确定循环变量的初始值,只在循环开始时执行一次。

2、布尔表达式(test):每轮循环开始时,都要执行这个条件表达式,只有值为真,才继续进行循环。

3、迭代因子(increment):每轮循环的最后一个操作,通常用来递增循环变量。

 

JavaScript(四)-全面详解(学习总结---从入门到深化)

var x = 3;
for (var i = 0; i < x; i++) {
console.log(i);
}

for语句的三个表达式,可以省略任何一个,也可以全部省略。

for ( ; ; ){
console.log('Hello World');
}

JavaScript(四)-全面详解(学习总结---从入门到深化)

学习效果反馈 

1.以下代码是一个循环语句,横线处应该填写 :

var x = 3;for (var i = 0; i __ x; i__) { console.log(i); // 输出:0,1,2 }

A == ++

B < ++

C > ++

D < ==


2. 下列关于循环语句描述错误的是:


A 初始化表达式:确定循环变量的初始值,只在循环开始时执行 一次。

B 布尔表达式:每轮循环开始时,都要执行条件表达式,只有值 为真,才继续进行循环

C 迭代因子:每轮循环的最后一个操作,通常用来递增循环变量

D 三个表达式全部省略,不会出现无限循环(死循环)

 for循环语句实操

JavaScript(四)-全面详解(学习总结---从入门到深化)

循环输出1~100之间数字的和 

var sum=0;
for(var i=1;i<=100;i++){
sum+=i;
}
console.log(sum);

学习效果反馈

1.以下代码是一个循环语句,横线处应该填写 :

var sum=0;for(var i=1;i<=100;i++){ sum__i; } console.log(sum);

A ++

B --

C ==

D +=


2. 以下代码是一个循环语句,横线处应该填写 :

for(i = 0 ; i<1000; i ++){ if( i % 2 __ 1){ console.log( i + " "); } }

A +=

B -=

C ==

D ++

 打印九九乘法表

JavaScript(四)-全面详解(学习总结---从入门到深化)

for(var i = 1;i <= 9;i++){
document.write("<br>");
for(var j = 1;j <= i;j++){
sum = i * j;
document.write(i , "*" ,j ,"=",sum," ");
}
}

小明买洗发水、香皂、牙刷

小明单位发了100元的购物卡,小明到超市买三类洗化用品,洗发水(15元),香皂(2元),牙刷(5元)。要把100元整好花掉, 可如有哪些购买结合?

for(var a=0;a<=6;a++){
for(var b=0;b<=50;b++){
for(var c=0;c<=20;c++){
if(15*a+2*b+5*c==100){
document.write("洗发水:"+a+"香皂:"+b+"牙刷:"+c+"<hr />");
}
}
}
}

学习效果反馈

1.以下代码是一个循环语句,横线处应该填写 :

for(var i = 1;i <= 9;i++){ document.write("<br>"); for(var j = 1;j <= ___;j++){ sum = i * j; document.write(i ,"*",j ,"=",sum," "); } }

A 9

B 10

C j

D i


2. 以下代码是一个循环语句,横线处应该填写 :

for(var a=0;a<=6;a++){ for(var b=0;b<=50;b++){ for(var c=0;c<=20;c++){ if(15*a___2*b___5*c___100){ document.write("洗发水:"+a+"香皂:"+b+"牙刷:"+c+"<hr />"); } } } }

A + + =

B - - =

C += -= =

D -= += =

 循环语句之while

JavaScript(四)-全面详解(学习总结---从入门到深化)

 While语句包括一个循环条件和一段代码块,只要条件为真,就不断循环执行代码块。

while (条件) {
语句;
}

JavaScript(四)-全面详解(学习总结---从入门到深化)

 while例子

var i = 0;
while (i < 100) {
console.log('i 当前为:' + i);
i = i + 1;
}

下面的例子是一个无限循环,因为循环条件总是为真

while (true) {
console.log('Hello, world');
}

所有for循环,都可以改写成while循环

// for
var x = 3;
for (var i = 0; i < x; i++) {
console.log(i);
}
// while
var x = 3;
var i = 0;
while (i < x) {
console.log(i);
i++;
}

学习效果反馈

1.以下代码是一个循环语句,横线处应该填写 :

var i = 0;while (i ___ 100) { console.log('i 当前为:' + i); // 结束输出到 100 i = i + 1; }

A < 

B <=

C >

D >=


2. 下列代码,运行结果是 :

while (true) { console.log('Hello, world'); }

A 输出一次"Hello, world"

B 没有任何输出

C 无限次输出"Hello, world"(死循环)

D 输出两次"Hello, world"

 循环语句之do…while

 do...while循环与while循环类似,唯一的区别就是先运行一次循环体,然后判断循环条件。

do {
语句
} while (条件);

JavaScript(四)-全面详解(学习总结---从入门到深化)

 do...while例子

var x = 3;
var i = 4;
do {
console.log(i);
i++;
} while(i < x);

学习效果反馈

1.以下代码是一个循环语句,横线处应该填写 :

var x = 3;var i = 4; do { i___; console.log(i); } while(i < x);

A --

B ++

C +=

D ==


2. 下列do...while循环描述正确的是:

A 先运行一次循环体,然后判断循环条件

B 先进行判断循环条件,在运行一次循环体

C 不做判断,直接运行循环体

D do...while是条件语句

break 语句和 continue 语句 

JavaScript(四)-全面详解(学习总结---从入门到深化)

 break语句和continue语句都具有跳转作用,可以让代码不按既有的顺序执行

 break

break语句用于跳出代码块或循环

for (var i = 0; i < 5; i++) {
if (i === 3){
break;
}
console.log(i);
}

continue

continue语句用于立即终止本轮循环,返回循环结构的头部,开始下一轮循环

for (var i = 0; i < 5; i++) {
if (i === 3){
continue;
}
console.log(i);
}

JavaScript(四)-全面详解(学习总结---从入门到深化)

学习效果反馈 

1.break和continue的区别 :

A break和continue一样,都是跳出本次循环,进行下次循环

B break跳出本次循环,进入下次循环,continue跳出整个循环

C break跳出整个循环,continue跳出本次循环,进入下次循环

D break和continue一样,跳出全部循环


2. 以下代码,横线处应该填写的内容是:

for (var i = 0; i < 5; i++) { if (i === 3){ ___; } console.log(i); // 输出:0,1,2,4 }

A i++

B i--

C break

D continue