What is Difference Between () {} and () => {} In Flutter ?

Sometimes flutter shows examples for fat arrow and sometimes doesn’t. So in this article, we will walk through the Difference Between () {} and () => {} In Flutter.

What is Difference Between () {} and () => {} In Flutter ?

The fat arrow syntax is simply a shorthand for returning an expression and is similar to (){ return expression; }.

Visit the docs for more information.

Note: Only an expression—not a statement—can appear between the arrow (=>) and the semicolon (;). For example, you can’t put an if statement there, but you can use a conditional expression.

void main(){
    final cls = TestClass();
    cls.displayAnInt((){
       //you can create statements here and then return a value
       int num1 = 55;
       int num2 = 1;
       int sum = num1 + num2;
       return sum;
    });
   cls.displayAnInt(() => 55 + 1); // simply return an int expression
}
class TestClass{

    displayAnInt(makeIntFunc){

       int intValue = makeIntFunc();
       print('The int value is $intValue');
    }
}

From the code above, You can see that a multiline statement can be made when the callback function is used and then a value is returned. While the fat arrow simply has an expression with no return keyword.

However, considering your answer about fat arrows not supporting multiline statements in dart this is quite understandable. Since doing () => {somtheing} would imply you are returning a map and it would expect to see something like () => {‘name’:’John’, ‘age’:25} and not () => { _myTxt = “Text Changed”;_myTxt = “Never Mind”; }.

• => is used to return a value of an anonymous function.
• () {} lets you execute multiple statements while () => {myVar} or () => myVar; allows one single statement. () => myVar; is short and simple when returning one statement.

The same logic goes for creating non-anonymous functions too.

Single statement func func() => y = x + x;

Multiple statement func

func () {
   x = x + x; 
   print(x + ' value of x');
}

=> Shorthand expression is used to define a single expression in a function. Enough with the definition and properties.

• By using fat arrow => the curly brackets need to be removed. Otherwise, the code editor will show you an error.
• If a function has a return type then by using a Fat arrow it is required to remove the return keyword.

Below Both are the same function and will return the same value. Just a different syntax

This is with => type

var size = (int s) => s*2;

This is the return type

var size = (int s) { 
  return s*2; 
}

Conclusion:

Thanks for Reading !!!

In this article, we have been through how to run an app on multiple connected devices simultaneously in flutter.

Above all do let us know if you need any assistance with flutter development. We would love to assist you.

Flutter Agency is our portal Platform dedicated to Flutter Technology and Flutter Developers. The portal is full of cool resources from Flutter like Flutter Widget Guide, Flutter Projects, Code libs, etc.

Flutter Agency is one of the most popular online portals dedicated to Flutter Technology. Daily thousands of unique visitors come to this portal to enhance their knowledge of Flutter.

Written by Nirali Patel

Nirali Patel is a dedicated Flutter developer with over two years of experience, specializing in creating seamless mobile applications using Dart. With a passion for crafting user-centric solutions, Nirali combines technical proficiency with innovative thinking to push the boundaries of mobile app development.