日期:2014-05-16  浏览次数:20463 次

JavaScript 的声明函数和匿名函数的区别

?????? 今天在公司没有太多任务,就把前几天挤压下来的问题一一解决了一下。突然发现javascript的函数直接的区别没有搞清楚。这里懒得翻译了,就直接把英文代码粘来了。

?

Javascript function declarations vs function operators

? ? ? There are quite a few different ways to create a new function in javascript, but the two most common are using a function declaration or using the function operator.

????? This function is created using a function declaration:

?

    function destroyDeathStar() {
        alert("Stay on target, stay on target");
    }

?? This function is created using the function operator:

?

?

    var destroyDeathStar = function() {
        alert("Stay on target, stay on target");
    }
    destroyDeathStar();

?

?

??? The biggest difference between using a function declaration or a function operator is when the function is created. Functions made with a function declaration are moved to the top of the code and created before the rest of the function is run. Functions made with the function operator are created at runtime where they are in the javascript code.

Function declarations

Function declarations are the javascript 101 way to create a new function:

?

    function destroyDeathStar() {
        alert("Stay on target, stay on target");
    }
     
    destroyDeathStar();

?When you use a function declaration, the function object will be created as the javascript is parsed, before the code is run. This is why you can call a function created with the function statement before it is declared:

?

?

    destroyDeathStar();
     
    function destroyDeathStar() {
        alert("Stay on target, stay on target");
    }

?This works because the javascript interpreter does something called hoisting when it is loading a new program or creating a new function object. It looks for any function declarations in the current scope and moves them to the beginning of the code. This is why you can call a function created by a function declaration before it is declared in the code.

?

So if you wrote some code that looks like this:

?

    destroyDeathStar();
         
    function destroyDeathStar() {
        alert("Stay on target, stay on target");
    }

?It would end up being executed like this:

?

?

    var destroyDeathStar = function destroyDeathStar() {
        alert("Stay on target, stay on target");
    }
    destroyDeathStar();

?The function declaration syntax also automatically adds the new function object to the current scope. It creates a variable with the same name as the function which points to the newly created function object.

?

Because of this, all functions created with the function declaration must be given a name. They can not be anonymous functions. If the function did not have a name, it would not be possible to add it to the current scope and you would not be able to call it.

The function operator

If you’ve done any work with jquery, you’ve probably seen a function declared with the function operator:

?

    var destroyDeathStar = function() {
        alert("Stay on target, stay on target!");
    }
    destroyDeathStar();

?The biggest difference between a function operator and a function declaration is when the function is created. Function operators aren’t affected by hoisting so they are evaluated where they occur in the source code as the code is run.

?

This is very useful because function creation can be affected by the su