Mujeeb Ahmed Profile picture
Software Engineer | 100+ AI & Tech tools reviewed | Simplifying AI, No-Code & Productivity | Top picks for Automation, Marketing & Coding

Jul 8, 2023, 15 tweets

JavaScript Arrow Functions 🔥

Explained🧵👇🏻

✦ Today, we're going to learn Arrow Functions in JavaScript.

✦ Arrow Functions are a concise way to write functions, introduced in ES6.

✦ They offer shorter syntax and lexically bind the 'this' value.

✦ Let's dive in!

✦ Basic Syntax:

➩ An Arrow Function is defined using the '=>' syntax.

➩ It's typically assigned to a variable.

✦ Here's an example with an Arrow Function :

✦ And here's the equivalent using a regular function:

✦ Simplifying further:

➩ If the function body has only one statement, the curly braces can be omitted.

➩ The statement is implicitly returned.

✦ Example with Arrow Function:

✦ And here's the equivalent using a regular function:

✦ Single parameter:

➩ When the function has only one parameter, parentheses around the parameter can be omitted.

✦ Example with Arrow Function:

✦ Equivalent using a regular function:

✦ Multiple parameters:

➩ For functions with multiple parameters, parentheses are required.

✦ Example with Arrow Function:

✦ Equivalent using a regular function:

✦ Returning a value:

➩ Arrow Functions can return a value using the 'return' keyword.

✦ Example with Arrow Function:

✦ Equivalent using a regular function:

✦ Lexical 'this' binding:

➩ Arrow Functions have lexical 'this' binding, which means they inherit the 'this' value from the surrounding scope.

✦ Example with Arrow Function:

✦ Equivalent using a regular function:

That's a wrap!

If you enjoyed this thread:

1. Follow me @mujeeb0147 for more of these
2. RT the tweet below to share this thread with your audience

Share this Scrolly Tale with your friends.

A Scrolly Tale is a new way to read Twitter threads with a more visually immersive experience.
Discover more beautiful Scrolly Tales like this.

Keep scrolling