Transforming an arrow function into a traditional function: What's the process?

Question

Transforming an arrow function into a traditional function: What's the process?

I am currently attempting to convert an arrow function into a regular function.

This is the code snippet I am working with:

let ratings = watchList.map( (item) => {"title": item["Title"], "rating": item["imdbRating"]} )

The goal is to rewrite it as follows:

let ratings = watchList.map(function (item) {
    "title": item["Title"], "rating": item["imdbRating"]
})

Although initially I thought these two versions were equivalent, I encountered the following error message:

SyntaxError: unknown: Unexpected token, expected

javascript arrays arrow-functions

Answer 1

Answer №1

Your code is missing the return statement. When you provide a custom function for the Array.map method, remember to include a return statement in that function.

let rating = watchList.map(function(item) {
  return {"title":item["Title"], "rating":item["imdbRating"]};
})

Instead of traditional functions, arrow functions are preferred as they are more concise and allow you to access this within them.

Answer 2

Your code is missing the return statement. When you provide a custom function for the Array.map method, remember to include a return statement in that function.

let rating = watchList.map(function(item) {
  return {"title":item["Title"], "rating":item["imdbRating"]};
})

Instead of traditional functions, arrow functions are preferred as they are more concise and allow you to access this within them.

Answer 3

Answer №2

Arrow functions automatically return any expression after the =>.

In standard functions, you must use the return keyword and wrap your properties in {}.

let rating = watchList.map(function(item){
    return {"title":item["Title"], "rating":item["imdbRating"]};    
}

You can also simplify your code using Parameter destructuring.

let rating = watchList.map(function({Title:title,imdbRating:rating}){
    return {"title":Title, "rating":imdbRating};    
}

Alternatively, you can name the properties during destructuring.

let rating = watchList.map(function({Title:title,imdbRating:rating}){
    return {title,rating};  
}

Answer 4

Arrow functions automatically return any expression after the =>.

In standard functions, you must use the return keyword and wrap your properties in {}.

let rating = watchList.map(function(item){
    return {"title":item["Title"], "rating":item["imdbRating"]};    
}

You can also simplify your code using Parameter destructuring.

let rating = watchList.map(function({Title:title,imdbRating:rating}){
    return {"title":Title, "rating":imdbRating};    
}

Alternatively, you can name the properties during destructuring.

let rating = watchList.map(function({Title:title,imdbRating:rating}){
    return {title,rating};  
}

Answer 5

Answer №3

To achieve this, utilize the return statement along with the shorthand notation of objects when employing destructuring.

let rating = watchList.map(function({Title:title, imdbRating:rating}) {
  return {title,rating};
})

Answer 6

To achieve this, utilize the return statement along with the shorthand notation of objects when employing destructuring.

let rating = watchList.map(function({Title:title, imdbRating:rating}) {
  return {title,rating};
})

Transforming an arrow function into a traditional function: What's the process?

Answer №1

Answer №2

Answer №3

Similar questions

The meter.value update feature is functioning properly, however, it does not refresh the displayed "hover" value

Trouble with Saving Compare-Object Results to CSV

Modify the div's width from 100% to 1000 pixels when it is less than 1000 pixels, using Javascript

What is the best way to determine which DOM element triggered a click event?

The totalVowels count is stuck and not changing

What is the expected result of running this Javascript program with asynchronous tasks?

Utilizing an array of objects to import images

What is the best way to observe a function and provide a simulated result from within a different function using jasmine?

Utilizing JSON format for processing HTTP requests in JavaScript with Node.js

Is there a way to pass a c struct pointer into javascript using ffi?

Is there a way to stop a for-in loop within a nested forEach function in JavaScript?

Addressing the problem of refactoring in JavaScript when associating arguments with keys in MongoDB

Issue with import alias not functioning within route grouping in Nextjs

How can I modify the style of table rows with CSS?

NodeJS closes the previous server port before establishing a new server connection

Having trouble loading the image source using JSON in Vue.js

Angular 2 patiently checking for a function to provide a result before proceeding with the next function

populate the empty slots in an array with the correct numbers

'This' term within a CoffeeScript class

Is the 404 page being utilized as a fallback for AJAX requests?