Skip to content

Commit 3f25fc5

Browse files
happyzjphappyzjp
committed
使用递归代替循环
1 parent 9ac77bf commit 3f25fc5

4 files changed

Lines changed: 461 additions & 0 deletions

File tree

‎basic-javascript/md/javascript-do-while-loops.md‎

Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
---
2+
id: 5fe1917337c23adfb0d59cf7
3+
challengeType: 1
4+
videoUrl: ''
5+
forumTopicId: -1
6+
title: do...while 循环语句用法详解
7+
---
8+
9+
## Description
10+
<section id='description'>
11+
![](https://www.icoderoad.com/javascript/basic-javascript/images/jsdata.png)
12+
13+
欢迎关注路条编程网站，本专题主要介绍 JavaScript 基本语法、注释、变量声名、各种运算符、字符串、数组及条件语句等。通过学习 JavaScript 算法及数据结构这一系列文章，你将会逐步掌握 JavaScript 基础相关的知识。
14+
15+
do...while 循环语句用法详解。
16+
17+
今天我们介绍 JavaScript 语言中的第三种循环类型 do...while 循环。
18+
19+
do...while 语句一直重复直到指定的条件求值得到假值（false）。
20+
21+
语法示例如下所示：
22+
23+
do
24+
语句块
25+
while (执行条件);
26+
27+
语句块 在检查条件之前会执行一次。要执行多条语句（语句块），要使用块语句（{ ... }）包括起来。 如果 执行条件 为真（true），语句块 将再次执行。 在每个执行的结尾会进行条件的检查。当 执行条件 为假（false），执行会停止并且把控制权交回给 do...while 后面的语句。
28+
29+
do-while 与 while 循环的不同之处在于: 它先执行循环中的语句,然后再判断表达式是否为真, 如果为真则继续循环；如果为假, 则终止循环。因此, do-while 循环至少要执行一次循环语句。
30+
31+
我们来看一个例子。
32+
33+
var arr = [];
34+
var i = 0;
35+
do {
36+
arr.push(i);
37+
i++;
38+
} while (i < 3);
39+
console.log(arr); // => [0, 1, 2]
40+
41+
这看起来和其他循环语句差不多，返回的结果是[0, 1, 2]，do...while 与其他循环不同点在于，初始条件为假时的表现，让我们通过实际的例子来看看。 这是一个普通的 while 循环，只要 i < 3，它就会在循环中运行代码。
42+
43+
var arr = [];
44+
var i = 3;
45+
while (i < 3) {
46+
arr.push(i);
47+
i++;
48+
}
49+
console.log(arr); // => []
50+
51+
注意，我们首先将 i 的值初始化为 3。执行下一行时，注意到 i 不小于 3 ，循环内的代码将不会执行。所以 arr 最终没有添加任何内容，因此示例中的所有代码执行完时，arr 仍然是[]。 现在，看一下 do...while 循环。
52+
53+
var arr = [];
54+
var i = 3;
55+
do {
56+
arr.push(i);
57+
i++;
58+
} while (i < 3);
59+
console.log(i); // => 4
60+
console.log(arr); // [3]
61+
62+
在这里，和使用 while 循环时一样，我们将 i 的值初始化为 3。执行下一行时，没有检查 i 的值，直接执行花括号内的代码。数组会添加一个元素，并在进行条件检查之前递增 i。然后，在条件检查时因为 i 等于 4 不符合条件 i < 3，所以退出循环。最终 arr 的值是 [3]。 本质上，do...while 循环确保循环内的代码至少运行一次。 让我们通过 do...while 循环将值添加到数组中。
63+
64+
</section>
65+
66+
## Instructions
67+
<section id='instructions'>
68+
69+
</section>
70+
71+
## Tests
72+
<section id='tests'>
73+
74+
</section>
75+
76+
## Challenge Seed
77+
<section id='challengeSeed'>
78+
79+
<div id='js-seed'>
80+
81+
```js
82+
83+
```
84+
85+
</div>
86+
87+
88+
89+
</section>
90+
91+
## Solution
92+
<section id='solution'>
93+
94+
95+
</section>

‎basic-javascript/md/javascript-for-loops.md‎

Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
---
2+
id: 5fe035eefb445251f8faa0ad
3+
challengeType: 1
4+
videoUrl: ''
5+
forumTopicId: -1
6+
title: for 循环语句用法详解
7+
---
8+
9+
## Description
10+
<section id='description'>
11+
![](https://www.icoderoad.com/javascript/basic-javascript/images/jsdata.png)
12+
13+
欢迎关注路条编程网站，本专题主要介绍 JavaScript 基本语法、注释、变量声名、各种运算符、字符串、数组及条件语句等。通过学习 JavaScript 算法及数据结构这一系列文章，你将会逐步掌握 JavaScript 基础相关的知识。
14+
15+
for 循环语句用法详解。
16+
17+
今天我们介绍 JavaScript 语言中的第二种循环类型 for 循环，它是 JavaScript 语言中最常见的循环。
18+
19+
for 循环中的三个表达式用分号隔开。
20+
21+
语法示例如下所示：
22+
23+
for ([初始化]; [条件判断]; [计数器])
24+
25+
初始化语句只会在执行循环开始之前执行一次。它通常用于定义和设置循环变量。
26+
27+
条件判断语句会在每一轮循环的开始执行，只要条件判断为 true 就会继续执行循环。当条件为 false 的时候，循环将停止执行。这意味着，如果条件在一开始就为 false ，这个循环将不会执行。
28+
29+
计数器是在每一轮循环结束时执行，通常用于递增或递减。
30+
31+
我们继续以计算 1+2+3 ... +98+99+100 的值算法为例，通过 for 循环进行求值计算，代码如下所示：
32+
33+
var total =0;
34+
for( var i=1; i<=100; i++) {
35+
total = total + i;
36+
}
37+
38+
console.log( total ); // => 5050
39+
40+
在控制台执行上面代码后，会在控制台输出计算结果为 5050. 与 while 循环计算结果一致。
41+
42+
for 循环可以按照我们指定的顺序来迭代，通过更改我们的计数器，我们可以按照奇偶数顺序来迭代。
43+
44+
我们继续调整上面的代码，将计数器部分进行调整，i += 2 让 i 每次循环之后增加 2。计算 1 至 100 内的奇数之和，代码如下所示：
45+
46+
var total =0;
47+
for( var i=1; i<=100; i += 2) {
48+
total = total + i;
49+
}
50+
51+
console.log( total ); // => 2500
52+
53+
以上代码在控制台执行后，控制台打印输出结果为 2500，大家可以与前面讲解的 while 循环计算奇数的代码进行比较下，使用 for 循环代码更为简洁。
54+
55+
for 循环也可以逆向迭代，只要我们定义好合适的条件。我们继续调整上面代码，还是计算 100 以内所有奇数之和。为了让每次倒数递减 2，我们需要改变我们的初始化条件，条件判断和计数器。
56+
57+
我们让初始值为 i = 99，并且当 i > 0 的时候才继续循环。我们使用i -= 2 来让 i 每次循环递减 2 。
58+
59+
var total =0;
60+
for( var i=99; i>0 ; i -= 2) {
61+
total = total + i;
62+
}
63+
64+
console.log( total ); // => 2500
65+
66+
67+
迭代输出一个数组的每个元素是 JavaScript 语言中的常见需求，for 循环可以做到这一点。下面的代码将 1 至 100 内所有整数添加至数组 arr ,然后通过循环数组里的每个元素求和，计算 1+2+3 ... +98+99+100 的值，并将最终计算结果输出至控制台 ：
68+
69+
var arr = [];
70+
for (var i = 1; i <=100 ; i++) {
71+
arr.push(i);
72+
}
73+
console.log(arr);
74+
var total =0;
75+
for( var i=0; i<arr.length; i++ ){
76+
total += arr[i];
77+
}
78+
79+
console.log( total ); // => 5050
80+
81+
注意：数组的索引从零开始的，这意味着数组的最后一个元素的下标是：数组的长度 -1。我们这个循环的条件是 i < arr.length ，当 i 的值为长度 -1 的时候循环就停止了。
82+
83+
如果你有一个二维数组，可以使用相同的逻辑，先遍历外面的数组，再遍历里面的子数组。下面是一个例子：
84+
85+
var arr = [
86+
[1,2], [3,4], [5,6]
87+
];
88+
89+
var total =0;
90+
for (var i=0; i < arr.length; i++) {
91+
for (var j=0; j < arr[i].length; j++) {
92+
total += arr[i][j];
93+
}
94+
}
95+
96+
console.log( total ); // => 21
97+
98+
控制台最后会输出每个子数组中每个元素的求和结果 21。
99+
100+
提示：对于内部循环，我们可以通过 arr[i].length 来获得子数组的长度，因为 arr[i] 的本身就是一个数组。
101+
102+
</section>
103+
104+
## Instructions
105+
<section id='instructions'>
106+
107+
</section>
108+
109+
## Tests
110+
<section id='tests'>
111+
112+
</section>
113+
114+
## Challenge Seed
115+
<section id='challengeSeed'>
116+
117+
<div id='js-seed'>
118+
119+
```js
120+
121+
```
122+
123+
</div>
124+
125+
126+
127+
</section>
128+
129+
## Solution
130+
<section id='solution'>
131+
132+
133+
</section>

‎basic-javascript/md/javascript-while-loops.md‎

Lines changed: 145 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
1+
---
2+
id: 5fde9da51232170a98443cf2
3+
challengeType: 1
4+
videoUrl: ''
5+
forumTopicId: -1
6+
title: while 循环语句用法详解
7+
---
8+
9+
## Description
10+
<section id='description'>
11+
![](https://www.icoderoad.com/javascript/basic-javascript/images/jsdata.png)
12+
13+
欢迎关注路条编程网站，本专题主要介绍 JavaScript 基本语法、注释、变量声名、各种运算符、字符串、数组及条件语句等。通过学习 JavaScript 算法及数据结构这一系列文章，你将会逐步掌握 JavaScript 基础相关的知识。
14+
15+
while 循环语句用法详解。
16+
17+
今天我们介绍 JavaScript 语言中的第一种循环类型 while 循环，因为它规定，当 while 条件为真时，循环体内的代码块才会执行，反之不执行。
18+
19+
使用 break 语句终止当前循环，并使用 continue 语句跳过循环中的值。
20+
21+
语法示例如下所示：
22+
23+
while (condition) {
24+
//执行代码块
25+
}
26+
27+
参数说明：
28+
29+
condition 为在每次遍历循环之前求值的表达式。如果该条件的计算结果为 true，则执行代码块。当条件的计算结果为 false 时，执行代码将在 while 循环之后继续。 如果条件始终为真，则循环将永不结束。这种情况将使您的浏览器崩溃，切记切记。
30+
31+
要计算 1+2+3 ... +98+99+100 的值，我们常规的做法是通过变量设置初始值，执行多次相加操作，直到增加至 100 为止。类似下面的代码：
32+
33+
var total =0;
34+
total = total + 1;
35+
total = total + 2;
36+
total = total + 3;
37+
...
38+
total = total + 100;
39+
40+
以上代码会重复多次，太麻烦了，通过 while 循环几行代码，可以方便的实现相同的效果，while 循环代码示例如下所示：
41+
42+
var total =0;
43+
var i=1;
44+
while ( i<=100 ) {
45+
total = total + i;
46+
i++;
47+
}
48+
49+
console.log( total ); // => 5050
50+
51+
在上面的代码里，while 循环执行 100 次，每次循环把变量 i 的值与 total 变量相加后的结果赋值至变量 total ,最后在控制台将计算结果输出， total 最终的结果值为 5050 。
52+
53+
如果我们只想计算 1 至 100 内奇数的和，应该如何实现呢？我们可以在代码块内通过取模运算判断是否为奇偶数，然后通过 continue 语句跳过偶数，只计算奇数，代码实现如下所示：
54+
55+
var total =0;
56+
var i=1;
57+
while ( i<=100 ) {
58+
if( i % 2 == 0 ){
59+
i++;
60+
continue;
61+
}
62+
console.log('i=' + i );
63+
total += i;
64+
i++;
65+
}
66+
67+
console.log( total ); // => 2500
68+
69+
以上代码执行后会在控制台输出以下信息：
70+
71+
i=1
72+
i=3
73+
i=5
74+
...
75+
i=95
76+
i=97
77+
i=99
78+
2500
79+
80+
最终计算 1 至 100 内奇数之和为 2500。
81+
82+
在上面示例中，在我们不改变循环条件的情况下，如何计算 50 内偶数之和呢？我们可以通过 continue + break 语句结合的方式实现相应的计算。代码示例如下所示：
83+
84+
var total =0;
85+
var i=1;
86+
while ( i<=100 ) {
87+
if( i % 2 == 1 ){
88+
i++;
89+
continue;
90+
}
91+
if( i>50 ){
92+
break;
93+
}
94+
console.log('i=' + i );
95+
total += i;
96+
i++;
97+
}
98+
99+
console.log( total ); // => 650
100+
101+
以上代码执行后会在控制台输出以下信息：
102+
103+
i=2
104+
i=4
105+
i=6
106+
...
107+
i=46
108+
i=48
109+
i=50
110+
650
111+
112+
注意：如果要使用带有条件( condition )的变量，请在循环之前对其进行初始化，然后在循环体内对其进行递增。如果忘记增加变量，循环将永远不会结束。
113+
114+
</section>
115+
116+
## Instructions
117+
<section id='instructions'>
118+
119+
</section>
120+
121+
## Tests
122+
<section id='tests'>
123+
124+
</section>
125+
126+
## Challenge Seed
127+
<section id='challengeSeed'>
128+
129+
<div id='js-seed'>
130+
131+
```js
132+
133+
```
134+
135+
</div>
136+
137+
138+
139+
</section>
140+
141+
## Solution
142+
<section id='solution'>
143+
144+
145+
</section>

0 commit comments

Comments
 (0)