Line break within arrow function throws “Uncaught SyntaxError: Unexpected token `=>`”

Question

I’m getting the error “Uncaught SyntaxError: Unexpected token =>” on my console when I put the e parameter in parentheses and then use an E

Answer 1

First of all, your function call and function declarations are not closed. Secondly, the arrow cannot be on its line alone.

//Event: add book
document.querySelector("#book-form").addEventListener("submit", (e) => {
  //prevent default
  e.preventDefault();
  // get form value
  const title = document.querySelector("#title").value;
  const author = document.querySelector("#author").value;
  const isbn = document.querySelector("#isbn").value;
//Close function body, then function call.
});

Answer 2

Arrow functions cannot have a newline between the parameters and the =>:

14.2 Arrow Function Definitions

ArrowFunction[In, Yield, Await]:

• ArrowParameters [?Yield, ?Await] [no LineTerminator here] => ConciseBody

Either remove the newline, or put it somewhere else. You could also use a named function instead, eg:

const submitHandler = (e) => {
  // ...
};
document.querySelector("#book-form").addEventListener("submit", submitHandler);