JS函数的语法及调用的关系

       函数调用和声明的关系：

       函数调用声明内的代码只有在遇到函数调用时才会被执行，反过来说函数调用会去执行函数声明内的代码。

一、函数声明

语法：

1：（普通函数 ES5）：function 函数名称 （）{功能代码}

function fn(){

    功能代码

}

2：（匿名函数 [没有名称的函数就做匿名函数]）：function () {功能代码}  

oBtn.onclick = function () {

    功能代码

}

3：（箭头函数也属于匿名函数的一种ES6写法 （推荐经常使用））：（） => {功能代码}

oBtn.onclick = () => {

    功能代码

}

4：（函数表达式）：const fn =（）=> {}; const fn = function() {}

二、函数调用

1：函数调用的语法： 函数名（参数） 

function fn() {  // 设计一个功能  弹出alert（200）

    alert(200);    

}


fn();  //函数调用 => alert(200)就会被执行

//如果是用函数表达式来创建fn函数

const fn = function () {

    alert(200)

}


//调用fn
fn();

//通过箭头函数创建的功能

const fn = () => {

    alert(200);

}


//箭头函数fn的调用

fn();

//如果通过对象来去调用，则调用的是方法

const oGm = {

    fn: function () {

        alert('安妮')

     },
    show: () => {

        console.log('小杨')

    }

}


    //调用fn方法 
    oGm.fn();

    //调用show方法
    oGm.show();

//数组里面写函数的写法

    let arr = [

        function() {

            alert('弾出第一个框')
        },
        () => {
            alert('弹出第二个框')
        }

    ]


    //调用第一个元素
    arr[0]
    //调用第二个元素
    arr[1]

//再来一个扩展性的写法，就是数组里面用对象，又该如何去调用它呢？


let arr = [{

    fn:function() {

        alert('fn很变态')

    },
    list:[{

        show:fnction() {

            alert('show更加变态')

        }

    }]

}]


    //调用第一个元素的fn方法
    arr[0].fn();

    //调用的show方法
    arr[0].list[0].show();