Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

function declaration faster than function expression?

The difference b/w function declaration & function expression is beautifully described in var functionName = function() {} vs function functionName() {}
In this it's mentioned that function declaration is evaluated during parse-time, & function expression is evaluated in the execution-phase

In bytes.com it's mentioned that function declaration is faster than function expression.

I created a basic test case for this: http://jsperf.com/function-declaration-vs-function-expression

Function Declaration:

function myfunc() {
 alert("yo");
}
myfunc();

Function Expression:

var myfunc = function() {
 alert("yo");
}
myfunc();

The test showed that function expression is 90% slower than function declaration.

Why such a difference in speed?

Edit:
From the results in http://jsperf.com/function-declaration-vs-function-expression

In Chrome, IE9, Opera & Safari -> Function Declaration is faster than Function Expression

In Firefox, IE7, IE8 -> Function Expression is faster than Function Declaration

In IE9 Function declaration is faster, whereas in IE 7 & 8 function expression is faster. Is it because of change in JavaScript engine in IE9, or was this move intentional?

like image 329
Anish Avatar asked Mar 25 '11 14:03

Anish


People also ask

Which is better function declaration or function expression?

The main difference between a function expression and a function declaration is the function name, which can be omitted in function expressions to create anonymous functions. A function expression can be used as an IIFE (Immediately Invoked Function Expression) which runs as soon as it is defined.

What is the difference between function declaration and function?

A function declaration tells the compiler about a function's name, return type, and parameters. A function definition provides the actual body of the function.

What is difference between function declaration and function definition in JavaScript?

The function in function declaration can be accessed before and after the function definition. The function in function declaration can be accessed only after the function definition. 5. Function declarations are hoisted. Function expressions are not hoisted.

Why would you use a function expression?

Use a function expression when:you need a more flexible function. you need a function that isn't hoisted. the function should only used when it is defined. the function is anonymous, or doesn't need a name for later use.


1 Answers

Firefox also has non-standard Function Statements, which makes it possible to conditionally choose between function declarations (per spec, you can't). Just using an example of Juriy "kangax" Zaytsev:

if (true) {
    function foo(){ return 1; }
} else {
    function foo(){ return 2; }
}
foo(); // 1
// Note that other clients interpet `foo` as function declaration here, 
// overwriting first `foo` with the second one, and producing "2", not "1" as a result

So those are compiled at execution time, instead of in the parse-phase:

Function statements are NOT declared during variable instantiation. They are declared at run time, just like function expressions.

Other browsers probably will pre-compile function declarations, making them perform faster at run time, but Firefox has to interpret function declarations at run time, causing not much difference between the speed of function declarations and function expressions in Gecko-based browsers.

like image 68
Marcel Korpel Avatar answered Oct 03 '22 23:10

Marcel Korpel