-1

When creating functions, What is the main difference and when to use these ways of creating a function?

onSubmit = () => {}

functionsName : () => {}
T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
Samz
  • 76
  • 10
  • 4
    Both of those ways will cause syntax errors... – Nick Parsons Nov 05 '20 at 08:05
  • 1
    Are you sure `function : () => {}` is legal? – Hao Wu Nov 05 '20 at 08:05
  • In an object, yes `{ function: () => {} }` – Thum Choon Tat Nov 05 '20 at 08:07
  • You are probably asking about [class fields](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/Public_class_fields) vs properties inside object literals – adiga Nov 05 '20 at 08:07
  • @ThumChoonTat yes can you explain the difference? – Samz Nov 05 '20 at 08:09
  • That code is still invalid. You can't create a variable called `function` – adiga Nov 05 '20 at 08:10
  • There is no difference. Both are errors. – Quentin Nov 05 '20 at 08:10
  • @Samz you should change `function` to a valid identifier name (you're still going to face issues since `function` is a reserved keyword) – Nick Parsons Nov 05 '20 at 08:11
  • 2
    Please post your **actual code** where you found these two syntaxes. It's hard to tell without outer context. Are you using typescript by any chance? `:` could mean an object literal, a [label](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/label) or a Typescript type – adiga Nov 05 '20 at 08:12
  • 1
    @NickParsons Sorry about that it should be the function name . I have updated – Samz Nov 05 '20 at 08:13
  • 1
    Still throwing errors. – Quentin Nov 05 '20 at 08:13
  • 1
    Your latest edit doesn't solve the problem with the previous version of the question (the last code example still throws errors, you've just removed the live demo to make it harder to tell) but you've added a completely different question as the first example (which makes your question off-topic for a second reason ("Needs more focus")) (and it invalides the answer you've got because the first and second functions it talks about are now the second and third!) – Quentin Nov 05 '20 at 08:20
  • Edited again with the actual function names – Samz Nov 05 '20 at 08:20
  • 1
    It's also best not to edit question such that the answers they've already received no longer apply, by adding a new and different example, changing the order referred to in the answer(s), and changing one of the options to a completely different (and invalid) construct. – T.J. Crowder Nov 05 '20 at 08:28

1 Answers1

3

There's no difference in the creation of the functions, just what is done with the function once it's created:

  • Your onSubmit one creates a function and assigns it to an in-scope variable.
  • Your functionsName one creates a function and assigns it to an object property. This form is only valid within an object initializer. (Outside of an object initializer, it's not a syntax error, but it's just a labelled statement and the function is never assigned to anything.)

You may find another answer of mine useful as well. It's a rundown of various ways of creating functions.

T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
  • 1
    Yes thanks by function i mean the function name i have updated it. Thanks for the answer – Samz Nov 05 '20 at 08:11