Code performance and difference between function and Named function expression in Java Script

Question

Sometimes it happens that there are 50k + lines in the code and they should be optimized to make it work faster. Here I have such a question about functions. We know difference between:

function f () {
  //code here
}

and

var f = function () {
  //code here
}

first is instant declared when code loads and second is declared in the process of going through the code. It means that:

f();
var f = function () {
  //code here
}

this will throw an error. However:

f();
function f () {
  //code here
}

this will work fine.

My question is this. Is there any fundamental difference between those two declarations. Can it affect the performance of such big projects where code lines are above 50k?

This is not really a question for Stackoverflow - you could do some matching and tests yourself on something like https://jsperf.com/ — StudioTime, Sep 06 '18 at 06:08
Simple googling will indeed answer that question, even on SO: [Javascript: performance of var functionName = function() {} vs function functionName() {}](https://stackoverflow.com/questions/4751178/javascript-performance-of-var-functionname-function-vs-function-function). For a real deep dive: [var functionName = function() {} vs function functionName() {}](https://stackoverflow.com/questions/336859/var-functionname-function-vs-function-functionname?rq=1) — Malte Hartwig, Sep 06 '18 at 06:12

score 1 · Answer 1 · answered Sep 06 '18 at 06:14

1

actually there is some difference http://jsben.ch/SqczP

Branch with variable-based declaration demonstrates 11% better performance.

But actual answer to your question: no, it will not until you decide to declare functions in large loop. and even then you have stop doing such a structure instead of optimizing declaration

answered Sep 06 '18 at 06:14

skyboyer

22,209
7
57
64

So you mean that declaration does not affect any performance? – KoboldMines Sep 06 '18 at 06:17
1

Just like any variable, a function expression will only be executed when needed. – kamp Sep 06 '18 at 06:19
@KoboldMines rather I'm sure in case it affects performance you need to refactor all the code not just declaration itself – skyboyer Sep 06 '18 at 07:05

score 0 · Answer 2 · answered Sep 06 '18 at 06:18

Function declarations in JavaScript are hoisted to the top of the enclosing function or global scope. You can use the function before you declared it:

Function declarations load before any code is executed.

hoisted(); // logs "foo"

function hoisted() { console.log('foo'); }

AND

Note that function expressions are not hoisted (you cannot call before):

Function expressions load only when the interpreter reaches that line of code.

notHoisted(); // TypeError: notHoisted is not a function

var notHoisted = function () { console.log('bar'); };

score 0 · Answer 3 · answered Sep 06 '18 at 06:21

0

f();
var f = function () {
  //code here
}

This won't work because the declaration if hoisted but the assignment isn't, it actually runs like this

var f;
f();
f = function () {
  //code here
}

answered Sep 06 '18 at 06:21

Chris Li

2,628
1
8
23

Code performance and difference between function and Named function expression in Java Script

3 Answers3