2021-08-03

偷学web前端之javascrpit（第七天）

比较运算符

（1）>：大于号
（2）<：小于号
（3）==：等于号，我们之前所说的=是赋值符号，在 js 里，==才是真正的等于号。
（4）>=：大于等于
（5）<=：小于等于
（6）!=：不等于

比如 var a=1>2，它打印出来是 false，打印出来是 Boolean（布尔值）值，若 var a=1<2，则打印出来是 true，如果是两个字符串进行比较，他会用自身的阿斯克码进行比较，在 js 里，NaN 不等于任何东西，包括自己。

逻辑运算符
&&：与
undefined、null、NaN、0、“”、false 这些值转换为布尔值是 false（假），其他的值转化为布尔值都是 true（真）。如果&&只有两个值的话，他会先看第一个表达式的值转化为布尔值是否为真，如果为真，他就会把第二个表达式的值返回，如果第一个表达式的值为假，他就会直接把第一个表达式的值返回，不看后面的。
比如：
var a=1&&2; document.write（a）；打印 a 得 2.
var a=1-1&&2; document.write（a）；打印 a 得 0.

如果&&有三个或多个值，也是一样的，他会一个一个判断，如果这些值都为真，则返回最后一个表达式的值，如果判断到哪个表达式的值是假的，他就会把这个表达式的值直接返回，后边的就不看了（遇到假就停）（这里返回得是表达式的值，不是真和假，真和假是用来判断的），所以&&被叫做短路语句，比如 2>1&&document.write（“内容”），当前边为真的时候，才会执行后边的语句，如果前边是假的，则不执行后边的语句。

||:或
||和&&正好相反，如果||有多个值，他会一个一个判断，如果这些值都为假，则返回最后一个值，如果判断到哪个表达式的值是真的，他就会直接返回这个表达式的值，后边就不看了（遇到真就停）。

比如：
var a=1||2; document.write（a）；打印 a 得 1.
var a=1-1||2; document.write（a）；打印 a 得 2.

！：非
！的作用就是把一个值转换为布尔值再取反，如 var a=!123;打印 a 得 false，！！的作用是直接把一个值转化为布尔值，如 var a=!!“”；打印 a 得到 false，var a=!!123，打印 a 得 true。

条件语句
（1）if 语句和 if else if它的形式为：
if（条件）{
执行语句
}
他的原理是，当小括号里的条件转化为布尔值为真的时候，才会执行大括号里边的语句。

例 1：if（1>0）{
document.write（“哥很帅”）；
}

例 2：if（1>2）{
document.write（“哥很帅”）；
}

例 3：if（1>0&&8>9）{
document.write（“哥很帅”）；
}
例 4：if（1>0||8>9）{
document.write（“哥很帅”）；
}

解析：在例 1 中，1>0 为真，所以会执行后边的语句，例 2 中 1>2 为假，所以不会执行后边的语句，例 3 有与运算符，之前讲的，一个一个判断，1>0 为真，继续往下看，8>9是假的所以整个括号里边返回假，所以不会执行，例 4 是或运算符，1>0 是真的，直接返回，括号里返回真，执行后边的语句。所以在 if 语句里，&&可以理解成并且，全真才为真，才会执行后边的语句，||理解成或者，有一个真就为真就会执行语句，全假才为假。

练习 1：写一个程序，弹出一个可以输入数值的对话框，里边输入考试的分数，
然后当分数在 90-100 之间的话，打印 alibaba，当分数在 80-90 之间时，打印 
tencent，当分数在 70-80 之间时，打印 baidu，当分数在 60-70 分之间时，
打印 mogujie，当分数在 60 分以下时，打印 Oh my god!!!you gotta be
 kidding me!!!开始写源码：
var score = parseInt(window.prompt("input")); 
if(score > 90 && score <= 100){ 
 document.write("alibaba"); 
}else if(score > 80 && score <= 90){ 
 document.write("tencent"); 
}else if(score > 70 && score <= 80){ 
 document.write("baidu"); 
}else if(score > 60 && score <= 70){ 
 document.write("mogujie"); 
}else if(score < 60){ 
 document.write("Oh my god!!!you gotta be kidding me!!!"); 
}else{ 
 document.write("error"); }

解析：var score = parseInt(window.prompt(“input”));这句的作用是弹出一个可以输入的对话框，对话框的提示信息是“”里边的 input，然后把输入的数值转换成整形装到变量 score 里边去，分数在 90-100 之间，不能写成 90<score<=100,这样计算机识别不了，它是满足了两个条件，大于 90 并且小于等于 100，即 score>90&&score<=100，然后当你写了很多 if 的时候并且条件是互斥的（满足第一个条件就不能满足第二个条件）就可以使用 else，else 的作用就是当有很多 if 的时候，当满足了前边的条件执行完语句后后边的就直接不看了，不用一个一个去判断，但是 else 必须在条件互斥的情况下才可以用，如果两个 if 语句有交叉点就不能用，比如当在 90-100 之间打印一个值，在 80-95 之间打印一个值，两个条件有交叉点就不能用 else，然后最后一个 else就是除了以上情况以外的情况打印 error（错误分数）。

（2）if 和&&转换
其实 if（1>2）{document.write（“a”）；}就等于 1>2&&document.write（“a”）；

4.循环语句：系统为了方便我们重复性的做一件事，给我们提供了一个机制，叫循环机制，他会循环的写东西，还可以控制循环圈数，当你把语句放在里边时，他会自动循环。

（1）for 循环： 例 5：以打印 10 个 a 为例，它的代码为：
for(var i=0; i<10; i++){
document.write(“a”);
}

其中，for 为关键字，小括号里放了三个语句，用两个分号隔开，大括号里的语句叫做循环体，这样这个 a 就被循环往复打印了十遍，它的原理在于它的执行顺序:
第一步：先执行小括号里边的第一个语句 var i=0；（这个语句只执行一遍，所有的 for循环小括号里的三条语句中的第一条只执行一遍，以后就不用了）第二步：把小括号里的第二条语句塞到 if 里作为条件来判断，如果条件成立则执行大括号里的循环体，在此例中，if（i<10）{ document.write(“a”);}，因为0<10 是成立的，所以 a 被打印了一遍。
第三步：执行小括号里的第三条语句，i++，此时 i 变成了 1.
第四步：再把小括号里的第二条语句塞到 if 里作为条件来判断，如果条件成立则执行大括号里的循环体，在此例中，因为 1<10 是成立的，所以 a 又被打印了一遍。
第五步：继续执行小括号里的第三条语句，i++，此时 i 变成了 2.
以此类推……………………
到最后，当 i 变成了 9，判断 9<10，打印第十个 a 之后，继续 i++，i 变成了 10，10<10不成立，则立即结束循环。

总结：先执行 for 循环小括号里的第一条语句，然后把第二条语句塞到 if 里作为条件判断，如果条件成立，则执行大括号里的循环体，然后执行第三条语句，执行完之后再把第二条语句塞到 if 里作为条件判断，如果条件成立，则执行大括号里的循环体，继续执行小括号里的第三条语句……直到括号里的第二条语句塞到 if 里作为条件判断时条件不成立，则 for 循环结束。（注意：for 循环括号里的第一条语句只用一次，第二条语句判断条件成立执行完循环体之后第三条语句才执行，第三条语句永远在最后执行。）

拓展：其实 for 循环的小括号里也没有非要写三个语句，如果哪个语句是空的，就不会执行，直接跳过，所以例 5 也可以这么写：
var i=0;
for(; i<10;){
document.write(“a”);
i++;
}
把 var i=0 提出去，让他先执行，然后，小括号里的第一个语句是空的，直接跳过，然后判断第二句，执行循环体（先打印，再 i++），然后小括号第三句空的，跳过，继续判断第二句，执行循环体，循环往复，直到 i 加到 10,10<10 是假的，循环停止，i 从 0 到 9，a 被打印了十次。

例 6：接着例 5，打印 10 个 a，但是要求 for 循环小括号里只有一个 i，i=1，代码为：
var i=1；
var count=0；
for（；i；）{
document.write（“a”）；
count++；
if（count==10）{
i=0；
}
}
解析：这里边定义一个计数器 count，然后把 count 放到 for 循环里让他自己++，再写一个 if 语句，当 count 加到 10 之后，让 i=0；加了 10 次后，i 变成 0，小括号里的条件就不成立了，for 循环结束，a 被打印了 10 遍。也可以不用 count，用 i 作为计数器，当 i 等于 11 的时候，让 i 归零：

var i=1；
for（；i；）{
document.write（“a”）；
i++；
if（count==11）{
i=0；
}
}

练习 2：计算 2 的 n 次幂，n 可输入，n 为自然数。
var n = parseInt(window.prompt("请输入 n")); 
var mul = 1; 
for(var i = 0;i < n;i++){ 
 mul *= 2; } 
document.write(mul);

解析：2 的 n 次幂就是 n 个 2 相乘，用 mul 作为他的结果，先让 mul=1，n 个 2 相乘即mul 被乘了 n 次 2，用编程语言就可以理解为它是一个循环，然后每次循环都给 mul 自身乘 2，乘了 n 次 2，则循环了 n 圈，然后用 n 去控制循环圈数即可。

练习 3：计算 n 的阶乘，n 可输入。
var n = parseInt(window.prompt("请输入 n")); 
var mul = 1; 
for(var i = 1;i <= n;i++){ 
 mul *= i; } 
document.write(mul);

解析：阶乘就是，比如说 5 的阶乘就是 54321，所以也可以理解成 for 循环，为了让 n 和循环圈数相等，所以 var mul=1，然后去乘这 5 个数，乘 5 圈，用 i 表示这五个数，先让 i 等于 1，然后去乘，再自加……加到 5 去乘，循环结束。

练习 4：输入 a，b，c 三个数，打印出最大的数。
var a = parseInt(window.prompt("请输入 a")); 
var b = parseInt(window.prompt("请输入 b")); 
var c = parseInt(window.prompt("请输入 c")); 
if(a > b) {
if(a > c){ 
 document.write(a); 
 }else{ 
 document.write(c); 
 } 
}else{ 
 if(b > c){ 
 document.write(b); 
 }else{ 
 document.write(c); 
 }
  }

解析：先让 a 和 b 比，如果 a 大于 b，就让 a 和 c 比，a 大于 c 的话就打印 a，否则打印 c，如果 a 不大于 b，就让 b 和 c 比，b 大于 c 的话就打印 b，否则打印 c。

练习 5：编写一个程序，输入一个三位数的正整数，输出时反向输出，例如输入 456，输出 654.
var num = parseInt(window.prompt("请输入一个三位数（整数）")); 
if(num < 100 || num > 999) { 
 document.write("输入不正确！"); 
}else{ 
 var a = num % 10; 
 num = num - a; 
 var b = num % 100; 
 num = num - b; 
 b /= 10; 
 var c = num / 100; 
 var num1 = a * 100 + b * 10 + c; 
 document.write(num1); }

解析：此例中用 cba 来比喻三位数，输出 abc，先用这个数摩尔 10，把 a 取出来，然后用 cba 减去 a 得 cb0，再用 cb0 摩尔 100 得到 b0，用 cb0 减去 b0 得 c00，用 b0 除以10 取出 b，用 c00 除以 100 取出 c，三个数字取出来之后，组成 abc，a 乘 100 加 b 乘10 加 c 即可。

练习 6：著名的斐波那契数列：1 1 2 3 5 8，输出第 n 项。
var n = parseInt(window.prompt("请输入 n")); 
var first = 1, 
 second = 1, 
 third; 
if(n > 2){ 
 for(var i = 0;i < n - 2;i++){ 
 third = first + second; 
 first = second; 
 second = third; 
 } 
 document.write(third); 
}else{ 
 document.write(1); }

解析：这个斐波那契数列只要你找到规律了就好办，这个数列已知前两个数，后边的数都是未知的，但是未知数等于前两个数字的和，知道了这个规律，就可以 var 三个变量，第一个数和第二个数（first 和 second）都赋值 1，第三个数（third）以及后边的数我们用循环来求，你还会发现一个规律，求第三个数得计算一次，求第四个数得计算两次，求第五个数得计算三次……那么，求第 n 个数就要计算 n-2 次，所以，我们写个 for 循环，用 i 控制循环圈数，循环圈数 = n-2，在循环体里，首先第三个数等于第一个数加第二个数，然后，我们移一下位，让第一个数等于第二个数，第二个数等于第三个数，以便于下一轮再次计算，这样循环的话，等到循环结束，打印 third
即可。还有就是当 n 输入 1 和 2 时，用 if 语句让他打印 1 就好了。

练习 7：打印出 100 以内的所有质数。
方法一： 
var count = 0; 
for(var i = 1;i <= 100;i++){ 
 for(var j = 1;j <= i;j++){ 
 if(i % j == 0){ 
 count++; 
 } 
 } 
 if(count == 2){ 
 document.write(i + ' ');
} 
 count = 0; }
解析：质数就是只能被 1 或者自身整除的数，其实这么说不标准，就是他自己只能
被从 1 到他自身的所有数整除两次，所以 1 不是质数。要打印 100 以内的质数，
先把 1-100的所有数字拿 i 用一个 for 循环表示出来，外边的 for 循环表示每
一个 i 的变化，我们再在循环里边套一个 for 循环，里边定义一个 j，让 j 小于
等于 i 且自加，我们定义一个计数器 count，那么，当 i 被 j 整除了以后，
count 就加一，里边的这个 for 循环是控制 j 和 count 的，返回外边的循环，
当里边的循环结束的时候也就是 j 等于 i 的时候，假如 count 等于 2 的话，
就打印 i，打印完之后，由于一个 count 控制一个 i，所以当 i 变化的时候，
得让 count 归零。

方法二： 
var count = 0; 
for(var i = 2;i <= 100;i++){ 
 for(var j = 1;j <= Math.sqrt(i);j++){ 
 if(i % j == 0){ 
 count++; 
 } 
 } 
 if(count == 1){ 
 document.write(i + ' '); 
 } 
 count = 0;
 }
 解析：这是一个思维的飞跃，比如写几个得数为 100 的乘式：
10*10,5*20,4*25,2*50,1*100，这几个乘式你会发现第一个因数变小，第二个因数
必然变大，如果 100 能被 2 整除，必然能被 50 整除，能被 4 整除就能被 25
 整除，它是以 100 的开方 10 来看的，所以第二个循环没必要向方法一那样循环
 那么多圈，直接控制 j 小于 i 的开方 Math.sqrt(i)，然后当 count 加到 1 就
 打印 i 即可。

document.write 和 console.log 的区别
在真正开发的时候，document.write 是往页面里边输出文档流的，它干的不是输出的事儿，以前用它是为了显示方便，真正输出用的是 console.log，它的作用是把东西输出至控制台。