JS基础(函数的简介)

一、函数的概念

JS中的函数：把一段需要重复使用的代码，用function语法包起来，方便重复调用，分块和简化代码。复杂一点的，也会加入封装、抽象、分类等思想。

二、函数的声明及调用

声明方式：严格意义上两种方式，但还有匿名函数。

• • 方式一

    function 方法名(){
         //要执行的代码
    }

  • 方式二：ES6中声明方式箭头函数，()=>{} 
  • 方式三：匿名函数，将函数存到变量里 var func = function(){};

函数调用：两种方式调用

• • 调用方式一：名字(); 函数可以多次调用

    //函数声明
    function fn(){
        console.log(1);
    }
     
    //函数的调用
    fn();

  • 调用方式二：在事件中调用，直接写函数名，不使用括号

    //函数声明
    function fn(){
        console.log(1);
    }
     
    //函数在事件中的调用
    document.onclick = fn;

     

三、函数表达式(匿名函数)

函数表达式：就是把函数存到变量里。

匿名函数：没有名字的函数；

匿名函数在使用时只有两种情况：

• • 匿名函数自执行：声明后不需要调用就直接执行

    (function(){
        console.log("匿名函数自执行");
    })();

  • 函数表达式：把函数存到变量，或将函数存到数组的对应位置里等，调用时通过变量或数组对应位置进行调用。调用时需要写括号。

    //2，函数表达式：把函数存到变量或数组等里，调用时通过变量进行调用
    var fn = function(){
        console.log("函数表达式：将函数存到变量里");
    };
    fn();//调用时需要写括号
     
    //2，函数表达式：把函数存到数组第0位，调用时通过数组第0位进行调用
    var arr = [];
    arr[0] = function(){
         console.log("函数表达式：将函数存到数组的对应位置");
    };
    arr[0]();//调用时需要写括号要写括号

结果：

匿名函数自执行

函数表达式：将函数存到变量里

函数表达式：将函数存到数组的对应位置

事件函数扩展：给元素添加事件的说法是不正确的。事件时元素本身就具有的特征，只是触发事件后，默认没有相关的一些处理。这种操作其实就是给元素的某个事件添加一个事件处理函数。当事件被触发后，判断到属于该事件类型，就触发该事件函数的处理函数。

可以通过console.log()把对象的所有属性和方法打印出来，查看对象或元素本身具有的事件。

<script>
       //事件时元素本身就具有的特征，只不过，触发事件后，默认没有相关的一些处理。事件函数其实就是给元素的某个时间添加一个事件处理函数。
       //可以通过console.dir()把对象的所有属性和方法打印出来
       document.onclick = function(){
           console.log("事件的处理函数");
       };
       //当被触发后，判断到属于该事件类型，就触发该事件函数的处理函数
       if(typeof document.onclick == "function"){
         document.onclick();
       }
</script>

结果：事件的处理函数