Diese Präsentation wurde erfolgreich gemeldet.
Die SlideShare-Präsentation wird heruntergeladen. ×

Glancing essential features of Dart, before stepping into Flutter

Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Wird geladen in …3
×

Hier ansehen

1 von 48 Anzeige

Weitere Verwandte Inhalte

Aktuellste (20)

Anzeige

Glancing essential features of Dart, before stepping into Flutter

  1. 1. Kuala Lumpur Wonyoung Choi Lead Mobile Developer, OCBC Bank Speaker Image Placeholder Glancing essential features of Dart, before stepping into Flutter
  2. 2. “Flutter is an open source framework by Google for building beautiful, natively compiled, multi-platform applications from a single codebase.”
  3. 3. “But, This is not about Flutter.”
  4. 4. ● Basic Syntax ● Object-Oriented Programming ● Functional Programming ● Asynchronous Programming
  5. 5. Basic Syntax
  6. 6. 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;
  7. 7. Variable / Constant ● int / double / String / bool ● Nullable / Non-nullable ● var - type inferring dynamic - works like ‘Any’ ● const - compile time final - runtime double? rotiTelur = null; rotiTelur ??= 3.5;
  8. 8. Variable / Constant ● int / double / String / bool ● Nullable / Non-nullable ● var - type inferring dynamic - works like ‘Any’ ● const - compile time final - runtime var speakerName = "Toru"; speakerName = “Jecelyn"; dynamic month = "Dec"; month = 12;
  9. 9. Variable / Constant ● int / double / String / bool ● Nullable / Non-nullable ● var - type inferring dynamic - works like ‘Any’ ● const - compile time final - runtime final int year = 2022; const String google = "Google"; final nextYear = 2023; const myPhone = "Google Pixel 7 Pro";
  10. 10. 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");
  11. 11. Data Structures Map<String, String> idols = { "JYP": "TWICE", “HYBE": "BTS", "YG": "BLACKPINK" }; idols["Starship"] = "IVE"; // What will happen? print(idols["GDG"]); ● List: a basic collection like array ● Map: key-value pair ● Set: another basic collection, but not allowing duplicated elements
  12. 12. Data Structures final Set<String> blackPink = { "Jisoo", "Jennie", "Rose", "Lisa" }; blackPink.add("Jisoo"); // What will happen? print(blackPink); ● List: a basic collection like array ● Map: key-value pair ● Set: another basic collection, but not allowing duplicated elements
  13. 13. Loop and condition ● if-else ● for loop ● while loop & do-while ● switch - with enum / given value
  14. 14. Method in Dart ● Return Type + Method name + Parameters ● named parameters with {} ● required keyword in parameters with {} ● optional parameters with []
  15. 15. 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 }
  16. 16. Left Aligned Title String namedParameter({ String first = "", String second = "", String third = "" }) { return "$first, $second, $third"; } namedParameter(first: “Toru", second: “Android", third: "SG");
  17. 17. Left Aligned Title String requiredParameter({ required String? first, required String? second }) => "$first, $second"; To be nullable or with default value
  18. 18. String neitherRequiredAndNamed( String first, String second ) => "$first, $second”; neitherRequiredAndNamed("first", "second");
  19. 19. optionalParameter(String first, [String? second]) => "$first, $second”; optionalParameter("first"); To be nullable or with default value
  20. 20. Object Oriented Programming
  21. 21. 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 } }
  22. 22. Class ● Constructor ● Private class ● Getter / Setter - additional properties ● Inheritance ● Abstract class / interface 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” );
  23. 23. Class class _GDGChapter { final String chapterName; final List<String> chapterMembers; String country; _GDGChapter( this.chapterName, this.chapterMembers, this.country ); } ● Constructor ● Private class ● Getter / Setter - additional properties ● Inheritance ● Abstract class / interface
  24. 24. 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 ● Getter / Setter - additional properties ● Inheritance ● Abstract class / interface
  25. 25. 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 ● Getter / Setter - additional properties ● Inheritance ● Abstract class / interface
  26. 26. 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 ● Getter / Setter - additional properties ● Inheritance ● Abstract class / interface
  27. 27. 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 ● Getter / Setter - additional properties ● Inheritance ● Abstract class / interface Abstract class works as an interface
  28. 28. Functional Programming
  29. 29. 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.
  30. 30. 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); }
  31. 31. Functional Programming in Dart ● Function as the first-order object ● Transforming from collections and map ● map() ● where() ● reduce() final List<String> btsMembers = [ "Jin", "Suga", "J-Hope", "RM", "Jimin", "V", "Jungkook" ]; var btsSet = btsMembers.toSet(); var btsMap = btsMembers.asMap();
  32. 32. Functional Programming in Dart ● Function as the first-order object ● Transforming from collections and map ● map() ● where() ● reduce() var btsSet = btsMembers.toSet(); var btsSet2 = Set.from(btsMembers); var btsMap = btsMembers.asMap();
  33. 33. Functional Programming in Dart ● Function as the first-order object ● Transforming from collections and map ● map() ● where() ● reduce() final List<String> blackPink = [ "Jisoo", "Jennie", "Rose", "Lisa" ]; final newBP = blackPink.map((x) { return 'BlackPink, $x'; }); // returns Iterable print(newBP);
  34. 34. Functional Programming in Dart ● Function as the first-order object ● Transforming from collections and map ● map() ● where() ● reduce() final List<String> blackPink = [ "Jisoo", "Jennie", "Rose", "Lisa" ]; final newBP = blackPink.map((x) => ‘BlackPink, $x’); // arrow function print(newBP);
  35. 35. Functional Programming in Dart ● Function as the first-order object ● Transforming from collections and map ● 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’ ) );
  36. 36. Functional Programming in Dart ● Function as the first-order object ● Transforming from collections and map ● 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());
  37. 37. Functional Programming in Dart ● Function as the first-order object ● Transforming from collections and map ● 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
  38. 38. Functional Programming in Dart ● Function as the first-order object ● Transforming from collections and map ● map() ● where() ● reduce()
  39. 39. Methods for FP are cascadable!
  40. 40. final list = ['Nasi Lemak', 'Roti Canai', 'CKT']; var result = list.map({ ... }).take(2).toList();
  41. 41. Asynchronous Programming
  42. 42. 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);
  43. 43. Asynchronous Programming ● Future - obtaining a value in the future. ● async, await - running code sequentially. 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.
  44. 44. Asynchronous Programming ● Future - obtaining a value in the future. ● async, await - running code sequentially. 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!
  45. 45. Asynchronous Programming ● Future - obtaining a value in the future. ● async, await - running code sequentially.
  46. 46. Furthermore…
  47. 47. How could we use Dart in more Dart way?
  48. 48. Thank you! @TORU_0239 TORU0239 Linkedin: toruchoi

×