CODEWITHSUNDEEP
javascriptecmascript-6
BrownBoii333
BrownBoii333

Reputation: 105

What's the point of function expressions, they seem useless

I'm sorry if this is a duplicate, I have read a few posts asking this question but I haven't found a satisfying answer. I am new to JS, I have worked with C and Java. I recently learned about function expressions which, as far as I understand it, are anonymous function declarations that are assigned to some const variable. I don't see what the motivation behind this is/what the possible use of this is/ how could this ever do something you couldn't just do with a function declaration. for example

const example = function (input){
   return 'Am I useless?:' + input;
}

console.log(example('Idk'));

Like this is just like calling a declared function with the same variable, but instead I'm using this variable name (example), which also makes the anonymous function seem pseudo anonymous since it does have a name it can be reference by.

I don't see when this would ever preferable over just a function declaration, yet the CodeCademy course I'm taking repeatedly uses the function expression thing, so I must be missing something.

I really appreciate the help/clarification.

Upvotes: 5

Views: 1734

Answers (2)

FZs
FZs

Reputation: 18619

TL;DR: No, function expressions aren't useless.

First of all, I would derive the function declarations from function expressions, not inversely. Function declarations are also useful, but they can be replaced by function expressions entirely.

The main difference: function declarations always create variables, while function expressions do not. However, you can still assign them to variables.

The following codes are identical (OK, not perfectly identical, they differ in their hoisting rules):

function foo(bar){
  return 'baz'
}

//Function declarations create variables like how `var` does
var foo = function foo(bar){
  return 'baz'
}

However, function expressions become handy when you don't want to store the function into a var⁠iable.

Examples include:

  • Constant functions:

    const foo = function foo(bar){
  return 'baz'
}

  • Block-scoped functions:

    {
  let foo = function foo(bar){
    return 'baz'
  }
}

  • IIFEs (Immediately Invoked Function Expressions):

    (function (bar){
  //Here we have an encapsulated local scope and the ability to return things
  return 'baz'
})('foo')

  • Callbacks:

    asyncFn(function (){
  console.log('Done!')
})

  • Storing in objects:

    foo[2].bar = function (){
  return 'baz'
}

  • Assigning to previously declared variables: 

    let foo = null
console.log(foo)
foo = function foo(bar){
  return 'baz'
}

And, although technically all of the above can be solved by using function declarations only, that would result in lots of unnecessary variables and harder-to-read code.

I don't exactly know why Code Academy prefers to use function expressions in your case, but I think that the point is in the const keyword, as it is:

  • Block-scoped
  • Constant
  • Restricts strange quirks that var (and function declarations) would allow
  • Hoisted with temporal dead zone (cannot be accessed before it is declared)

Upvotes: 3

Stuck
Stuck

Reputation: 12292

Functions are first-class objects in JavaScript. In your programming background from Java or C this is not true.

A use case for storing a "function" in a variable is to pass it somewhere else - e.g. as a callback. In Java you could compare it to a Runnable, but still it is a different concept.

Javascript is crazy if you come from a "proper" programming language! :) Watch that talk by Brian Leroux for some crazy fun.. https://www.youtube.com/watch?v=et8xNAc2ic8

Upvotes: -1

Related Questions