• JavaScript (三) js的基本语法


    个人博客网:https://wushaopei.github.io/    (你想要这里多有)

    一、关键字

    1、break 关键字使用

    break关键字:如果在循环中使用,遇到了break,则立刻跳出当前所在的循环

    示例:

             for(var i=0;i<10;i++){
                 while (true){
                   console.log("哈哈");
                   break;//
                 }
               }
    
               console.log("哈哈,我出来了");
    
    
            //找到100到200之间第一个可以被7整除的数字,
    
            for(var i=100;i<=200;i++){
                if(i%7==0){
                    console.log(i);
                    break;
                }
            }

    2、continue 关键字

    continue:在循环中如果遇到continue关键字,直接开始下一次循环

    示例:

               var i=0;
               while (i<10){
                 console.log("哈哈");
                 //continue;
                 i++;
               }

    练习:

    ①案例:求100-200之间所有的奇数的和(用continue)

              var sum=0;
               var i=100;
               while(i<=200){
                 //判断是不是偶数
                 if(i%2==0){
                  //如果是偶数----->跳过这个数字
                   i++;//102
                   continue;
                 }
                 sum+=i;
                 i++;
               }
               console.log(sum);

    ②案例:求整数100~200的累加值,但要求跳过所有个位为3的数

               var sum=0;
               var i=100;
               while(i<=200){
                 if(i%10==3){
                   //个位数是3,不要
                   i++;
                   continue;
                 }
                 sum+=i;
                 i++;
               }
               console.log(sum);

    二、数组

    数组:一组有序的数据
    
    数组的作用:可以一次性存储多个数据

    1、数组的定义:

    (1)通过构造函数创建数组

        语法:
    
         var 数组名=new Array();
         var array=new Array();//定义了一个数组
    
        数组的名字如果直接输出,那么直接就可以把数组中的数据显示出来,如果没有数据,就看不到数据
    var 数组名=new Array(长度);

    如果数组中没有数据,但是有长度---,数组中的每个值就是undefined

     构造函数的方式创建数组的时候,如果在Array(一个数字)--->数组的长度(数组元素的个数)

     如果在Array(多个值);这个数组中就有数据了,数组的长度就是这些数据的个数

    (2)通过字面量的方式创建数组

              var 数组名=[];//空数组
              var array=[];

    注意:

    无论是构造函数的方式还是字面量的方式,定义的数组,如果有长度,那么默认是undefined

    数组 : 一组有序的数据

    • 数组元素:数组中存储的每个数据,都可以叫数组的元素,比如:存储了3个数据,数组中3个元素 
    • 数组长度:就是数组的元素的个数,比如有3个元素,就说,这个数组的长度是3 
    • 数组索引(下标):用来存储或者访问数组中的数据的,索引从0开始,到长度减1结束 
    • 数组的索引和数组的长度的关系:长度减1就是最大的索引值
            如何设置数组中某个位置的值
             数组名[下标]=值;
             arr[3]=100;
             如何获取数组中某个位置的值
             var result=数组名[下标];
             console.log(result);

    示例:

             //通过构造函数的方式定义一个数组
               var array=new Array(5);//没有数据,空数组
               console.log(array);
                alert(array);
    
            //就是一个数组---->字面量的方式
               var arr=[];
               console.log(arr);
    
    
               var arr1=new Array();//构造函数的方式---空数组
               var arr2=new Array(5);//构造函数的方式定义了一个数组,数组中有5个元素,数组长度是5,每个数据是undefined
    
               var arr3=new Array(10,20,1000,40,50,60);
               console.log(arr3);
    
    
               var arr=new Array(10,20,30,40,100);
               //console.log(arr[4]);//获取
               //设置
               arr[3]=1000;
               console.log(arr);
    
    
            //字面量的方式更简单
    
               var arr=[10,20,30,40,50,60,70,80,10,20,3043,5];//空数组
               console.log(arr.length);

    2、数组的注意问题

    ① 数组中存储的数据类型是可以不一样的:

             var arr=[10,"哈哈",true,null,undefined,new Object()];
             console.log(arr);

    ②数组的长度是可以改变的:

            var arr=[];
            //通过索引来设置数组中的元素的值
            arr[0]=10;
            arr[1]=20;
            console.log(arr.length);
            //获取元素的值,通过索引的方式
            console.log(arr[2]);

    3、 数组基础知识总结:

       数组:存储一组有序的数据
       数组的作用:一次性存储多个数据
       数组的定义方式:
       1.构造函数定义数组: var 数组名=new Array();
       2.字面量方式定义数组: var 数组名=[];
      
       var 数组名=new Array();空数组
       var 数组名=new Array(值);数组定义了,有长度
       var 数组名=new Array(值1,值2,值3....);定义数组并且有多个数据
       var 数组名=[];空数组
       var 数组名=[值1,值2,值3];有三个数据
       数组元素:就是数组中存储的数据
       数组长度:就是数组中元素的个数
       数组索引(下标):从0开始,到数组的长度减1结束
       通过下标设置数组的元素值: 数组名[索引]=值
       通过下标访问数组的元素值: 数组名[索引]
            var arr1=new Array();//空数组
            var arr2=new Array(5);//长度为5的数组,每个数据的值是undefined
            var arr3=new Array(1,2,3,4,5);//长度为5分数组,
            var arr4=[];//空数组
            var arr5=[1,2,3];//长度为3的数组
            var arr6=["red","blue","green",1,true];//数组中元素的值的类型可以不一样
    
            var arr7=[];
            //设置数组的元素的值
            arr7[0]=10;
            arr7[1]=20;

    4、数组基本算法、练习:

    (1)案例:把数组中每个元素用|拼接到一起产生一个字符串并输出

               var names=["卡卡西","佐助","鸣人","大蛇丸","雏田","小苏","凤姐","黑崎一护"];
               var str="";//空的字符串
               for(var i=0;i<names.length-1;i++){
                 str+=names[i]+"|";
               }
    
               console.log(str+names[names.length-1]);
    
               var names=["卡卡西","佐助","鸣人","大蛇丸","雏田","小苏","凤姐","黑崎一护"];
               var str="";//空的字符串
               for(var i=1;i<names.length;i++){
                 str+="|"+names[i];
               }
    
               console.log(names[0]+str);

    (2)案例:去掉数组中重复的0,把其他的数据放在一个新的数组中

               var arr = [10, 0, 20, 0, 30, 0, 50];
               var newArr=[];//新数组,用来存放第一个数组中所有非0的数字
               for(var i=0;i<arr.length;i++){
                 if(arr[i]!=0){
                   newArr[newArr.length]=arr[i];
                 }
               }
               //把新数组的长度作为下标使用,数组的长度是可以改变的
               console.log(newArr);

    (3)案例:反转数组---把数组中的数据的位置调换

               var array = [10, 20, 30, 40, 50];
               //循环的目的是控制交换的次数
               for (var i = 0; i < array.length / 2; i++) {
                 //先把第一个元素的值放在第三方变量中
                 var temp = array[i];
                 array[i] = array[array.length - 1 - i];
                 array[array.length - 1 - i] = temp;
               }
               console.log(array);
                
               for(var i=array.length-1;i>=0;i--){
                 console.log(array[i]);
               }
               console.log(array);//50 40 30 20 10

    (4)案例:提示用户输入班级人数,求总成绩,平均值,最高分,最低分---扩展

            //提示用户输入人数,并转成数字类型
            var perCount = parseInt(prompt("请输入班级人数"));
            //定义数组存储班级的每个人的成绩
            var perScores = [];
            //循环的方式录入每个人的成绩
            for (var i = 0; i < perCount; i++) {
                //把每个人的成绩存储到数组中
                perScores[perScores.length] = parseInt(prompt("请输入第" + (i + 1) + "个人的成绩:"));
            }
            console.log(perScores);
            //求总成绩
            var sum = 0;
            var avg = 0;//平均值
            var max=perScores[0];//最大值
            var min=perScores[0];//最小值
            for (var i = 0; i < perScores.length; i++) {
                sum += perScores[i];//求和
                //求最大值
                if(max<perScores[i]){
                    max=perScores[i];
                }
                //求最小值
                if(min>perScores[i]){
                    min=perScores[i];
                }
            }
            //平均值
            avg = sum / perScores.length;
            console.log("和为:"+sum);
            console.log("平均值:"+avg);
            console.log("最大值:"+max);
            console.log("最小值:"+min);

    (5)冒泡排序:把所有的数据按照一定的顺序进行排列(从小到大,从大到下)

            var arr = [10, 0, 100, 20, 60, 30];
            //循环控制比较的轮数
            for (var i = 0; i < arr.length - 1; i++) {
                //控制每一轮的比较的次数
                for (var j = 0; j < arr.length - 1 - i; j++) {
                    if (arr[j] < arr[j + 1]) {
                        var temp = arr[j];
                        arr[j] = arr[j + 1];
                        arr[j + 1] = temp;
                    }
                }
            }
            console.log(arr);

    三、函数

    1、函数的定义:

    • 函数:把一坨重复的代码封装,在需要的时候直接调用即可
    • 函数的作用:代码的重用
        语法:
            
             function 函数名字(){
               函数体-----一坨重复的代码
             }
            

    2、函数的调用:

    函数名();

    示例:

           //函数定义
            function cook() {
                console.log("切菜");
                console.log("放油");
                console.log("炒菜");
                console.log("放盐");
                console.log("装盘");
            }
    
            //函数调用
            cook();

    3、函数定义规则与练习

    1. 函数需要先定义,然后才能使用
    2. 函数名字:要遵循驼峰命名法
    3. 函数一旦重名,后面的会把前面的函数覆盖

    示例: 覆盖:

               function f1() {
                 console.log("小杨好帅哦");
               }
               function f1() {
                 console.log("小苏好猥琐哦");
               }
               f1();

    练习:

            //求两个数字的和
            function consoleSum() {//函数定义
                var num1 = 100;
                var num2 = 200;
                var sum = num1 + num2;
                console.log(sum);
            }
            //调用
            consoleSum();
    
    
            //求三个数字的和
            function consoleSum2() {
                var num1 = 10;
                var num2 = 20;
                var num3 = 30;
                var sum = num1 + num2 + num3;
                console.log(sum);
            }
            consoleSum2();
    
            //求两个数字的最大值
            function consoleMax() {
                var x = 10;
                var y = 20;
                console.log(x > y ? x : y);
            }
            consoleMax();
    
            //求三个数字的最大值
            function consoleMax2() {
                var x = 10;
                var y = 20;
                var z = 30;
                var max = x > y ? (x > z ? x : z) : (y > z ? y : z);//嵌套的三元表达式
                console.log(max);
            }
    
            consoleMax2();
            //求1-100之间所有数字的和
            function everySum() {
                var sum=0;
                for(var i=1;i<=100;i++){
                    sum+=i;
                }
                console.log(sum);
            }
            everySum();
            //求1-100之间所有偶数的和
            function everyEvenSum() {
                var sum=0;
                for(var i=1;i<=100;i++){
                    if(i%2==0){
                        sum+=i;
                    }
                }
                console.log(sum);
            }
            everyEvenSum();
    
            //求一个数组的和
            function consoleArraySum() {
                var sum=0;
                var arr=[10,20,30,40,50];
                for(var i=0;i<arr.length;i++){
                    sum+=arr[i];
                }
                console.log(sum);
            }
            consoleArraySum();

    4、 函数的参数

    • 在函数定义的时候,函数名字后面的小括号里的变量就是参数,目的是函数在调用的时候,用户传进来的值操作
    • 在函数定义的时候,函数名字后面的小括号里的变量就是参数,目的是函数在调用的时候,用户传进来的值操作
    • 在函数调用的时候,按照提示的方式,给变量赋值--->就叫传值,把这个值就传到了变量(参数)中
    1. 形参:函数在定义的时候小括号里的变量叫形参 
    2. 实参:函数在调用的时候小括号里传入的值叫实参,实参可以是变量也可以是值

    示例:

            //函数定义
            function consoleSum(x, y) {
                var sum = x + y;//计算和----功能
                console.log(sum);//输出和---第二个功能
            }
               //函数调用
               var num1=parseInt(prompt("输入第一个数字"));
               var num2=parseInt(prompt("输入第二个数字"));
               consoleSum(num1, num2);

    5、函数的返回值

    set:设置
    get:获取
    函数的返回值:在函数内部有return关键字,并且在关键字后面有内容,这个内容被返回了
    当函数调用之后,需要这个返回值,那么就定义变量接收,即可

    说明:

             如果一个函数中有return ,那么这个函数就有返回值
             如果一个函数中没有return,那么这个函数就没有返回值
             如果一个函数中没有明确的返回值,那么调用的时候接收了,结果就是undefined
             (没有明确返回值:函数中没有return,函数中有return,但是return后面没有任何内容)
             函数没有返回值,但是在调用的时候接收了,那么结果就是undefined
             变量声明了,没有赋值,结果也是undefined
             如果一个函数有参数,有参数的函数
             如果一个函数没有参数,没有参数的函数
             形参的个数和实参的个数可以不一致
             return 下面的代码是不会执行的

    示例代码:

            function f1(x,y) {
                var sum= x+y;
                return sum;
                console.log("你才是最帅的");
                return 100;
            }
            var result=f1(10,20);
            console.log(result);
    
               function getSum(x, y) {
                 var sum = x + y;
                 return sum;//把和返回
    
               }
               //函数调用
               var result=getSum(10, 20);
               console.log(result+10);
    
    
            //函数定义: 有参数有返回值的函数
               function getSum(x, y) {
                 return  x + y;//把和返回
               }
               //函数调用
               var result=getSum(10, 20);
               console.log(result+10);
    
    
            //有参数,有返回值的函数
               function f1(x,y) {
                 return x+y;
               }
               //有参数,无返回值的函数
               function f2(x) {
                 console.log(x);
               }
               //无参数,有返回值的函数
               function f3() {
                 return 100;
               }
               //无参数无返回值的函数
               function f4() {
                 console.log("萨瓦迪卡");
               }
    
    
               var sum=f1(10);
               console.log(sum);//

    6、函数案例:

            //求两个数字的和:获取任意的两个数字的和
            function getSum(x, y) {
                return x + y;
            }
            console.log(getSum(10, 20));
            //求1-100之间所有的数字的和
               function geteverySum() {
                 var sum=0;
                 for(var i=1;i<=100;i++){
                   sum+=i;
                 }
                 return sum;
               }
               console.log(geteverySum());
    
    
            //- 求1-n之间所有数的和
            function geteverySum(n) {
                var sum = 0;
                for (var i = 1; i <= n; i++) {
                    sum += i;
                }
                return sum;
            }
            console.log(geteverySum(10));
    
    
            //    - 求n-m之间所有数的和
            function geteverySum2(n, m) {
                var sum = 0;
                for (var i = n; i <= m; i++) {
                    sum += i;
                }
                return sum;
            }
            console.log(geteverySum2(1, 100));
    
            //求圆的面积
            function getS(r) {
                return Math.PI * r * r;
            }
            console.log(getS(5));
    
    
            //    - 求2个数中的最大值
            //    - 求3个数中的最大值
            //    - 判断一个数是否是素数(质数)
               function f1() {
                 console.log("考尼奇瓦");
                 return 100;
               }
               //f1函数调用,把函数的返回值输出了
               console.log(f1());
    
    
               function f1() {
                 console.log("考尼奇瓦");
                 return 100;
               }
               console.log(f1);//输出的f1函数名字-----是f1函数的代码
  • 相关阅读:
    html表格,table标签
    2-3VRP的基本配置
    6 sys模块
    3 datetime模块
    2 time模块
    1 模块和包的介绍
    12 函数进阶---生成器
    13 函数进阶---迭代器
    10 函数进阶---闭包
    11 函数进阶---装饰器
  • 原文地址:https://www.cnblogs.com/wushaopei/p/11718673.html
Copyright © 2020-2023  润新知