• 05.JS函数


    前言:
    学习一门编程语言的基本步骤
    (01)了解背景知识
    (02)搭建开发环境
    (03)语法规范
    (04)常量和变量
    (05)数据类型
    (06)数据类型转换
    (07)运算符
    (08)逻辑结构
    (09)函数
    9.函数——function
       1.函数
         函数分为系统函数和自定义函数
         JS提供的函数—isNaN/parseInt/parseFloat/Number/prompt...
         function:功能体,函数(方法),可以接收若干个数据,返回处理结果。用于封装反复执行的代码。
         1)创建一个普通函数
             function 函数名称(){  //名字可以自定义
             函数体  //要封装的代码
             }
             //调用
             函数名称();

        //function普通函数
        function say(){
          console.log("hello");
          console.log("javaScript");
          console.log("hello is me");
        }
        say ();//调用函数打印上述文字
    
        //练习:封装计算1-100之间1-100的和
        function R(){
          for (var i=1,sum=0;i<=100 ;i++ ){
            sum+=i;//for循环运算
          }    
          console.log(sum);//最后是打印sum
        }
        R();//所以调用r之后打印sum,结果为5050

         2)创建带有参数的函数 ——function-param
             function 函数名称(参数列表){ //参数列表用于接受传递的数据
             函数体;
             }
             //调用
             函数名称(参数列表)//实际传递的数据
             参数:创建函数时的参数成为形参,调用时参数成为实参,实参会赋值给形参,多个参数之间用逗号隔开。参数可以有0个或者多个,如果参数未被赋值,值为undefined。

        //function有参数函数
        //计算任意两个数字相加的和
        function add(var1,var2){//参数:形参——参数形式
          console.log(var1+var2);
        }
        //调用
        add(2,3);//参数:实参——实际接收的参数
    
        //练习:创建函数,封装计算1-任意数字之间所有整数的和,调用多次
        function getsum(b){
          for (i=1,sum=0; i<=b;i++ ){
            sum+=i;
          }
          console.log(sum);
        }
        getsum(100);
        getsum(1004);
        getsum(10042);
    
        //练习:创建函数,封装计算任意两个年份之间闰年的个数,调用多次
        function runnian(year,year2){
          for (i=year,count=0;i<=year2 ;i++ ){
            if (i%4===0 && i%100!==0 || i%400===0 ){
            count++;
            console.log(i,count);
            }
          }
        }
        runnian(1980,2000);
        runnian(1880,2100);

         3)创建带有 返回值得函数——function-return
             function 函数名称(参数列表){
             函数体;
             return 值;//返回值,函数执行完返回的结果
             }
             //调用
             函数名称(参数列表)
             注意事项: 如果函数中没有return,或是return 中没有加任何值,返回undefined;执行完return后的代码不会再执行。
                             return 函数:供外部使用的数据,return后面的数据不会被执行。 

        //function带有返回值的函数
        function add(n1,n2){
          //返回n1+n2的结果,用于后期保存,可以理解为如果n1,n2如果有参数传进来之后就执行n1+n2,然后保存结果,以便于后续使用
          return n1+n2;
        }
        //把函数的结果保存下来
        var a=add(100,140);
        console.log("总成绩为:"+a);
    
        //练习:创建函数,传递任意年份,返回是否为闰年,如果是返回true,不是返回false;打印该年天数
        function year(a){
          if (a%4===0  && a%100!==0 || a%400===0){
            return true;
        }//else {   可以省略
          return false;
        }
        function getdays(a){
          if(year(a)){//此处解释为如果year(a)为真就执行以下
            return a+"闰年,366天";
          }//此处省略else  否则
        return a+"不是闰年,365天";
        }
        console.log(getdays(2019));//2019不是闰年,365天
    
        //练习:计算1-任何数字之间所有整数阶乘的和
        //1!+2!+3!+4!+5!
        //步骤一:计算任意数字的阶乘n-1之间所有整数的乘积
        function R(a){
          for (var b=1,num=1;b<=a ; b++){
          num*=b;
          }
          return num;  
        }
        //R(4);
        //步骤2:计算1-n之间所有整数的和
        function getSum(a){
          for(var i=1,sum=0;i<=a;i++){
            sum+=R(i);
          }
          return sum;
        }
        console.log(getSum(5));//153

             总结:对比break和return的用法
                      break用于结束switch语句,还可以用于提前结束循环。
                      return用于在函数中的返回值,也可以结束函数后续代码执行。

       2.作用域——scope
          变量或者函数的可访问范围,分两种
          全局作用域:在全局使用var声明的变量,可以在任意范围访问到,
          函数作用域:在函数中使用var声明的变量,只能在函数内部访问到。

        //作用域——scope
        //全局作用域下的变量
        var a=1;//全局变量,在此处除function fn(){}函数以外就是全局。
        //函数作用域下使用var声明的变量
        function fn(){
          var b=2;//局部变量
          console.log(a);//全局函数a可以在任意范围访问
          console.log(b);//2,局部变量可以在函数作用域内访问
        }
        console.log(a);//1
        fn();//1 调用函数,执行函数体代码。
        console.log(b);//报错,b is not defined

           注意事项:函数中不使用var声明的变量,默认是全局变量,可以在函数的外部访问,不推荐这样写。

        //注意事项
        function fn2(){
          c=3;//函数中不使用var声明的变量默认是全局变量,不建议这么写,造成全局污染
        }
        console.log(c);//即使c是包裹在函数内部,但是没有声明的变量默认是全局变量,所以在函数外部是可以访问的
        fn2();//而调用fn2()的时候内部是什么都没有写的,相当于没有任何函数体代码

          1)变量提升
              JS程序执行前,会将使用var关键字声明的变量提升到所在作用域的最前边,但是赋值还是在原来的位置。

        //变量提升——全局作用域
        var a=1;//声明变量并赋值
        console.log(a);
        /***************** 实际在程序中应为 ****************/
        //变量提升——全局作用域
        var a;//声明提前
        a=1;//var a=1中,声明提前,但是赋值留在原地
        console.log(a);
    
        //变量提升——函数作用域
        function fn(){
          console.log(b);
          var b=2;
        }
        fn();
        /***************** 实际在程序中应为 ****************/
        //变量提升——函数作用域
        function fn(){
          var b;//变量提升到所在函数作用域前面
          console.log(b);//此时只声明,没有赋值,所以打印结果是undefined
          b=2;//赋值留在原地,
        }
        fn();//所以调用后结果是undefined

           2)函数的作用域
              函数的可访问范围,在全局作用域下创建的函数可以在任意位置访问;在函数作用域下创建的函数只能在函数内部访问。

        //函数作用域
        var n=5,m=7;
        function fn2(){
        //var n;提升到所在作用域最前面,相当于此处有一个声明变量,但是未赋值,只能在内部访问这个n
        console.log(n);//此时打印的n值为undefined,因为在函数作用域中var声明提前到作用域最前面,
        var n=8;//此处的相当于正常为 n=8 给前面声明的变量赋值,
        console.log(n);//此时打印的n值为8
        console.log(m);//函数作用域内没有m,调用全局的m
        }
        console.log(n);//此处打印的n值是全局作用域下的n,值为5
        fn2();//此处调用fn2

          3)函数提升
              和变量提升一样,JS程序执行前,会把function关键字创建的函数提升到坐在作用域的最前边,在调用的时候才会执行函数提升的代码。

        //函数提升
        fn();//先调用,
        function fn(){
          console.log(1);    
        }
        /***************** 实际在程序中应为 ****************/
        function fn(){//提升到当前作用域最前端,先创建
          console.log(1);    
        }
        fn();//调用
      3.匿名函数
         没有名称的函数 function(){ }
          1)创建函数
              function fn1(){ }——函数声明
        //创建函数——函数声明
        function fn1(){  }
        var a;
              var fn2=function(参数){ 函数体 }——函数表达式,变量名就是函数名称
        //创建函数——函数表达式
        //变量名称就是函数名称
        var fn2=function(a,b){
          console.log(a+b);
        }
        fn2(1,3);
    
        //练习:使用函数表达式创建函数,计算任意两个数字之间所有整数的和
        //只能先创建在调用,因为不存在提升,
        var add=function(a,b){
          for (i=1,sum=0;i<=b ;i++ ){
          sum+=i;
          }
          return sum;
        }
        console.log(add(3,10));
              总结:对比函数声明与函数表达式的区别
                       函数声明,创建函数存在提升,可以在任意位置创建,后调用。
                       函数表达式,使用变量创建,只存在变量的提升,不存在函数提升,只能先创建,再调用。

          2)匿名函数的自调用
              目的:创建函数作用域包裹起来,防止污染全局。
              (function(形参列表){
              //函数体中的变量不能被外部访问
              })(实参列表);

        //匿名函数
        //避免全局污染,把变量放到函数作用域下
        (function(){//匿名函数可以自己调用自己函数内的数据,匿名函数需要用()()
          var num=2;
          console.log(num);
        })();
    
        (function(a,b){//匿名函数可以自己调用自己函数内的数据,匿名函数需要用()()
          var num=4;
          console.log(a+b);
        })(3,5);

          3)回调函数——callback
               把匿名函数以实参的形式传递,意味着形参就是传递的匿名函数的名称
               function fn(a){
               //调用fn的时候,匿名函数赋值给参数a,a就是函数名称
               a() //执行传递的匿名函数体中的代码。
               }

        //回调函数
        function fn(a){
        //实参赋值给形参
        //把匿名函数赋值给a,a就是函数名称
        //a=function(){  }
        a();
        } 
        fn(function(){
          console.log(1);
          console.log(2);
        }); //调用函数a,执行传递的函数体中的代码
    
        //练习:创建函数,传递两个参数,实参使用匿名函数的形式传递,在匿名函数的函数体中添加若干行代码;在函数中执行匿名函数中的代码。
        function fun(a,b){
        a();
        b();
        };
        fun(function(){
          console.log(3);
        },function(){
            console.log(4);
        });

       4.全局函数——global
          parseInt()/parseFloat()/isNaN()/
          encodeURI() 对网址中的汉字进行编码
          decodeURI() 对已经编码网址进行解码
          isFinite()      判断一个值是否为有限值,是—>true 不是-false
          eval()          可以执行字符串中的表达式

        //全局函数
        //对一个网址中的中文编码
        var str='http://www.jd.com/search?kw=电脑';
        var str2=encodeURI(str);
        console.log(str2);//http://www.jd.com/search?kw=%E7%94%B5%E8%84%91
        //对已经编码的网址进行解码
        var str3=decodeURI(str2);
        console.log(str3);//http://www.jd.com/search?kw=电脑
    
        //isFinite判断一个值是否为有限值。是—>true 不是-false
        //2/0-> Infinity(无穷) 0/2->0
        console.log(0/2,2/0);//0 Infinity
        console.log(isFinite(1/3));//true
    
        //eval可以执行字符串中的表达式
        console.log("1+2");//1+2
        console.log(eval("1+2"));//3
  • 相关阅读:
    SQL语句 分页实现
    PHPexcel入门教程
    json_decode返回null,使用echo json_last_error(); 返回4
    配置mysql可局域网内访问
    thinkphp5.0安装composer安装topthink/think-captcha
    linux下mysql忘记密码怎么办
    centos7 设置mysql账号密码开放3306端口实现远程登陆
    高级数据结构第七章A . 数列(树状数组逆序对)
    高级数据结构第六章E . 苹果树 (dfs+树状数组)
    高级数据结构第六章C . 奶牛狂欢节(两个树状数组)
  • 原文地址:https://www.cnblogs.com/oksana/p/12330643.html
Copyright © 2020-2023  润新知