Javascript学习笔记
一、for循环
1.for语法结构
<srcipt>
//for 循环的执行过程
for (var i = 1; i <= 100; i++) {
console.log('你好吗');
}
//1.首先执行里面的计数器变量 var i = 1 .但是这句话在for里面只执行一次 index
//2. 去i <= 100 来判断是否满足条件, 如果满足条件 就去执行循环体,不满足退出循环
//3.最后去执行 i++ i++是单独写的代码 递增 第一轮结束
//4. 接着去执行 i<= 100 如果满足条件 就去执行循环体 不满足条件退循环 进行第二
</script>
2.for 循环可以执行相同的代码
<script>
//for 循环可以执行相同的代码
for (var i = 1; i <= 10; i++) {
console.log('阿远工作室');
}
//我们可以让用户控制输出的次数
var num = prompt('请您输入次数:');
for (var i = 1; i <= num; i++) {
console.log('阿远工作室');
}
</script>
3.for 循环可以重复执行不同的代码
<script>
// for 循环可以重复执行不同的代码 因为我们有计数器变量i 的存在 i每次循环值都会变化
//我们想要输出1个人 1~100岁
//for (var i = 1;i <= 100; i++){
// console.log('这个人今年'+i+'岁了');
// }
for (var i = 1; i <= 100; i++) {
if (i == 1) {
console.log('这个人几年1岁了,他刚出生');
} else if (i == 100) {
console.log('这个人今年100岁了,他很高寿');
} else {
console.log('这个人今年' + i + '岁了');
}
}
</script>
4.for 循环重复执行某些操作
<script>
//for 循环重复执行某些操作 比如我们做了100次加法运算
//求1~100之间的整数累加和
// 需要循环100次 我们需要一个计数器 i
// 我们需要一个存结果的变量sum,但是初始值一定是0
//核心算法: 1 + 2 + 3 + 4 .... .sum = sum + i;
var sum = 0; //求和的变量
for (var i = 1; i <= 100; i++) {
// sum = sum + i;
sum += i;
}
console.log(sum);
</script>
for循环案例
二、for双重循环
1.语法结构
<script>
//1.双重for循环 语法结构
// for (外层的初始化变量;外层的条件表达式;外层的操作表达式) {
// for (里层的初始化变量; 里层的条件表达式; 里层的操作表达式) {
// //执行语句;
// }
// }
//2.我们可以把里面的循环看做是外层循环的语句
//3.外层循环循环一次,里面的循环执行全部
//4.代码验证
for (var i = 1; i <= 3; i++) {
console.log('这是外层循环第' + i + '次');
for (var j = 1; j <= 3; j++) {
console.log('这是里层循环第' + j + '次');
}
}
</script>
小练习:打印一行五个星星
<script>
//一行打印五个星星
// console.log('★★★★★');
// for (var i = 1; i <= 5; i++) {
// console.log('★');
// }
// 正确做法:
// var str = '';
// for (var i = 1; i <= 5; i++) {
// str = str + '★';
// }
// console.log(str);
var num = prompt('请输入星星的个数:');
var str = '';
for (var i = 1; i <= num; i++) {
str = str + '★';
}
console.log(str);
</script>
小练习:打印五行五列星星
<script>
//打印五行五列星星
var str = '';
for (var i = 1; i <= 5; i++) { //外层循环负责打印五行
for (var j = 1; j <= 5; j++) { //里层循环负责一行打印五个星星
str = str + '★';
}
//如果一行打印完毕5个星星就要另起一行
str = str + '\n';
}
console.log(str);
</script>
小练习:打印n行n列星星
<script>
//打印n行n列星星
var rows = prompt('请输入您打印几行星星:');
var cols = prompt('请输入您打印几列星星:');
var str = '';
for (var i = 1; i <= rows; i++) {
for (var j = 1; j <= cols; j++) {
str = str + '★';
}
str = str + '\n';
}
console.log(str);
</script>
小练习:打印倒三角形
<script>
//打印倒三角形
//方法一:
var str = '';
for (var i = 1; i <= 10; i++) {
for (var j = i; j <= 10; j++) { //里层循环打印的个数不一样 j=i
str = str + '★';
}
str = str + '\n'
}
console.log(str);
//方法二:
var str = '';
for (var i = 10; i >= 1; i--) {
for (var j = 1; j <= i; j++) { //里层循环打印的个数不一样 j=i
str = str + '★';
}
str = str + '\n'
}
console.log(str);
</script>
小练习:打印正三角形
<script>
//打印正三角形
var str = '';
for (var i = 1; i <= 10; i++) {
for (var j = 1; j <= i; j++) {
str = str + '★';
}
str = str + '\n'
}
console.log(str);
</script>
小练习:打印九九乘法表
<script>
//打印九九乘法表
var str = '';
for (var i = 1; i <= 9; i++) { //外层循环控制行数
for (var j = 1; j <= i; j++) { //里层循环控制每一行的个数 j <= i
// 1 x 2 = 2
str += j + 'x' + i + '=' + i * j + '\t';
}
str += '\n';
}
console.log(str);
</script>
三、while循环
1.语法结构
代码如下(示例):
<script>
// 1.while 循环语法结构 while 当...的时候
// while(条件表达式) {
// //循环体
// }
//2.执行思路 当条件表达式结果为true 则执行循环体 否则 退出循环
// 3.代码验证
var num = 1;
while (num <= 100) {
console.log('how are you?');
num++;
}
//4.里面应该也有计数器 初始化变量
//5.里面应该也有操作表达式 完成计数器的更新 防止死循环
</script>
2.while循环案例
代码如下(示例):
<script>
//while循环案例
// 1.打印人的一生,从1岁到100岁
var i = 1;
while (i <= 100) {
console.log('这个人今年' + i + '岁了');
i++;
}
//2.计算1~100之间所有整数的和
var sum = 0;
var j = 1;
while (j <= 100) {
sum += j;
j++;
}
console.log(sum);
//3.弹出一个提示框, 你爱我吗? 如果输入我爱你 ,就提示结束,否则一直询问。
var message = prompt('你爱我吗?');
while (message !== '我爱你') {
message = prompt('你爱我吗?');
}
alert('我也爱你啊!');
</script>
四、do while循环
1.语法结构
2.do while 循环案例
<script>
// do while循环案例
// 1.打印人的一生,从1岁到100岁
var i = 1;
do {
console.log('这个人今年' + i + '岁了');
i++;
} while (i <= 100);
//2.计算1~100之间所有整数的和
var sum = 0;
var j = 1;
do {
sum += j;
j++;
} while (j <= 100);
console.log(sum);
//3.弹出一个提示框, 你爱我吗? 如果输入我爱你 ,就提示结束,否则一直询问。
do {
var message = prompt('你爱我吗?');
} while (message !== '我爱你');
alert('我也爱你啊!');
</script>
五、break和continue