『笔记』JavaScript基础学习笔记 1
前言
学无止境,继续加油!
代码块
{alert type="success"}
- 程序是由一条一条语句构成的
- 语句是按照自上而下的顺序一句一句执行的
- 在JS中可以使用
{}
来为语句进行分组 - 同一个
{}
中的语句称为一组语句,也叫代码块
代码块要么都执行,要么都不执行
- 在代码块的后面不需要再编写
;
结束 - JS中的代码块只具有分组的作用 ,没有其他用途
代码块内部的内容,在其外部是完全可见
{/alert}
{
alert("hello");
document.write('class="link"')
}
{
var a = 10;
alert("hello");
document.write('class="link"')
}
console.log("a = "+a)
流程控制语句
通过流程控制语句可以控制程序执行流程,使程序可以根据一定的条件来选择执行
一、条件判断语句
在执行某个语句之前进行判断,成立才会执行语句,不成立则语句不执行
注意:条件判断语句不要使用赋值运算符 =
否则会直接返回true
(一)语法一:if语句
if(条件表达式){
语句…
}
{alert type="success"}
if
语句在执行时,会先对条件表达式进行求值判断,如果条件表达式的值为true则执行if后的语句,为false则不会执行if后的语句- if语句只能控制紧随其后的那个语句
如果希望if语句可以控制多条语句,可以将这些语句放到一个代码块内
- 代码块不是必须的,但是开发中建议编写,哪怕只有一条语句
{/alert}
var a = 20;
if(a > 10 && a <= 20){
alert("a比10大,并且小于等于20");
}
(二)语法二:if…else语句
if(条件表达式){
语句…
}else{
语句…
}
{alert type="success"}
if…else
语句在执行时,会先对条件表达式进行求值判断,如果条件表达式的值为true则执行if后的语句,为false则会执行else后的语句
{/alert}
var age = 60;
if(a >= 60){
alert("你已经退休了");
}else{
alert("你还要继续工作")
}
(三)语法三:if…else if…else语句
if(条件表达式){
语句…
}else if{
语句…
}else if{
语句…
}else{
语句…
}
{alert type="success"}
if…else if…else
语句执行时,会从上到下依次对条件表达式进行求值判断
如果值为true则执行当前语句,如果值为false则继续向下判断
- 只会有一个代码块被执行,一旦执行语句会直接结束
{/alert}
var age = 60;
if(a > 100){
alert("活着挺没意思");
}else if(a > 60){
alert("你该退休了");
}else if(a > 50){
alert("你还要继续工作");
}else if(a > 17){
alert("你已经成年了");
}else{
alert("你还只是个孩子");
}
4、prompt()函数
{alert type="warning"}
- 可以在页面弹出一个带有文本框的提示框
- 用户可以在文本框中输入内容,该函数需要一个字符串作为参数
- prompt()函数的返回值都是字符串string类型
{/alert}
var score = prompt("参数");
alert(score);
(四)实例练习:
1、练习一
输入0-100的成绩后进行判断并输出相应的结果
var score = prompt("请输入成绩");
// 排除小于0大于100的值,同时排除非数字number类型的值
if(score >100 || score < 0 || isNaN(score)) {
alert("毙了");
}else{
if(score ==100) {
alert("奖励BMW");
}else if(score >= 80){
alert("奖励手机");
}else if(score >= 60){
alert("奖励参考书");
}else{
alert("啥都没有");
}
}
2、练习二
输入三个数据后进行判断并输出相应的结果
var height = prompt("请输入身高(cm)");
var money = prompt("请输入财富(万)");
var face = prompt("请输入颜值(px)");
if(height >180 && money > 1000 && face > 500) {
alert("一定嫁");
}else if(height >180 || money > 1000 || face > 500) {
alert("将就一下");
}}else{
alert("坚决不嫁");
}
3、练习三
输入三个数据后进行排序并从小到大输出
var num1 = +prompt("请输入第一个数");
var num2 = +prompt("请输入第二个数");
var num3 = +prompt("请输入第三个数");
if(num1 < num2 && num1 < num3) {
// num1最小,比较num2和num3
if(num2<num3){
alert(num1 + "," +num2 +" ,"+num3);
}else{
alert(num1 + "," +num3 +" ,"+num2);
}
}else if(num2 < num1 && num2 < num3) {
// num2最小,比较num1和num3
if(num1<num3){
alert(num2 + "," +num1 +" ,"+num3);
}else{
alert(num2 + "," +num3 +" ,"+num1);
}
}else{
// num3最小,比较num1和num2
if(num1<num2){
alert(num3 + "," +num1 +" ,"+num2);
}else{
alert(num3 + "," +num2 +" ,"+num1);
}
}
二、条件分支语句
条件分支语句也叫 switch
语句
(一) switch
语法
switch(条件表达式){
case 表达式:
语句…
break;
case 表达式:
语句…
break;
default:
语句…
break;
}
(1)switch…case
语句执行时,会依次将case后的表达式的值和switch后的表达式的值进行全等比较
{alert type="success"}① 如果比较结果为true则从当前case处开始执行代码
② 如果比较结果为false则从继续向下比较
③ 如果所有的比较结果都为false,则执行default后的语句
{/alert}
(2)使用 break;
可以退出switch语句
(3)Switch语句和if语句有重复,可以互相代替
var num = 1;
switch(num){
case 1:
console.log("壹")
break;
case 2:
console.log("贰")
break;
default:
console.log("数据不合法")
break;
}
(二) 实例练习:
对大于60分的输出“合格”,低于60分的输出“不合格”
var score = 61;
switch(parseInt(score/10)){
case 10:
case 9:
case 8:
case 7:
case 6:
console.log("合格")
break;
default:
console.log("不合格")
break;
}
第二种方法
var score = 61;
switch(ttrue){
case sscore>=60:
console.log("合格")
break;
default:
console.log("不合格")
break;
}
三、循环语句
(一) while
循环
语法:
while(条件表达式){
语句……
}
(1)while在语句执行时,先对条件表达式进行求值判断
{alert type="success"}
- 如果值为true,则执行循环体,循环体执行完毕后,继续对表达式进行判断如果为true则继续执行循环体
- 如果值为false,则终止循环
{/alert}
(2)将条件表达式写死为true的循环叫做死循环,该循环不会停止,除非关闭浏览器
(3)可以使用 break;
来终止循环
while(true){
alert(n++);
//判断n是否为10
if(n == 10){
//退出循环
break;
}
}
(4)创建一个循环,往往需要三个步骤
{alert type="error"}
① 创建一个初始变量
② 在循环中设置一个条件表达式
③ 定义一个更新表达式,每次更新初始化变量
{/alert}
//① 创建一个初始变量
var n = 0;
//② 在循环中设置一个条件表达式
while(n < 10){
//③ 定义一个更新表达式,每次更新初始化变量
document.write(n++ +'</br>');
}
(二) do…while
循环
语法:
do{
语句……
}while(条件表达式);
(1)do…while
循环会先执行循环体,再对while后的表达式进行判断
{alert type="success"}
- 如果值为true,则执行循环体,循环体执行完毕后,继续对表达式进行判断如果为true则继续执行循环体
- 如果值为false,则终止循环
{/alert}
(2)do…while
可以保证循环体至少执行一次
var n = 11;
do{
document.write(n++ +'</br>');
}while(n <= 10);
(3)死循环
{callout color="#ff0000"}
尽量不要写死循环,会造成系统内存占用溢出,导致卡死
{/callout}
(4)while
实战练习
① 假如投资年利率为5%,试求从1000增长到5000需要多少年
//定义一个变量,表示当前钱数
var money = 1000;
//定义个一个计数器
var count = 0;
while(money < 5000){
money *= 1.05;
//使count自增
count++;
}
console.log("一共需要"+count+"年")
②输入0-100的成绩后进行判断并输出相应的结果
while(true){
var score = prompt("请输入成绩");
// 判断用户输入的值是否合法
if(score >=0 && score <= 100) {
//满足该条件则证明用户的输入合法,退出循环
break;
}
alert("请输入有效的分数");
}
if(score ==100) {
alert("奖励BMW");
}else if(score >= 80){
alert("奖励手机");
}else if(score >= 60){
alert("奖励参考书");
}else{
alert("啥都没有");
}
(三) for
循环
在for循环中,提供了专门的位置来放 初始化表达式
、 条件表达式
、 更新表达式
1、语法:
for(①初始化表达式;②条件表达式;④更新表达式){
③语句……
}
(1)执行流程
{alert type="error"}
① 执行初始化表达式,初始化变量(只会执行一次)
② 执行条件表达式,判断是否执行循环
如果为true则执行循环语句③,如果为false则终止循环
④执行更新表达式,更新表达式执行完毕继续重复执行条件表达式②
{/alert}
(2)for循环中的三个表达式可以省略,也可以写在外部
如果在for循环中不写任何表达式,只写两个;;则变成死循环。 慎用!!!
for(var i = 0 ; i < 10 ; i++ ){
alert(i);
}
for(;;){
alert("hello");
}
2、实例练习
(1)打印1-100之间所有奇数之和
for(var i=1 , sum=0; i<=100 ; i++){
//判断i是否是奇数(不能被2整除的数就是奇数)
//如果i除以2余数不为0则为奇数
if(i%2 != 0){
sum = sum+i;
}
}
(2)打印1-100之间所有7的倍数的个数及总和
for(var i=1 , sum=0 , count=0; i<=100 ; i++){
//如果i除以7余数为0则就是7的倍数
if(i%7 == 0){
sum += i;
//使计数器自增
count++;
}
}
console.log("总和为"+sum); // 输出总和
console.log("总数量为"+count); // 输出总和
(3)打印所有水仙花数(一个3位数,它的每个位上的数字的3次幂之和等于它本身) 例如1^3+5^3+3^3=153
//打印所有的三位数
for(var i=100; i<1000; i++){
//获取i的百位数字
var bai= parseInt(i/100);
//获取十位数字
var shi= parseInt((i-bai*100)/10);
//获取个位数字
var ge= i % 10;
//判断i是否为水仙花数
if(bai*bai*bai + shi*shi*shi + ge*ge*ge == i){
console.log(i);
}
}
(4)质数练习: 判断是否为质数(大于1的自然数,除了1和它本身不能被其他自然数整除的数叫做质数)
var num =prompt("请输入一个大于1的整数");
//判断这个值是否合法
if(num <= 1){
alert("该值不合法");
}else{
// 判断num是否是质数
for(var i=2 ; i<num ; i++){
// 判断num是否能被i整除
if(num % i == 0){
// 如果num能被i整除则说明该值一定不是质数(反向证明)
flag = false;
}
}
// 创建一个变量来保存当前的数的状态,默认当前num为质数
var flag = true;
//如果num是质数则输出
if(flag){
alert(num+ "是质数");
}else{
alert("这个数不是质数");
}
}
3、嵌套的的 for循环
(1)外部循环执行1次,内部循环就执行5次
//向页面中输出内容
for(var i=0; i<5; i++){
for(var n=0; n<i+1; n++){
document.write("星 ");
}
//输出一个换行
document.write("<br/>");
}
(2)实例练习
打印99乘法表
<javascript>
for(var i=1; i<=9; i++){
for(var n=1; n<=i; n++){
document.write("<span>"+ n+ "*" + i+ "=" + i*n +"</span>");
}
}
</javascript>
<style>
//添加span的属性
span{
display: inline-block;
width: 80px;
}
</style>
四、 break
和 continue
1、break关键字
{alert type="success"}
(1)break关键字可以用来退出switch或循环语句
(2)不能在 if语句
中使用break和continue关键词
(3)break关键字会立即终止离它最近的循环语句(不影响外层循环)
for(var i=0; i<5; i++){
console.log("外层循环"+i);
for(var j=0; j<5; j++){
break;
console.log("内层循环"+j);
}
}
{/alert}
(4)可以为循环语句创建一个label,来标识当前的循环
label:循环语句
使用break语句时,可以在break后跟着一个label,这样break将会结束指定的循环,而不是最近的
outer:
for(var i=0; i<5; i++){
console.log("外层循环"+i);
for(var j=0; j<5; j++){
break outer;
console.log("内层循环"+j);
}
}
2、continue关键词
{alert type="success"}
(1)continue关键词可以用来跳过当次循环
(2)默认只会对离它最近的循环起作用
(3) 与break用法类似
{/alert}
outer:
for(var i=0; i<5; i++){
for(var j=0; j<5; j++){
if(j == 1){
continue outer;
}
console.log("内层循环"+j);
}
console.log("外层循环"+i);
}
3、测试程序执行时间
//开启计时器
console.time("test");
//停止计时器
console.timeEnd("test");
4、 质数练习的改进
质数(大于1的自然数,除了1和它本身不能被其他自然数整除的数叫做质数)
{alert type="success"}
可以通过 Math.sqrt()
对一个数进行开方
{/alert}
//开启计时器
console.time("test");
for(var i=2; i<1000; i++){
var flag = true;
for(var j=2; j<=Math.sqrt(i); j++){
if(i%j==0){
flag = false;
//一旦进入判断,则证明i不可能位质数了,此时循环没有再执行的意义
//可以使用break来结束循环
break;
}
}
if(flag){
console.log(i);
}
}
//停止计时器
console.timeEnd("test");
当前页面是本站的「Google AMP」版。查看和发表评论请点击:完整版 »