好程序员web前端学习路线分享函数基础

好程序员web前端学习路线分享函数基础，在这之前先来讲一下函数是什么？

函数就一个代码块，可以是一个完全独立与其它内容没有关系的代码块，也可以是一个与外界环境紧密相关的代码块。函数是一个拥有输入和输出的独立代码块。函数是程序中最重要的组成部分。

函数，是一种封装（将一些语句，封装到函数里面）。通过函数可以封装任意多条语句，而且可以在任何地方、任何时候调用执行。

在javascript里，函数即对象，程序可以随意操控它们。函数可以嵌套在其他函数中定义，这样它们就可以访问它们被定义时所处的作用域中的任何变量，它给javascript带来了非常强劲的编程能力。

函数的功能、好处：

1） 将会被大量重复的语句写在函数里面，这样以后需要这些语句的时候，直接调用函数，不用重写那些语句。

2） 简化编程，让编程变的模块化。

函数的声明

函数有三种声明的方法，而且有各自不同的特点。

1、普通函数声明

函数关键字 + 函数名 + (){

                        语句

                        函数体

        }   

例如:

               

function functionName(){

    alert("程序员的摇篮");

   // ...语句//

}

注：1.函数命名跟变量一样，只能是字母、数字、下划线、美元符号，不能以数字开头。

2.后边（）里放参数用的

函数名的规范：

1、普通的函数使用，名称需要驼峰式命名法，即函数是多个词组构成时，第一个单词的首字母小写，其余的单词首字母大写。函数名不能与关键词和保留字重复，不能与变量名重复。

2、类的构造函数，是驼峰式命名，但是第一个单词首字母需要大写。

2、匿名函数声明

var  变量名称 = function (){

      函数内容

}

var funName=function () {

    //函数内容

};

定义一个匿名函数，所谓匿名函数就是没有函数名。但是匿名函数定义后如果不保存在一个变量中，就找不到了，因此，我们通常会用一个变量接收这个匿名函数。

匿名函数尾部结束时需要用;来结束，普通的函数结束后不用;结束的。

var funName=function abc() {

    //函数内容

    console.log(abc);

}

匿名函数也是可以定义函数名称的，只不过比的地方不能使用，只能在函数内部使用。

3、Function构造函数声明

使用Function构造函数

var box=new Function('num1','num2','retun num1+num2');//num1,num2参数

  num1,num2参数， 最后的字符串是函数体

注意：第三种方式我们不推荐，因为这种语法会导致解析两次代码（第一次解析常规JS代码，第二次是解析传入构造函数中的字符串），从而影响性能，但我们可以通过这种语法来理解函数是对象，函数名是指针的概念。

函数的存储

JavaScript程序是一种解释性语言。那么什么时候解释性语言呢。

计算机其实并不认识程序，不管是什么代码计算机都不认识，因为计算机只是机器，如果我们需要让计算机认识程序，那么就需要一个翻译，就是把程序代码变成计算机可以理解的语言：0和1的信息序列。目前存在两种翻译类型：一个是编译，一个是解释。两种方式都需要对代码进行翻译，只是翻译的时间不同而已。

编译型语言在计算机运行代码前，先把代码翻译成计算机可以理解的文件，这种文件计算机就能看懂了，但是不管是程序员还是其他人员都看不懂的。并且这种代码，计算机可以执行了，但是每次我们需要修改代码时都需要修改源代码，然后再进行编译新的文件才可以使用，也就是不能再编译好的文件上修改。这种代码的优势是运行速度快，在执行前就知道代码是否错误，因为编译时就做了判断。

解释型语言则不同，解释型语言的程序不需要在运行前编译，在运行程序的时候才翻译，专门的解释器负责在每个语句执行的时候解释程序代码。这样解释型语言每执行一次就要翻译一次，效率比较低。而且执行时才知道代码是否错误。

而JavaScript就是解释性语言。但是注意程序在运行的时候，解释器首先会收集所有的普通定义的函数，并且把他们存储在堆里，这时候才从头开始执行代码。

abc();

function abc() {

   

}

例如我们看到这里abc的执行在函数的上面，如果按照代码的执行顺序，应该先执行abc，再创造函数，那么显然就会报错。但是这样不会有问题。就是说明，函数首先会被收集在堆里，不管在哪里调用，都是调用堆里的函数，因此普通定义的函数执行时可以写在前面或者写在后面。

但是注意如果我们使用匿名函数这种情况就不同了。虽然我们会收集匿名函数在堆里，但是如果找到它时，我们就需要在把它赋给一个变量以后才可以执行，否则就会报错。

abc();

var abc=function () {

   

}

这是错误的。

例如上面这种就是错误的。

函数的参数

参数是指由外部传入到函数中的变量，仅作为变量使用，但是该变量可以是任何内容，包括函数。

被传入的参数作为局部变量使用，可以被覆盖掉。

参数就是一个局部变量，通过外界传入值，这个参数就是对应的值。参数是按照顺序填入的。参数在JavaScript中不要求写入参数的类型和默认值，如果需要默认值，就需要在函数中，根据条件判断增加默认的值。有时候我们可以不用定义参数，直接在函数调用时，带入参数，也可以获取到。（不建议大家使用）

为什么要从外部带入参数。一般来说函数是独立处理某段代码的集合，如果，这段代码需要重复执行，就会设计出函数，在不同的地方调用，达到代码共用的目的，减少代码量。但是在某些时候，虽然是同样的代码，但是我们需要它发挥出的作用更大，可以解决不同的问题，这时候，传入的参数就可以起到代码干预作用，在同一个函数中解决了很多不同的问题。这时候设计函数的独立性就显得非常重要了。当然，任何事情解决都不是绝对的，过度设计复杂的函数有时候反到会让代码效率降低。

        同时，外部传入的参数可以节省全局变量的定义，甚至保证函数中的部分变量的独立性。

参数分为实参和形参。

实参：真实的数值、字符串

形参：一个接收实参的变量

例如这里是通过一个函数中的参数来控制在页面上添加多少个li

var m=5;

createUl(m);

function createUl(n) {

    if(n<1 || isNaN(n)) n=1;

    var ul="<ul>";

    for(var i=0;i<n;i++){

        ul+="<li>列表"+(i+1)+"</li>";

    }

    ul+="</ul>";

    document.write(ul);

}

函数的返回值

return 语句会终止函数的执行并返回函数的值。return 是javascript里函数返回值的关键字，一个函数内处理的结果可以使用return 返回，这样在调用函数的地方就可以用变量接收返回结果。return 关键字内任何类型的变量数据或表达式都可以进行返回，甚至什么都不返回也可以

abc(3,5);

function abc(a,b){

   return a+b;

}

注意return只能返回一个值，如果需要返回多个数据时可以考虑数组或者对象，例如

function abc() {

    return {a:1,b:2};

}

return 也可以作为阻止后续代码执行的语句被使用，例如

var bool=false;

var i=0;

function abc(){

    if(bool) return;

    i++;

}

这样可以有效的控制语句在一定的条件下执行，不过一定要与break区分，break是用在条件当中，跳出的也仅仅是条件和循环，但是return 却可以跳出函数，仅仅是针对函数使用，如果没有函数是不能使用return的。

abc();

function abc() {

    for(var i=0;i<10;i++){

        if(i===3){

            // break;

            return;

        }

    }

    i+=5;

    console.log(i);//i=8

}例如上面的例子，如果使用break，就会打印i的值是8，如果使用return，就不会打印了，因为return直接跳出了函数。

函数的执行

函数的执行分为两种

1、普通函数执行

函数执行 ：函数名()

执行后，可以完成函数的代码内容，如果函数内有return 值，这时候执行后会返回该值。

function abc() {

    return 3+4;

}

var s=abc();

如何没有return，则执行完所有代码

2、函数独立执行

函数自身是可以独立执行的，并且也可以把独立执行的结果赋值给一个变量。

var s=0;

(function(){

    s=4+5

})();

左边是匿名函数自己执行，右边是匿名函数赋值

注意匿名函数用小括号括住，最后再执行小括号。

注意，除了匿名函数可以独立执行，实名函数也是可以独立执行的，不过这种独立执行就不能在该函数中添加参数了，并且匿名函数，也只能在此执行一次，不能多次调用，显而易见的好处是，该函数内的变量统统是私有变量，有关该部分内容我们在后面详细说明

函数的删除

当函数不在使用时，就需要删除，函数也是对象，如果不删除，它将常驻内存中，如果该函数不再使用就可以使用删除彻底清除掉该函数。但是只有函数是匿名定义的或者通过构造函数创建的才可以被删除。

函数删除分两种

1、匿名函数删除

函数=null

2、对象下函数删除

delete obj.fun