Dart programming language overview in Flutter - Practice Problems & Coding Challenges

Challenge - 5 Problems

📝 Syntax

intermediate

What is the output of this Dart code snippet?

Consider the following Dart code:

void main() {
  var list = [1, 2, 3];
  var doubled = list.map((x) => x * 2).toList();
  print(doubled);
}

What will be printed to the console?

Flutter

void main() {
  var list = [1, 2, 3];
  var doubled = list.map((x) => x * 2).toList();
  print(doubled);
}

A [2, 4, 6]

B [1, 2, 3]

C [1, 4, 9]

D Error: map is not a function

💡 Hint

The map function applies the given function to each element of the list.

The map function multiplies each element by 2, so the list [1, 2, 3] becomes [2, 4, 6].

❓ ui_behavior

intermediate

What happens when this Flutter widget is tapped?

Given this Flutter widget code:

GestureDetector(
  onTap: () {
    print('Tapped!');
  },
  child: Container(
    width: 100,
    height: 50,
    color: Colors.blue,
  ),
)

What will happen when the blue container is tapped?

Flutter

GestureDetector(
  onTap: () {
    print('Tapped!');
  },
  child: Container(
    width: 100,
    height: 50,
    color: Colors.blue,
  ),
)

A The console prints 'Tapped!' and the container color changes to red.

B Nothing happens because onTap is not set correctly.

C The console prints 'Tapped!' but the container color stays blue.

D The app crashes due to missing MaterialApp widget.

💡 Hint

onTap prints a message but does not change the UI by itself.

The onTap callback prints 'Tapped!' to the console. The container color remains blue because no state change occurs.

❓ lifecycle

advanced

Which method is called first in a StatefulWidget lifecycle?

In Flutter, when a StatefulWidget is inserted into the widget tree, which lifecycle method is called first in its State object?

A initState()

B build()

C didChangeDependencies()

D dispose()

💡 Hint

This method is called once when the State object is created.

initState() is called once when the State object is first created, before build().

❓ navigation

advanced

What is the result of this Flutter navigation code?

Given this Flutter code snippet:

Navigator.push(
  context,
  MaterialPageRoute(builder: (context) => SecondScreen()),
);
Navigator.pop(context);

What will happen after these two calls execute sequentially?

Flutter

Navigator.push(
  context,
  MaterialPageRoute(builder: (context) => SecondScreen()),
);
Navigator.pop(context);

A The app crashes due to calling pop immediately after push.

B The app navigates to SecondScreen and then immediately returns to the previous screen.

C The app stays on the current screen without navigation.

D The app navigates to SecondScreen and stays there.

💡 Hint

push adds a new screen, pop removes the current screen.

push navigates to SecondScreen, then pop immediately returns to the previous screen, so the user sees no lasting navigation change.

🔧 Debug

expert

What error does this Dart code produce?

Analyze this Dart code:

void main() {
  int? a = null;
  int b = a! + 5;
  print(b);
}

What error will this code cause at runtime?

Flutter

void main() {
  int? a = null;
  int b = a! + 5;
  print(b);
}

A No error; prints 5

B Syntax error: Unexpected token '!'

C Compile-time error: Cannot assign null to non-nullable int

D Runtime error: Null check operator used on a null value

💡 Hint

The ! operator asserts the value is not null at runtime.

Using ! on a null value causes a runtime exception: Null check operator used on a null value.