Javascript基础三（函数）

函数第一节：

1.函数的概念及作用

　函数是由事件驱动的或者当他被调用时可执行的可重复使用的代码块。

　　具备一点功能的代码段，代码段来实现具体的功能。要想实现一个函数的功能需要对函数进行调用。每写完一个函数就需要在使用时进行调用

2.函数的好处

重复使用忽略细节选择执行

3.函数的定义

通过关键字function声明，

function fn(){}

其中：

function－－－为声明函数的关键字，指出这是一个函数

fn －－－－－－是函数的名称，类似于永来存储函数的变量

() －－－－－－为函数的参数，多个参数用 , 隔开

{} －－－－－－放置函数体，用于执行时，所要编译的代码段

4.函数的调用

fn(); －－－－函数名＋()

注意：千万不能丢掉括号；可先尝试理解fn()()()()

5.事件的概念种类和作用

是一种可以被js侦测到的行为

在JS中常见的事件有：

鼠标点击－－－－－－－－onclick

鼠标双击－－－－－－－－ondblclick

页面或图片加载－－－－－onload

鼠标移入－－－－－－－－onmouseover

鼠标离开－－－－－－－－onmouseout

元素获得焦点－－－－－－onfocus

元素失去焦点－－－－－－onblur

键盘事件

……

主要用于和用户产生一定的交互，提高页面或程序的交互性。

事件和函数之间的关系

当触发事件的时候，执行函数

事件－－－－调用－－－－函数

6.参数的声明和传递

函数的参数分为：形参和实参；

   function fn(a){          //a为形参
       console.log(a);      //打印出123
   }
   fn(123);                 //123为实参

写在函数体内的参数称为形参，相当于该函数的某个变量，只不过不用var声明；需要遵循变量的命名方式。

调用时传递的参数为实参，相当于给变量赋值，可以传递所有数据

函数第二节：

1.函数的两种创建方式：声明式和赋值式

通过关键字function声明：

function fn(){}

通过变量赋值（未命名函数）：

var fn = function(){};

这种方式下，虽然这个函数没有名字，但是这个函数赋值给了fn，因此通过变量fn也能调用到这个函数

以上两种声明方式等价

都可以使用函数名/变量名＋() 调用执行

2.形参和实参

形参和实参都可以有多个，用逗号隔开，多个形参和实参之间必须相互一一对应

   function fn(a,b,c){            //a = 1, b = 2, c = 3
       console.log(a+b+c);        //6
   }
   fn(1,2,3);

如果形参和实参不一致：

形参的数量比实参的数量多，多出来的形参，为undefined；

形参的数量比实参的数量少，多出来的实参，传递到arguments对象中；

形参的数量与实参的数量相等，一一对应。

3.return关键字

   alert(parseInt(123.456));            //弹出123
 
   function fn(a,b,c){
       console.log(a+b+c);
   }
   alert(fn(1,2,3));                    //弹出undefined

因为fn()函数没有返回值，只要没有返回值的函数，都返回一个undefined

可通过关键字return返回函数的值。

return的作用：1.返回值；2.终止程序

   function fn(a,b,c){
       console.log(a+b+c);
       return a+b+c;
   }
   alert(fn(1,2,3));                    //弹出6

什么是返回值？

将函数处理后的数据，返回到执行语句上，便于其他程序或用户调用或做二次使用

如果有return，此时fn(1,2,3)==return的返回值

如果没有return，此时fn(1,2,3)==undefined

return中止程序之后，return下面的代码不会执行

不一定所有函数都要有返回值，只有需要返回数据的函数才加return

return可以返回任何值，包含函数，当返回函数时，如果需要执行返回的函数，可将返回值当成一个函数名，加上一个()即可执行；

如fn(2)(3)(4);

4.arguments对象

如果形参和实参不一致：

形参的数量比实参的数量多，多出来的形参，为undefined；

形参的数量比实参的数量少，多出来的实参，传递到arguments对象中；

形参的数量与实参的数量相等，一一对应。

在函数中，形参和实参的个数，可以为任意个，甚至数量不对应，程序都不会报错，但是在计算过程中可能会出现NaN，如：

   function fn(a,b,c){
       return a+b+c;
   }
   alert(fn(1,2));    //弹出NaN

这是因为在JS中，参数在函数内部是以一个数组表示的，函数接受的永远是一个数组。

我们可以通过arguments对象来访问这个参数数组，从而获取传递给函数的每个参数。

在arguments身上有许多属性，如

arguments.length为数组的长度－－－－当前传进来几个参数

函数第三节：

1.作用域

什么是作用域，变量在函数内部作用的范围／区域。有函数的地方就有作用域

2.局部作用域和全局作用域

    function fn(){
        var a = 1;
    }
    console.log(a);    //报错：a is not defined

用var声明的变量，实际上是有作用域的

在函数内部定义的变量，该变量的作用域是整个函数体，在函数体外不可引用该变量，这是局部作用域

变量的生命周期：

1.永远存在－－－－全局

程序没关，一直占用内存，少用全局

2.朝生暮死－－－－局部

函数的大括号开头到函数的大括号结尾

    var a = 1;
    function fn(){
        console.log(a);    //1
    }
    console.log(a);    //1

不在任何函数内定义的变量就具有全局作用域。全局变量在任何地方都能调用。

　利用匿名函数生成一个局部作用，把变量的声明和使用这个变量的小函数都放在匿名函数中

扩展：javascript默认有个全局对象window，全局作用域的变量实际上被绑定到window的一个属性

　3.声明提升

　　变量声明提升：

     console.log(a)     //undefined已经声明但是未赋值
     var  a = 2;
     console.log(a)     //2
 
     consoleo.log(b)     //not a defined未声明
    
 
    function fn(){
        console.log(a)    //undefined
        var a = 1;
    }
    fn();

在函数fn()中，在没有定义变量之前打印a，得到undefined，而并不是not defined

说明此时变量已经被声明，只是还没有被赋值。

上面的fn()函数可以理解成

    function fn(){
        var a;
        console.log(a);
        a = 1;
    }
    fn();

我们称这种现象为变量的声明提升，所有使用var声明的变量会在当前作用域最开始的部分被声明。

函数的声明提升：整体提升

    fn();        //2
    function fn(){
        console.log(2);
    }
    fn();        //2

    console.log(fn);     //undefined
    fn();                //not a function
    var fn = function(){
        console.log(1);
    }

　　JS的编译和执行

　　先检查语法错误－－－语法错误，当前代码段不执行

　　声明提升－－－－－－变量提升和函数提升，作用域内所有使用var声明的变量和非匿名函数

　　开始编译－－－－－－逐行执行

函数声明提升：

   fn();                    //1
    function fn(){
        console.log(123);
    }

但是：

    fn();                    //报错：fn is not a function
    var fn = function(){
        console.log(123);
    }

以上写法等于：

    var fn;                  //此时声明变量fn，未定型和存值
    fn();                    //所以此时的fn不是一个函数，不能使用执行函数的方式执行，强行执行会报错
    fn = function(){         //此时才对fn赋值函数
        console.log(123);
    }
    fn();                    //这时就可以执行了

4.递归函数

什么是递归？

就是在函数体内调用本函数。是一种调用模式，是一种逻辑程序基础的体现。

递归会消耗大量内存，在实际开发中很少使用

注意：递归最重要的是终止条件。

函数第四节：

1.利用事件触发函数执行？