【前端】JavaScript入门及实战41-45

文章目录

[41 嵌套的for循环](#41 嵌套的for循环)
[42 for循环嵌套练习(1)](#42 for循环嵌套练习(1))
[43 for循环嵌套练习(2)](#43 for循环嵌套练习(2))
[44 break和continue](#44 break和continue)
[45 质数练习补充](#45 质数练习补充)

41 嵌套的for循环

html 复制代码

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	/*
		*****
		*****
		*****
		*****
		*****
		
		*
		**
		***
		****
		*****
	*/

	
	// 通过一个for循环来输出图形
	// 这个for循环执行几次，图形的高度就是多少
	// 它可以用来控制图形的高度
	for(var i = 0; i < 5; i++){
		// 在循环内部再创建一个循环，用来控制图形的宽度
		// 内层循环可以决定图形的宽度
		for(var j = 0; j < 5; j++){
			document.write("*&nbsp;&nbsp;");
		}
		document.write("<br>");
	}

	for(var i = 1; i <= 5; i++){
		for(var j = 1; j <= i; j++){
			document.write("*&nbsp;&nbsp;");
		}
		document.write("<br>");
	}

	for(var i = 5; i >= 1; i--){
		for(var j = 1; j <= i; j++){
			document.write("*&nbsp;&nbsp;");
		}
		document.write("<br>");
	}
	
</script>
<style>
</style>
</head>
<body>
</body>
</html>

42 for循环嵌套练习(1)

html 复制代码

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	/*
		1. 打印九九乘法表
		1*1=1
		1*2=2 2*2=4
		1*3=3 2*3=6 3*3=9
		...
		9*9=81

	*/

	for(var i = 1; i <= 9; i++){
		for(var j = 1; j <= i; j++){
			document.write("<span>" + j + "*" + i + "=" + (j * i) + "</span>" );
		}
		document.write("<br>");
	}
</script>
<style>
	body {
		width: 2000px;
	}
	
	span {
		display: inline-block;
		width: 80px;
	}
</style>
</head>
<body>
</body>
</html>

43 for循环嵌套练习(2)

html 复制代码

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	/*
		2. 打印出1-100之间所有的质数
	*/

	for(var i = 2; i <= 100; i++){
		var flag = 1;
		for(var j = 2; j <= parseInt(i ** 0.5); j++){
			if(i % j == 0){
				flag = 0;
				break;
			}
		}
		if(flag){
			document.write(i + "&nbsp;");
		}
	}
</script>
<style>
</style>
</head>
<body>
</body>
</html>

44 break和continue

html 复制代码

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">
	/*
		break关键字可以用来退出switch或循环语句
		不能在if语句中使用break和continue
		break关键字，会立即终止离他最近的那个循环语句
	*/

	for(var i = 0; i < 5; i++){
		console.log(i);
		break;
	}
	
	if(true){
		break;
		console.log(i);
	}
	
	/*
		可以为循环语句创建一个label，来标识当前的循环
		label：循环语句
		使用break语句时，可以在break后跟着一个label，这样break将会结束指定的循环，而不是最近的
	*/
	
	outer:
	for(var i = 0; i < 5; i++){
		console.log("外层循环");
		for(var j = 0; j < 5; j++){
			break outer;
			console.log("内层循环");		
		}
	}
	
	/*
		continue关键字可以用来跳过当次循环
		同样continue也是默认只会对离他最近的循环起作用
	*/
	for(var i = 0; i < 5; i++){
		console.log(i);
		if(i == 2){
			//break;
			continue;
		}
	}
	
	// 测试程序的性能
	// 在程序执行前，开启计时器
	// console.time()可以用来开启一个计时器
	// 他需要一个字符串作为参数，这个字符串将会作为计时器的标识
	console.time("test");
	for(var i = 0; i < 1000000; i++){
		for(var j = 0; j < i; j++){
			//console.log(i * j);		
		}
	}
	// 终止计时器
	// console.timeEnd()用来停止一个计时器，需要一个计时器的名字作为参数
	console.timeEnd("test");
</script>
<style>
</style>
</head>
<body>
</body>
</html>

45 质数练习补充

html 复制代码

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">

	for(var i = 2; i <= 100; i++){
		var flag = 1;
		for(var j = 2; j <= Math.sqrt(i); j++){
			if(i % j == 0){
				flag = 0;
				break;
			}
		}
		if(flag){
			document.write(i + "&nbsp;");
		}
	}
	
	// 可以通过Math.sqrt()对一个数进行开方
	var result = Math,sqrt(4); // 2
</script>
<style>
</style>
</head>
<body>
</body>
</html>