偷学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,它的作用是把东西输出至控制台。