Glancing essential features of Dart, before stepping into Flutter

Kuala Lumpur
Wonyoung Choi
Lead Mobile Developer, OCBC Bank
Speaker Image
Placeholder
Glancing essential features
of Dart, before stepping
into Flutter

“Flutter is an open source framework by
Google for building beautiful, natively
compiled, multi-platform applications
from a single codebase.”

“But, This is not about Flutter.”

● Basic Syntax
● Object-Oriented Programming
● Functional Programming
● Asynchronous Programming

Variable / Constant
● int / double / String / bool
● Nullable / Non-nullable
● var - type inferring
dynamic - works like ‘Any’
● const - compile time
final - runtime
int attendees = 300;
double ticketPrice = 30.0;
String gdgChapter = "Kuala Lumpur”;
bool isHappy = true;

Variable / Constant
final - runtime
double? rotiTelur = null;
rotiTelur ??= 3.5;

Variable / Constant
final - runtime
var speakerName = "Toru";
speakerName = “Jecelyn";
dynamic month = "Dec";
month = 12;

Variable / Constant
final - runtime
final int year = 2022;
const String google = "Google";
final nextYear = 2023;
const myPhone = "Google Pixel 7 Pro";

Data Structures
● List: a basic collection like array
● Map: key-value pair
● Set: another basic collection, but not
allowing duplicated elements
List<String> btsMembers = [
"Jin",
"Suga",
"J-Hope",
"RM",
"Jimin",
"V",
"Jungkook"
];
btsMembers.add("Toru");
btsMembers.remove(“Toru");

Data Structures
Map<String, String> idols = {
"JYP": "TWICE",
“HYBE": "BTS",
"YG": "BLACKPINK"
};
idols["Starship"] = "IVE";
// What will happen?
print(idols["GDG"]);

Data Structures
final Set<String> blackPink = {
"Jisoo",
"Jennie",
"Rose",
"Lisa"
};
blackPink.add("Jisoo");
// What will happen?
print(blackPink);

Loop and condition
● if-else
● for loop
● while loop & do-while
● switch - with enum / given value

Method in Dart
● Return Type + Method name + Parameters
● named parameters with {}
● required keyword in parameters with {}
● optional parameters with []

Method in Dart
● Return Type + Method name + Parameters
● named parameters with {}
● required keyword in parameters with {}
● optional parameters with []
ReturnType methodName(ParameterType name) {
// Do whatever you want
}

Left Aligned Title
String namedParameter({
String first = "", String second = "", String third = ""
}) {
return "$first, $second, $third";
}
namedParameter(first: “Toru", second: “Android", third: "SG");

Left Aligned Title
String requiredParameter({
required String? first, required String? second
}) => "$first, $second";
To be nullable or with default value

String neitherRequiredAndNamed(
String first, String second
) => "$first, $second”;
neitherRequiredAndNamed("first", "second");

optionalParameter(String first, [String? second]) =>
"$first, $second”;
optionalParameter("first");
To be nullable or with default value

Class
● Constructor
● Private class
● Getter / Setter - additional properties
● Inheritance
● Abstract class / interface
class Employee {
String employeeName;
String employeeAddr;
// default constructor
Employee(
this.employeeName,
this.employeeAddr
);
// named constructor
Employee.initialize({
String? name, String? addr
}): employeeName = name ?? "",
employeeAddr = addr ?? "" {
// Do something
}
}

Class
● Constructor
● Private class
● Inheritance
class ImmutableEmployee {
final String employeeName;
final String employeeAddr;
// constant constructor,
// it means an immutable object will be created
const ImmutableEmployee(
this.employeeName,
this.employeeAddr
);
}
ImmutableEmployee ie =
const ImmutableEmployee(
"Toru", “Kuala Lumpur”
);

Class
class _GDGChapter {
final String chapterName;
final List<String> chapterMembers;
String country;
_GDGChapter(
this.chapterName,
this.chapterMembers,
this.country
);
}
● Constructor
● Private class
● Inheritance

Class
// getter
String get firstMember {
return chapterMembers[0];
}
// setter
set countryName(String countryName) => {
country = countryName;
print(country);
}
var gdgkl = _GDGChapter(...);
gdgkl.firstMember;
gdgkl.countryName = "Malaysia";
● Constructor
● Private class
● Inheritance

Class
class Idol {
String name;
int count;
Idol({
required this.name,
required this.count
});
void sayName() {
print('We are $name.');
}
void sayMembersCount() {
print('$name has $count members!');
}
}
● Constructor
● Private class
● Inheritance

Class
class BoyGroup extends Idol {
BoyGroup(
String name,
int count,
): super(
name: name,
count: count
);
sayBoyGroup() {
print('We are a boygroup!');
}
}
class GirlGroup extends Idol {
GirlGroup(
String name,
int count,
) : super(
name: name,
count: count
);
sayGirlGroup() {
print('We are a girlgroup!');
}
}
● Constructor
● Private class
● Inheritance

Class
abstract class IdolInterface {
String name;
IdolInterface(this.name);
void sayName();
}
class BoyGroup implements IdolInterface {
@override String name;
BoyGroup(this.name);
@override void sayName() {
print('We are $name.');
}
}
● Constructor
● Private class
● Inheritance
Abstract class works as an interface

Functional Programming in Dart
● Function as the first-order object
● Transforming from collections and map
● map()
● where()
● reduce()
Passed as a parameter,
Returned from a function,
Assigned into a variable.

void main() {
var f = greeting;
f('Hello KL');
greeting2("KL peeps,", (str)=>{print("Selamat Pagi, $str")});
}
greeting(String text) {
print('$text, we are GDG');
}
greeting2(String text, Function callback) {
callback(text);
}

● map()
● where()
● reduce()
final List<String> btsMembers = [
"Jin",
"Suga",
"J-Hope",
"RM",
"Jimin",
"V",
"Jungkook"
];
var btsSet = btsMembers.toSet();
var btsMap = btsMembers.asMap();

● map()
● where()
● reduce()
var btsSet = btsMembers.toSet();
var btsSet2 = Set.from(btsMembers);
var btsMap = btsMembers.asMap();

● map()
● where()
● reduce()
final List<String> blackPink = [
"Jisoo",
"Jennie",
"Rose",
"Lisa"
];
final newBP = blackPink.map((x) {
return 'BlackPink, $x';
}); // returns Iterable
print(newBP);

● map()
● where()
● reduce()
final List<String> blackPink = [
"Jisoo",
"Jennie",
"Rose",
"Lisa"
];
final newBP = blackPink.map((x) =>
‘BlackPink, $x’); // arrow function
print(newBP);

● map()
● where()
● reduce()
Map<String, String> idols = {
"JYP": "TWICE",
"HYBE": "BTS",
"YG": "BLACKPINK",
"Starship": "IVE"
};
final result = idols.map((k, v) =>
MapEntry(
'Enter corp $k', 'Idol $v’
)
);

● map()
● where()
● reduce()
List<Map<String, String>> gdg = [
{
'name': 'Toru',
'domain': 'Android'
},
{
'name': 'Hassan',
'domain': 'Android',
},
{
'name': 'Jecelyn',
'domain': 'Web',
},
{
'name': 'Vin',
'domain': 'Web',
}
];
final web = gdg.where((x) => x['domain'] == 'Web');
print(web.toList());

● map()
● where()
● reduce()
List<int> numbers = [1, 3, 5, 7, 9];
final result = numbers.reduce((prev, next) =>
prev + next
);
print(result); // result is 25
Must return the same type with parameters

● map()
● where()
● reduce()

Methods for FP are cascadable!

final list = ['Nasi Lemak', 'Roti Canai', 'CKT'];
var result =
list.map({ ... }).take(2).toList();

Asynchronous Programming
● Future - obtaining a value in the future.
● async, await - running code sequentially.
Future<String> futureStr = Future.value('GDG');
Future<int> futureInt = Future.value(100);

void main() {
print("Start");
Future.delayed(
Duration(seconds: 2), (){
print(["Toru", "Hassan", "Jecelyn"]);
});
print("End");
}
// Prints Start immediately
// Prints End immediately
// Prints the array 2 seconds later.

Future<List<String>> fetchSpeakers(String domain) async {
print("Start");
List<String> result = [];
await Future.delayed(
const Duration(seconds: 2), () {
print("Fetched");
if (domain == 'Android') {
result = ["Toru", "Hassan"];
} else {
result = ["Jecelyn", "Shang Yi"];
}
}
);
print("End");
return result;
}
void main() async {
final and = await fetchSpeakers('Android');
print("result: $and");
final other = await fetchSpeakers();
print("result: $other");
}
Use await, to call a method returning Future
Asynchronous!

How could we use Dart in more Dart way?

Thank you!
@TORU_0239
TORU0239
Linkedin: toruchoi

Glancing essential features of Dart, before stepping into Flutter

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Ähnlich wie Glancing essential features of Dart, before stepping into Flutter

Ähnlich wie Glancing essential features of Dart, before stepping into Flutter (20)

Mehr von Toru Wonyoung Choi

Mehr von Toru Wonyoung Choi (10)

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

Glancing essential features of Dart, before stepping into Flutter