05.JS函数

前言:
学习一门编程语言的基本步骤
(01)了解背景知识
(02)搭建开发环境
(03)语法规范
(04)常量和变量
(05)数据类型
(06)数据类型转换
(07)运算符
(08)逻辑结构
(09)函数
9.函数
   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 函数名称(参数列表){ //参数列表用于接受传递的数据
         函数体;
         }
         //调用
         函数名称(参数列表)//实际传递的数据
         参数:创建函数时的参数成为形参,调用时参数成为实参,实参会赋值给形参,多个参数之间用逗号隔开。参数可以有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 值;//返回值,函数执行完返回的结果
         }
         //调用
         函数名称(参数列表)
         注意事项: 如果函数中没有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.作用域
      变量或者函数的可访问范围,分两种
      全局作用域:在全局使用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)回调函数
           把匿名函数以实参的形式传递,意味着形参就是传递的匿名函数的名称
           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.全局函数
      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

原文地址:https://www.cnblogs.com/oksana/p/12330643.html

时间: 2024-08-03 07:52:16

05.JS函数的相关文章

JS函数大全 莫名其妙找到的

1 .document.write(""); 输出语句 2 .JS中的注释为// 3 .传统的HTML文档顺序是:document->html->(head,body) 4 .一个浏览器窗口中的DOM顺序是:window->(navigator,screen,history,location,document) 5 .得到表单中元素的名称和值:document.getElementById("表单中元素的ID号").name(或value) 6 .

JSF页面中使用js函数回调后台bean方法并获取返回值的方法

由于primefaces在国内使用的并不是太多,因此,国内对jsf做系统.详细的介绍的资料很少,即使有一些资料,也仅仅是对国外资料的简单翻译或者是仅仅讲表面现象(皮毛而已),它们的语句甚至还是错误的,很可能会误导使用者. 相对来说,看国内的那些仅仅是翻译过来的文章或书籍不如直接看国外的官方文档或资料来的实在,在我讲述jsf页面中如何使用js调用后台bean方法之前,先给大家说几个国外的资料.在primefaces官方网站上,你可以搜索到几乎所有你需要的东西,primefaces官网为:http:

webBrowser调用外部js文件和js函数(转载)

原文链接:http://fy5388.blog.163.com/blog/static/56499537201012594314130/ webBrowser调用外部js文件和js函数 '第一种方法:webbrowser动态调用html和js代码,都是动态的:代码示例: webBrowser1.Navigate("about:blank");webBrowser1.Document.OpenNew(True);webBrowser1.Document.Write("<H

JavaScript入门:006—JS函数的定义

JS函数的声明.声明函数的格式如下: function 函数名(参数列表){ //函数语句: return 返回值; } 来看具体的函数声明.1.普通函数 <script type="text/javascript"> function ShowHint() { alert("普通函数"); } </script> 2.带参数的函数 <script type="text/javascript"> functio

一个奇怪的JS函数

今天在分析一个jQuery插件源码的时候,发现了一个奇怪的函数. // add leading zeros var pad = function(x){return (1e15+""+x).slice(-2)}; 首先1e15是什么意思? 也不是十六进制表示法. 不管三七21,直接F12打开命令窗口,执行下看看,结果是1后面有15个0. 原来1e15是科学计数法,表示1乘以10的15次方. var y=123e5; // 12300000 var z=123e-5; // 0.0012

Button的Click事件与js函数的两种不同顺序触发方式

先执行js,或者先执行Click事件,最近就遇到了这个问题,开始弄了两个按钮分别执行,那才叫一个蛋疼... 1.先执行js,再执行Button的Click函数 <asp:Button ID="btn_delete" runat="server" Text="提交" onclick="button1_Click"/> 前台js为 <script language="javascript"&g

点击按钮(或超链接)如何跳转到另外一个页面并执行目标页面的js函数

页面跳转同时执行js代码$(function(){});url参数传递 标题的前半部分其实不必赘述,按钮也可以换成超链接.. 假设是需要在A页面上的一个按钮,点击后跳转到B页面,传一些参数后且并B页面的某个js函数可以执行~~ 关键在于如何跳转到目标页面之后并「接着」执行「目标页面的js函数」.原因是目标页面的某个js函数原来是需要点击该页面的按钮或超链接才能触发的,但现在需要在跳转到B页面后立即执行! 先不想是从A页面跳转到B页面,假设你想在B页面一打开就执行的话,是需要把代码逻辑写在$(fu

C#调用htmlfile组件,并执行js函数

前一篇我测试了vba调用htmlfile做反混淆,并执行js函数的代码.本文换成C#实现. 本文地址:http://www.cnblogs.com/Charltsing/p/CSharpEval.html 联系QQ:564955427 C#调用com组件需要使用CreateInstance,当然,我们也可以通过反编译vb.net里面的CreatObject来修改成C#代码.我从网上下载了一个 [SecurityPermission(SecurityAction.Demand, Unmanaged

ASP.NET后台调用前台JS函数的三种常见方法

第一种:使用普通的添加控件中的Attributes属性进行调用 例如,像一般的普通的按钮:Button1.Attributes.Add("onclick","MyFun();"); 此方法只能在Onload中或者类似于onload的初始化过程中添加才有效.并且是先执行脚本函数,同时无法改变执行顺序. 第二种:使用Response.Write方法进行调用 例如,像我们经常会使用到的Response.Write("<scripttype='text/ja