JS里声明函数有几种方式？

JavaScript020

JS里声明函数有几种方式？,第1张

JS函数的定义方式比较灵活，它不同于其他的语言，每个函数都是作为一个对象被维护和运行的。

先看几种常用的定义方式：

function func1([参数]){

/*函数体*/

}

var func2=function([参数]){

/*函数体*/

}

var func3=function func4([参数]){

/*函数体*/

}

var func5=new Function()

上述第一种方式是最常用的方式，不用多说。

第二种是将一匿名函数赋给一个变量，调用方法：func2([函数])

第三种是将func4赋给变量func3，调用方法：func3([函数])或func4([函数])

第四种是声明func5为一个对象。

再看看它们的区别：

function func(){

//函数体

}

//等价于

var func=function(){

//函数体

}

但同样是定义函数，在用法上有一定的区别。

<script>

//这样是正确的

func(1)

function func(a)

{

alert(a)

}

</script>

<script>

//这样是错误的，会提示func未定义，主要是在调用func之前没有定义

func(1)

var func = function(a)

{

alert(a)

}

//这样是正确的，在调用func之前有定义

var func = function(a)

{

alert(a)

}

func(1)

</script>

用同样的方法可以去理解第三种定义方式。

第四种定义方式也是需要声明对象后才可以引用。

上述两种方式除了定义的语法不同之外，最主要的区别是函数声明具有【函数声明提升】的特点，将函数声明提升到作用域顶端，意思是在执行代码之前会先读取函数声明，也就是说可以把函数声明放在函数调用的后面。

例子1：

test()//弹出hello，因为【函数声明提升】的特点，函数调用之前，已经读取了该函数完成了声明

            function test(){

                alert("hello")

            }

例子2：

 test()//报错：Uncaught ReferenceError: test is not defined

            //因为【函数表达式】不具备提升的特点，在函数调用时，作用域中还未读取该函数的定义

            //作用域读取函数表达式是按照代码顺序读取

            var test = function(){

                alert("hello")

            }

            test()//弹出hello

例子3：

            if(condition){

                function test(){

                    alert("hello")

                }

            }else{

                function test(){

                    alert("world")

                }

            }

            //弹出world，因为函数声明在代码执行前就已经完成了，作用域已经完成了对该函数的读取，与条件无关

            //同名函数声明，后面的会覆盖前面的

            test()

            if(condition){

                var test2 = function(){

                    alert("hello")

                }

            }else{

                var test2 = function(){

                    alert("world")

                }

            }

            //弹出内容与条件相关，作用域读取函数表达式是按照代码执行顺序读取的

            test2()

例子4：

 //函数表达式

            var  test = function(){

                alert("hello")

            }

            //第一次调用

            test()

            //变量声明

            var s = "world"

            //函数声明

            function test(){

                alert(s)

            }

            //第二次调用

            test()

        //解释：两次调用都将弹出hello，在代码执行前方式二已经被作用域读取，然后执行方式一代码，方式一的test覆盖方式二的test，然后执行两次调用弹出hello