รายงาน เรื่อง ภาษา Dart

รายงาน เรื่อง Dart

ผ้จู ัดทา : นายณฐั นนท์ ศลิ ป์ศร



รายงาน เรอ่ื ง Dart

จดั ทาโดย
ชื่อ-สกลุ นายณัฐนนท์ ศิลป์ศร
รหัสประจาตัว 62202040002

เสนอ
อาจารยอ์ รรถพล เขยี วทอง
รายงานนีเ้ ปน็ ส่วนหนงึ่ ของการเรยี น วชิ าการพฒั นาโปรแกรมบน

อปุ กรณ์พกพาเบื้องตน้
ภาคเรยี นที่ 2 ปกี ารศกึ ษา 2565

วิทยาลยั เทคนคิ เพชรบรุ ี

ก

คานา

รายงานเลม่ น้ีจัดทาขึ้นเพื่อเป็นส่วนหนึ่งของวิชา การพัฒนาโปรแกรมบนอุปกรณ์พกพาเบื้องต้น
เพ่อื ให้ไดศ้ กึ ษาหาความรู้ใน เรอ่ื ง ภาษา Dart และได้ศกึ ษาอยา่ งเข้าใจเพื่อเปน็ ประโยชนก์ ับการเรียน

ผู้จัดทาหวังว่า รายงานเล่มนี้จะเป็นประโยชน์กับผู้อ่าน หรือนักเรียน ที่กาลังหาข้อมูลเรื่องนี้อยู่
หากมีขอ้ แนะนาหรอื ข้อผิดพลาดประการใด ผู้จดั ทาขอน้อมรับไว้และขออภยั มา ณ ที่น้ดี ว้ ย

ผ้จู ัดทา นาย ณัฐนนท์ ศลิ ป์ศร
วนั ที่ 2 มี.ค. 65

ข

ช่อื เรอื่ ง : รายงาน เร่ือง Dart
ผู้ศึกษาค้นคว้า : นายณัฐนนท์ ศิลป์ศร
ระดับ : ประกาศนยี บตั รวชิ าชีพ
สาขาวชิ า : คอมพิวเตอรธ์ ุรกจิ
สาขางาน : คอมพิวเตอร์ธรุ กิจ
ท่ปี รกึ ษา : นายอรรถพล เขยี วทอง
ปกี ารศึกษา : 2565

บทคัดย่อ

รายงาน เรื่อง ภาษา Dart ครั้งน้มี วี ตั ถุประสงคค์ อื 1.2.1 เพ่ือศกึ ษาเกี่ยวกับโปรแกรมภาษา Dart
1.2.2 ศึกษาการทางานของโปรแกรม 1.2.3 เพื่อเพิ่มช่องทางการศึกษาหาข้อมูล จากเนื้อหาในรายงาน
สรุปได้ว่าภาษา Dart ซึ่งเราจะเห็นว่าภาษานี้นั้นให้อารมณ์เหมือน ภาษาตระกูล C ที่มีการปรับอะไรให้
เปน็ ภาษาสมัยใหม่มากข้นึ แต่กย็ งั ไม่ท้งิ ความเป็น Structure Language อยู่

หากใครเขียน C หรือหรือแม้แต่ภาษา(ที่เคย)โมเดิร์นอย่าง Java มาก่อน จะพบว่ามันมีความ
คล่องตัวในการเขียนมากขึ้น

ค

กิตตกิ รรมประกาศ

รายงานนี้สาเร็จลุล่วงได้ด้วยความกรุณาจากอาจารย์ อรรถพล เขียวทอง ครูผู้สอนวิชาการ
พฒั นาโปรแกรมบนอปุ กรณ์พกพาเบือ้ งต้น ที่ไดใ้ หค้ าเสนอแนะ แนวคดิ ตลอดจนแก้ไขข้อบกพร่อง ต่าง ๆ
มาโดยตลอดจน รายงานเลม่ น้ีเสร็จสมบรู ณ์

ขอบคุณเพื่อน ๆ ที่ช่วยให้คาแนะนาดี ๆ เกี่ยวกับการเลือกคา และเกี่ยวกับโครงงานชิ้นนี้จน
ทาใหโ้ ครงงานสาเรจ็ ลลุ ่วงไปได้

สารบญั ง

คานา หนา้
บทคัดย่อ ก
กิตติกรรมประกาศ ข
สารบญั ค
บทที่ 1
1.1 ทีม่ าและความสาคัญ ง-จ
1.2 วตั ถปุ ระสงค์ 1
1.3 ขอบเขตด้านเน้ือหา
1.3.1 ขอบเขตดา้ นประชากรและกลุ่มตวั อย่าง 2
1.3.2 ขอบเขตดา้ นเวลา
1.4 ประโยชนท์ ีค่ าดวา่ จะได้รับ 3
บทที่ 2 4
Dart คอื อะไร 5-7
จดุ เดน่ ของ Dart คอื อะไร 7-8
Variable และ Data Type 8
Math Operation 9-11
String Concatenate การต่อสตรงิ 11-13
Null Handling 14-17
Flow Control 17-18
Function
First Class Function 19-23
บทที่ 3 23
ความรกู้ ารใชง้ านเบ้ืองตน้ ของ Dart
วธิ กี ารเขียนภาษา Dart 23-24
การสร้าง Class ฉบบั Dart 24-25
การสรา้ ง Constructor ใน Dart

การ Instantiate Object จ
Read-Only Variable คืออะไร
บรรณานุกรม 25
26-28

29

1

บทที่ 1
บทนา

1.1 ทีม่ าและความสาคัญ

ปี 2011 กูเกิลได้เปิดตัวภาษาโปรแกรมตัวใหม่ชื่อว่าภาษา Dart (เวอร์ชันแรก) โครงสร้าง
ของภาษา DART คล้ายกับ C/C++ และ Java โดยท่ีจะมีความเป็นภาษาแบบ Structure Programming
แต่ก็ยังมีความสามารถแบบภาษาประเภท Object Oriented Programming ด้วย นั่นคือมี class
และ inheritance ให้ใช้งาน เป้าหมายของการสร้างภาษา Dart ขึ้นมา กูเกิลบอกว่าอยากสร้างภาษา
เชิงโครงสร้างที่ยืดหยุ่นมากพอ (structured yet flexible language) และเป็นการออกแบบตัวภาษา
ไปพร้อมกับตัว Engine สาหรับรันภาษาเลยเพื่อแก้ปัญหาโปรแกรมทางานช้าและกินmemory
ซึ่งเป้าหมายของภาษา Dart คือเป็นภาษาที่เรียนรู้ง่าย และทางานได้บนอุปกรณ์พกพาขนาดเล็ก มือถือ
ไปจนถึงserver ซึ่งสิ่งที่เด่นที่สุดสาหรับภาษา Dart ในตอนนี้คือเป็นภาษาที่ใช้ในการสร้าง Application
ดว้ ยเฟรมเวริ ก์ Flutter นั่นเอง

ภาษาDart นั้นเป็นภาษาโปรแกรมที่เอาไว้สาหรับสร้างแอพพลิเคชั่นบนแพลตฟอร์ม
ที่หลากหลายโดยได้ทั้ง mobile, desktop, server และก็ web สิ่งที่เป็นที่นิยมที่สุดที่ทาให้คนสนใจ
มาเรียนภาษา Dart กันก็คือเพื่อที่จะเอาไปใช้ร่วมกับ Flutter ที่เป็นเครื่องมือช่วยสร้าง UI ของ Google
ซึ่งใช้ได้ทั้งกับ Android และ IOS หรือจะเป็นใน Desktop กับ Web ก็ยังได้ ภาษา Dart นี้ถูกสร้างโดย
Google และปล่อยให้ใช้งานแบบ open source ทาให้ทุกคน สามารถนาไปใช้งานได้ฟรีๆ และการท่ี
Dart ถูกออกแบบมาให้ใช้งานได้ง่ายและมีประสิทธิภาพแบบ ภาษาเชิงวัตถุอื่นๆอย่าง Java C# C++
จึงเปน็ ตัวเลือกภาษาทน่ี ่าสนใจในการศกึ ษาเปน็ ภาษาแรกอกี ดว้ ย

1.2 วตั ถุประสงค์
1.2.1 เพ่อื ศึกษาเกีย่ วกบั Flutter
1.2.2 ศึกษาการทางานของ Flutter
1.2.3 เพอื่ เพิ่มชอ่ งทางการศึกษาหาข้อมูล

2

1.3 ขอบเขตด้านเนอื้ หา
ศึกษาเกี่ยวกับการจัดทารายงานเรื่อง ภาษา Dart เพื่อเป็นแนวทางให้ผู้เรียนคนอื่นๆเข้ามาศึกษา

หาความรู้นอกห้องเรียน เพอ่ื เกดิ ความเข้าใจเพม่ิ มากข้นึ
1.3.1 ขอบเขตดา้ นประชากรและกลุ่มตวั อยา่ ง

ประชากร ไดแ้ กก่ ลุ่มบุคคลทั่วไปที่ต้องการศึกษาเรื่อง ภาษา Dart
1.3.2 ขอบเขตดา้ นเวลา

เร่ิมวันที่ 1 พฤศจกิ ายน พ.ศ.2564 ถงึ วันที่ 18 กุมภาพนั ธ์ พ.ศ.2564
1.4 ประโยชน์ท่ีคาดวา่ จะไดร้ ับ

1.4.1 ไดร้ ู้ความเปน็ มาของโปรแกรมภาษา Dart
1.4.2 รู้การทางานของโปรแกรม
1.4.3 สามารถตอยอดและนาไปใช้ในการเรยี นการสอน

3

บทที่ 2

Dartเป็นภาษาการเขียนโปรแกรมหลักในการพัฒนาแอพมือถือเว็บและเดสก์ท็อปโด ยใช้
Flutter framework ในบทชว่ ยสอนนี้ฉันจะแนะนาใหค้ ุณเรยี นรภู้ าษาโปรแกรม Dart ไดเ้ ร็วขน้ึ ฉนั จะพูด
ถงึ คุณสมบตั ทิ ี่สาคัญทีส่ ดุ และทั่วไปของ Dart ท่ีเราใชเ้ ป็นประจาเพ่อื พัฒนาแอพพลเิ คชัน่

Dart คืออะไร
Dart คือ ภาษา Programming ใช้การเขียนแนวคิดแบบ OOP (โอโอพี) มี class

และ inheritance ประกาศชนิดของตัวแปรหรือไม่ก็ได้ ทาให้ Developers ใช้สร้าง Applications
ท่ีมีคณุ ภาพ ถกู พัฒนาโดย Google ภาษา Dart มีไลบรารีและเคร่ืองมือพัฒนาต่างๆ ใหพ้ ร้อม
Dart สร้างขนึ้ เพื่อเป้าหมาย 3 ประการ คอื
1. สร้างภาษาโปรแกรมสาหรับเว็บทเ่ี ป็นภาษาเชิงโครงสร้างทยี่ ืดหยุ่น
2. สร้างภาษาท่ีนักพฒั นาคนุ้ เคย และเรยี นร้ไู ดง้ า่ ย
3. สร้างภาษาที่มีประสิทธิภาพสูงบนเบราว์เซอร์สมัยใหม่ทุกตัว และใช้ได้ตั้งแต่อุปกรณ์พกพาขนาดเล็ก
จนถึงเซริ ์ฟเวอร์
การแปลภาษา Dart
1. แปลง Dart มาเป็น JavaScript (จาวา สคริปต์)
2. รนั โคด้ Dart บน Virtual Machine ท่ฝี ัง่ เซริ ฟ์ เวอร์

4

จุดเดน่ ของ Dart คอื อะไร
จุดเด่นหลัก โปรแกรมของ Dart นั้นหน้าตาคล้ายๆ กับภาษา C มาก ถ้าใครเคยเขียนภาษา C

หรือภาษาตระกูล C มาก่อน (เช่น C++, C#, Java) จะคุ้นกับ syntax พวกนี้ทาให้เรียนรู้ได้ไม่ยาก
Dart เป็นภาษากลุ่ม Compiler นั่นคือจาต้อง Compile ก่อนเอาโปรแกรมไปรัน ไม่เหมือนภาษากลุ่ม Script
ที่ใช้ interpreter ในการรันตวั source code ตรงๆ

void main(){
print("Hello World!");

}

ตัวโปรแกรมจาเริ่มทางานที่ฟังก์ชัน main เป็นหลัก เราไม่สามารถเขียน statement นอก
ฟังกช์ ันได้ การแสดงผลมาตรฐานจะใช้คาสั่ง print (คาสั่งนี้ auto-newline เสมอนะ) เรื่องหนึ่งที่ควรจา
คือภาษา Dart นั้นการเขียน ; (semi-colon) ไม่ใช่ optional คือจาเป็นต้องใส่ ;
ทุกคร้ังหลังจบ statement ไม่สามารถละ ; ได้แบบภาษาตระกูล C ยคุ ใหม่ๆ เชน่ JavaScript หรือ Kotlin
Comment
การใส่คอมเมนท์ทาไดเ้ หมือนภาษา C ทุกอยา่ งคือ
1. // สาหรบั inline comment
2. เปดิ ดว้ ย /* และปิดด้วย */ สาหรบั multi-line comment (ไม่สามารถ nested ไดน้ ะ)

int x; //ตัง้ แต่ตรงนี้ไป เปน็ ส่วนของคอมเมนท์

/*
ในน้ี
ทัง้ หมด
เปน็ คอมเมนท์

*/

5

Variable และ Data Type

type คาอธิบาย ตวั อยา่ ง

int เลขจานวนเตม็ 0, 1, -5, 86400

double เลขทศนิยม 0.0, 0.1, 0.14, -12.34

num เลขทศนิยม หรือ เลขทศนิยม 123, 0.123

bool ค่าทางตรรกศาสตร์ true, false

Strin สายอกั ขระ (ประโยค) 'hello world!', "This is a book" <-- ในภาษา Dart สามารถ
ใช้ได้ทัง้ " (double quote) และ ' (single quote) แต่เขาแนะนา

ให้ใช้ ' หรอื single quote กันนะ

dynamic ตวั แปรชนิดเปล่ยี นแปลงได้ 1, 0.14, true, 'Hi!'

ตัวแปรของ Dart ท้ังหมดเป็นแบบ reference type ท้ังหมด ทาใหส้ ามารถมีค่าเปน็ null ได้ทั้งหมด

int x;
double d;
bool isDone;
String name;

//ตวั แปรทงั้ หมดมีค่าเป็น null เพราะยังไม่ได้กาหนดคา่

แตใ่ น Dart ยงั มีชนิดของตวั แปรแบบพิเศษ ซึง่ ไมจ่ าเป็นต้องประกาศ type เลย แต่ตวั ภาษาจะ auto assign
ชนิดของตัวแปรให้เอง

type คาอธิบาย
var เปน็ การละ type เอาไว้ใหโ้ ปรแกรมกาหนดให้ (ตาม value)
final เหมอื น var แต่ไม่สามารถเปล่ียนแปลงค่าได้
const ค่าคงที่

6

ข้อแตกต่างระหวา่ ง dynamic vs var คอื
dynamic เปน็ การบอกว่าตัวแปรน้ี เกบ็ คา่ ชนดิ ไหนก็ได้ เปล่ียนแปลงไดเ้ ร่อื ยๆ (หากใครเคยเขียนภาษา
script นา่ จะคนุ้ กัน) แน่นอนว่าการใช้ dynamic มีความเส่ียงทาให้เกิด runtime error! ไดเ้ พราะ
Compiler ไม่สามารถช่วยเช็คชนิดของตัวแปรไดเ้ ลย var จะเปน็ การกาหนดชนิดตวั แปรในจงั หวะท่ี
ประกาศตวั แปร โดยดูชนิดตวั แปรจาก value ตอนนั้นเลย หลังจากนัน้ ตวั แปรจะถกู กาหนดเป็น type
นัน้ ไปตลอด ไม่สามารถเปล่ียนแปลงได้แลว้

dynamic d = 1; // ตอนนีค้ ่า d เก็บค่า int
d = 'new value!'; // Ok! คา่ d เปล่ียนไปเก็บคา่ String แทน
d = true; // Ok! คา่ d เปลยี่ นไปเก็บคา่ bool แทน

var v = 1; // สร้างตวั แปร v ซง่ึ value ในด้านขวาเป็น int ดงั น้ันจะมีผลเท่ากับการเขียนว่า int
v = 1; นนั่ เอง
v = 'new value'; // Error: A value of type 'String' can't be assigned to a variable of type
'int'

ขอ้ แตกตา่ งระหว่าง final vs const คอื
final เปน็ การกาหนดว่าตวั แปรนี้ ไมส่ ามารถเปลี่ยนแปลงคา่ ได้ กาหนดคา่ แลว้ กาหนดเลย (immutable)
ซงึ่ เป็นตัวแปรประเภท runtime ดังนัน้ เราสามารถกาหนดคา่ final จากตัวแปรหรอื ฟงั ก์ชันอนื่ ได้ const
เปน็ การประกาศค่าคงที่ โดยคา่ ท่ีกาหนดให้จะต้องเป็น literal เทา่ นั้น (เชน่ 10, 'value') เพราะเปน็ ตัว
แปรท่กี าหนดคา่ ตั้งแต่ตอน compile-time

7

int x = 10;

final int f1 = 1; //กาหนดตัวแปร int ใหเ้ ป็นคา่ คงท่ี
final f2 = 'final-val'; //ใช้เหมือน var คอื ไม่กาหนด type ก็ได้
final f3 = x + 20; //กาหนดค่าจากกโดยคานวณมาจากตวั แปรอน่ื อกี ที

const int c1 = 1; //กาหนดตวั แปร int ใหเ้ ปน็ คา่ คงที่
const c2 = 'const-val'; //ใช้เหมอื น var คือไม่กาหนด type กไ็ ด้
const c3 = x + 20; //Error: Not a constant expression. เพราะ x เป็นตวั แปรที่ value มา
ตอน runtime ไมส่ ามารถกาหนดให้ const ได้

Math Operation
การใช้ +, -, *, / และ % เหมือนกับภาษาอ่นื ๆ แตม่ ีข้อควรระวงั ทีต่ วั /
สาหรบั ภาษาอนื่ ถ้าเรานา int / int ผลท่อี อกมาจะไดเ้ ปน็ int แน่นอน แต่สาหรับ Dart น้ันการหารจะได้
ค่าออกมาเปน็ double เสมอ

int x = 4 / 2; // Error: A value of type 'double' can't be assigned to a variable of
type 'int'.

int y = (int)(4 / 2); // Error: case แบบภาษา C ไม่ได้ด้วยนะ

วธิ กี ารแกค้ ือใช้ operation ~/ คือการหารแล้วปัดจดุ ทง้ิ หรือใชค้ าส่ัง as หรอื จะใช้คาสัง่ toInt() กไ็ ด้

8

int x = 4 ~/ 2; // Ok! แบบน้ไี ด้

int x = 4 / 2 as int; // Ok! แบบนไ้ี ด้

int x = (4 / 2).toInt(); // Ok! แบบนไ้ี ด้

คาเตือน! ระวงั สบั สนกับคาสง่ั int.parse() กบั int.tryParse() ทใี่ ชแ้ ปลง String --> int, เราไมส่ ามรถใช้
2 คาส่งั น้ีในการแปลง double --> int ไดน้ ะ

String Concatenate การตอ่ สตริง
การต่อสตริงใชเ้ คร่อื งหมาย + เหมือนภาษาท่วั ๆ ไป แตก่ ็มีข้อควรระวงั (อีกแล้ว!) คอื ไม่สามารถตอ่ สตริง
กบั ตัวแปรที่ไมใ่ ชส่ ตรงิ ได้!

int x = 100; // Error: A value of type 'int' can't be assigned to a variable of type

print('x is ' + x);
'String'.

เราจะตอ้ งแปลงตวั แปรท่ีต้องการจะต่อสตรงิ ให้เป็น String ซะก่อน หรือทา String Interpolation ซะ
ก่อน โดยใชต้ วั $ เพ่ือระบวุ ่าตรงนี้เปน็ ตวั แปร (ถา้ มี expression ดว้ ยใหค้ รอบด้วย ${})

int x = 100, y = 200;

print('x is ' + x.toString()); // x is 100

print('x is $x'); // x is 100

print('x is ${x}'); // x is 100

print('x + y is ${x + y}'); // x + y is 300

9

Null Handling
ตัวแปรใน Dart เปน็ แบบ reference ดังนั้นเลยสามารถเป็นค่า null ไดท้ ุกตัวเลย ภาษาDartเลยมี
operation สาหรบั จดั การคา่ null พวกน้มี าใหเ้ ราใช้งานด้วย
?? Null Coalescing
เป็นการเช็กวา่ ตวั แปรตวั น้ี ถ้ามีคา่ เป็น null ให้ใช้คา่ default ท่กี าหนดให้แทน

output = input ?? defaultValue;

// เปน็ short-hand ของ...

if (input != null) {
output = input;

} else {
output = defaultValue;

}

เช่น

int number = ...;

int x = number ?? 1; // กาหนด x = number แตถ่ ้า number เป็น null ให้กาหนด x = 1 แทน

10

?. Null Conditional
หากตัวแปรของเราเป็น object ซ่งึ สามารถเรียกใชง้ าน method ตา่ งๆ ได้ ... แต่ถา้ object ตัวน้นั เปน็
null กจ็ ะเกดิ ปญั หา Null Pointer Exception ได้

object?.action();

// เปน็ short-hand ของ...

if (object != null) {
object.action();

}
เช่น

class People{
void sayHi(){ print("hi!"); }

}
void main(){

People people = ...;
people?.sayHi(); // ถา้ people เปน็ object ก็จะมกี ารปร้นิ ค่า "hi!" ออกมา แต่ถ้า people เป็น
null คาสั่งนั้นก็จะไม่ถกู สัง่ ให้ทางานเลย
}

11

??= Null Coalescing Assignment
หากไม่ชวั รว์ ่าตวั แปรตวั นน้ั เป็น null รึเปล่า สามารถใช้ ??= กาหนดคา่ default ลงไปได้

variable ??= defaultValue

// เป็น short-hand ของ...
variable = variable ?? defaultValue;

// หรือใช้ Ternary Operator

variable = variable != null ? variable : defaultValue;

// หรอื เขียนแบบ if-else

if (input == null) {
output = defaultValue;

}

Flow Control

if-else

if (condition) {
// TODO

} else {
// TODO

}

12

switch case

switch (command) {
case 'PENDING':
executePending();
break;
case 'APPROVED':
executeApproved();
break;
case 'DENIED':
executeDenied();
break;
default:
executeUnknown();
}

ข้อควรระวัง! switch ในภาษา Dart ต้องมี break ตอนจบ case ทุกครั้ง ถ้าไม่ใส่ลงไป โปรแกรม
จะไมห่ ยุดทางาน แลว้ รนั คาส่ังบรรทดั ตอ่ ไปตอ่ เลย

13

Loop: while, do-while

while (!isDone()) {
doSomething();
}

do {
printLine();
} while (!atEndOfPage());

เมอ่ื ภาษาทวั่ ๆ ไป มีตัวcontrolเสรมิ คอื break และ continue ใหใ้ ช้งานด้วย

Loop: for

for (var i = 0; i < 5; i++) {
print(i);
}
// output: 0 1 2 3 4

หรอื ใชง้ านแบบ for-each สาหรบั วนลูปทุก element ใน list

var numbers = [0, 1, 2, 3, 4];
for (var number in numbers) {
print(number);
}
// output: 0 1 2 3 4

14

Function
การสรา้ งฟงั กช์ นั ในภาษา Dart มี syntax เหมือนภาษา C แต่สามารถละ type ทิง้ ไปได้
เชน่

int add(int x, int y) {
return x + y;

}
// สามารถเขียนย่อไดว้ ่า
add(x, y) {

return x + y;
}

Arrow Function
และหากเคยเขียนภาษา JavaScript มา มหี ลายครั้งที่เราสร้างฟังกช์ นั ที่มี return statement เดยี วเท่าน้นั
เราก็สามารถเขียนย่อโดยใช้ Arrow Function ได้ ... และแน่นอน Dart กท็ าไดเ้ หมอื นกัน โดยใช้ =>

int add(int x, int y) {
return x + y;

}
// สามารถเขยี นย่อได้ว่า
add(x, y) => x + y;

15

Optional Parameter
เราสามารถกาหนดคา่ เริ่มต้นให้ parameter ได้โดยใช้ [] ครอบ parameter ทอี่ ยากประกาศใหเ้ ปน็ optional

int add(int x, [int y = 1]) {
return x + y;

}

add(10, 20); // result: 30
add(10); // ไมเ่ ซ็ตคา่ y, ดงั นนั้ y = 1 result: 11

Named Parameter
บางกรณี การสร้างฟังกช์ นั ทมี่ ี parameter เยอะมาก ตอนทีเ่ รยี กใชฟ้ ังกช์ ันอาจจะงงเร่ืองลาดับตวั แปรได้

int setConfig(
String basePath,
String appPath,
int retry,
int maxThread,
String defaultController

){
// TODO

}
setConfig("/", "/app", 10, 4, "Main");

ในกรณนี ้ีเราสามารถต้ังช่ือ parameter แตล่ ะตวั ได้ โดยใช้ {}

16

int setConfig({
String basePath,
String appPath,
int retry,
int maxThread,
String defaultController

}) {
// TODO

}
setConfig(

basePath: "/",
appPath: "/app",
retry: 10,
maxThread: 4,
defaultController: "Main"
);

ซึ่งตวั parameter ทั้งหมด สามารถสลบั ตาแหนง่ กนั ได้
ข้อควรระวงั ! ตอนประกาศฟังก์ชันตอ้ งมี {} ครอบตัวแปร แต่ตอนเรยี กใช้งานฟังกช์ นั ห้ามใส่ {} ลงไปนะ
การใช้งาน Named Parameter จะถอื วา่ เป็น optional ทงั้ หมด (แปลวา่ ไม่ใส่คา่ ก็ได้) ซง่ึ กจ็ ะไดค้ ่าเปน็ null
หากต้องการให้เวลาเรียกใช้งานฟังก์ชัน จาเป็นต้องใส่ค่านั้นลงไปเสมอจะต้องใช้ annotation
@required เขา้ มาช่วย
ซง่ึ @required น้ันอยใู่ น package ชอ่ื meta ท่ีต้องตดิ ตง้ั เพอ่ื กอ่ นจะใช้งาน โดยการเพิ่ม dependency
ในไฟล์ pubspec.yaml

17

dependencies:
meta: ^1.1.8

เวลาใช้งานก็...

import 'package:meta/meta.dart';
int setConfig({

@required String basePath,
@required String appPath,
int retry,
int maxThread,
String defaultController
}) {
// TODO
}

แบบนี้หมายความวา่ parameter basePath และ appPath น้นั จาเป็นต้องใส่ทุกครงั้ ท่ีเรยี กใช้งานฟังกช์ ัน
First Class Function

ตามสไตลภ์ าษาสมัยใหม่ เราสามารถจับฟงั ก์ชนั ใสต่ ัวแปรได้

int getNumber() => 123;
void main(){

var func = getNumber; // ไม่ใช่ getNumber() นะ,ไม่มี ()
print(func()); // output: 123
}

หรอื เราจะกาหนดวา่ ตัวแปรฟังก์ชนั จะเป็น type อะไรและมี parameter อะไรบ้างก็ได้
โดยใช้รปู แบบการกาหนด type ดงั นี้

18

return-type Function (params-type)

void func1(){ ... }
int func2(){ ... }
String func3(int x){ ... }

void main(){
void Function() f1 = func1;
int Function() f2 = func2;
String Function(int) f3 = func3;

}

และยังใชไ้ ด้กับ method อีกดว้ ย เช่น

class People{
String sayHi() => "Hi!";

}

void main(){
People p = People();
String Function() f = p.sayHi;
print(f()); // output: Hi!

}

19

บทท่ี 3

ความรูก้ ารใช้งานเบอ้ื งต้นของ Dart
ภาษา Dart คือภาษา ทีใ่ ช้ในการเขียนโคด้ บน Flutter นัน้ เอง ก่อนที่เราจะไปเรียนโค้ด Flutter ควรรู้จัก
โครงสร้างภาษา Dart

การเรยี นภาษา Dart จะงา่ ยมาก โดยเจ้าของภาษาจะมี PlayGround อยทู่ ี่
https://dartpad.dartlang.org ไปแล้วลองพมิ พ์โค้ดงา่ ยๆ แบบนี้

นเ่ี ป็นรูปแบบการประกาศตวั แปร บนภาษา Dart จากตวั อย่าง มาสเตอร์ ใช้ Function myName
เปน็ ตวั Initialization

20

โครงสร้าง ของ Function Dart

เมือ่ App ทเ่ี ขยี นด้วยภาษา Dart ทางาน ตวั Dart เรม่ิ ต้นการทางานที่ function main ครบั พดู งา่ ยๆ
Main Function Dart กค็ ือ main นน้ั เอง

21

ต่อไปเราจะมาดูชนดิ ของข้อมูลบ้าง

บนภาษา Dart มหี ลายชนดิ มี String, int, double แต่ท่ีนา่ สนใจทีส่ ดุ ก็ dynamic คือ
ชนิดของข้อมลู ที่ มไี ดห้ ลายแบบ จะเป็น String, Double หรือ int กไ็ ด้

22

สว่ นประโยชน์ ของการกาหนดชนดิ ของขอ้ มูล
ลองดูจากโคด้ นี่ มาสเตอร์ ประกาศตวั แปรเพิ่มอีกตวั number มีชนิดของขอ้ มูลเปน็ int

23

การ Print ออก Console บนภาษา Dart ถา้ ต้องการนาคา่ ของตวั แปรออกมาแสดง จะตอ้ งมี $ นาหนา้ ตวั แปร
วิธีการเขยี นภาษา Dart
วธิ กี ารใชง้ านภาษา Dart ตัง้ แต่เร่มิ ต้นกันเลยดีกว่า อยา่ งที่บอกไปดา้ นบนว่า Dart เป็นภาษาเชิงวัตถุ
(Object-oriented programming) ดังนั้นส่งิ ทข่ี าดไม่ไดเ้ ลยกค็ อื class น่นั เอง
การสร้าง Class ฉบับ Dart
เวลาเราพูดถึงคลาสกนั อย่างในภาษา Java อยา่ งน้อยก็ต้องมี method หรอื ก็คอื ฟงั กช์ ันท่อี ยูใ่ นคลาส
อยา่ ง main อยูแ่ น่นอน Dart เองกม็ ี main อยูเ่ หมือนกนั โดยจะเปน็ ฟังก์ชนั อยู่ช้ันนอกสุดเลย สมมตวิ ่า
ถ้าจะสั่ง print “Hello, World” ใน Dart โค้ดก็จะมีหนา้ ตาแบบน้ี

24

โคด้ Hello World ใน Dart:

main() {
print('Hello, World!');
}

ถ้าจะเทยี บกบั Java ท่ีจะ print “Hello, World” แล้ว Dart นน้ั ดูสน้ั และก็งา่ ยกว่ากนั มาก

โค้ด Hello World ใน Java:

class Main {
public static void main(String[] args) {
System.out.println("Hello world!");
}

}

เรามาเริม่ สรา้ งคลาส Bicycle กนั จรงิ ๆดกี ว่า

class Bicycle {
int cadence;
int speed;
int gear;

}

void main() {
}

จากโค้ดนี้จะเห็นว่า เรามีการประกาศคลาส Bicycle โดยมีตัวแปรที่อยู่ใสคลาสหรือ Attribute ด้วยกัน
3 ตัวคือ cadend (รอบขาในการปั่น), speed (ความเร็ว), และ gear (เกียร์) ถ้าสังเกตจะเห็นว่าการ
ประกาศคลาสนั้นไม่ต้องระบุ public, private หรือ protected เหมือนในภาษา Java โดยใน Dart นั้น
ท้ังหมดจะ public เป็นคา่ เร่มิ ตน้ อยู่แลว้ นน่ั เอง

การสรา้ ง Constructor ใน Dart
เมอ่ื คลาสและ attribute ในคลาสก็ตอ้ งมี constructor แน่นอนเพ่ือกาหน้าคา่ กับคลาสนั้นๆตอนทส่ี ร้าง
object ขนึ้ มาจากคลาสนน่ั เอง

Bicycle(int cadence, int speed, int gear) {
this.cadence = cadence;
this.speed = speed;
this.gear = gear;

}

25

ซึ่งในภาษา Dart เราสามารถเขียน constructor ใหอ้ ยใู่ นบรรทดั เดียวแบบนกี้ ็ได้

Bicycle(this.cadence, this.speed, this.gear);

การ Instantiate Object
ทีนีเ้ รามาลองสร้าง instance หรอื ก็คือ object ทสี่ รา้ งจากคลาส Bicycle กัน

var bike = new Bicycle(2, 0, 1);

ใน Dart นนั้ เราสามารถเลือกที่จะใช้หรือไม่ใช้ new ตอนสร้าง instance ก็ได้ ซง่ึ พอเอาไปรวมอยู่ใน
ฟงั กช์ นั main ก็จะไดโ้ ค้ดหน้าตาแบบนี้

void main() {
var bike = Bicycle(2, 0, 1);
print(bike);

}

ทาใหภ้ าพรวมคลาส Bicycle ของเราเร่ิมเปน็ รปู เปน็ รา่ งแลว้

class Bicycle {
int cadence;
int speed;
int gear;
Bicycle(this.cadence, this.speed, this.gear);

}
void main() {

var bike = new Bicycle(2, 0, 1);
print(bike);
}

Output:

Instance of 'Bicycle'

26

Read-Only Variable คอื อะไร
Read-only variable ก็คอื การทาให้ตัวแปรภายใน class เป็น private เขา้ จากภายนอกคลาสโดยตรงไม่ไดน้ น่ั เอง
ในคลาส Bicycle ของเรา มาทาให้ speed กลายเป็น read-only variable กนั ซง่ึ ทาได้ง่ายมากๆแคเ่ ปล่ียนชื่อของ
มันเทา่ นน้ั เอง

จาก

int speed;

ไม่เปน็

int _speed = 0;

แคเ่ ตมิ _ (underscore) นาหนา้ ชือ่ ตวั แปรน้นั ๆก็จะเปน็ private แลว้ นนั่ เอง ซง่ึ พอตวั แปรเปน็ private
แลว้ เราก็ต้องสรา้ ง getter ไวส้ าหรับ get ตวั แปรจากภายนอกเอาไวด้ ้วย เรยี กใช้ไดง้ า่ ยๆแบบนเ้ี ลย

int get speed => _speed;

เราจะทาการเพ่ิมฟงั ก์ชนั info ไว้ดูข้อมูลของจักรยานเข้าไปในคลาสด้วย เพ่ือทจ่ี ะไดเ้ หน็ ผลลพั ธ์จากการสร้างคลาส
งา่ ยๆ พอรวมเสรจ็ คลาส Bicycle ของเรากจ็ ะมีหน้าตาแบบน้ีแล้ว

class Bicycle {
int cadence;
int gear;
int _speed = 99;
Bicycle(this.cadence, this.gear);
int get speed => _speed;
String info() {
return "This bike has: " + cadence.toString() + " cadence, "
+ gear.toString() + " gear, and " + _speed.toString() + "

speed.";
}

}
void main() {

var bike = new Bicycle(2, 1);
print(bike.info());
}

27

Output:

This bike has: 2 cadence, 1 gear, and 99 speed.

Optional Parameters เร่ืองนสี้ าคัญไมแ่ พก้ ัน
สาหรับหัวข้อนี้ก็ขอเทียบกับภาษา Java เหมือนอย่างเคย ในภาษา Java นั้นมี overloading constructor
หรือก็คือการมี constructor หลายตัวท่ีแต่ละตัวรับค่าไม่เหมือนกันเพื่อที่จะได้สร้าง instance ได้ด้วยวิธี
ที่แตกต่างกันได้ ใน Dart ก็ทาได้เช่นเดียวกัน อย่างคลาส Bicycle ของเราถ้าหากจะทาให้ตอนสร้าง
instance เลอื กทจ่ี ะระบุหรือไมร่ ะบุ gear ก็ได้ เราสามารถเขยี นเปน็ optional parameters ได้แบบโค้ด
ด้านลา่ งน้ี

Bicycle(this.cadence, {this.gear = 1});

ส่วนเวลาสรา้ ง instance กใ็ ชง้ านได้แบบน้ี

var bike1 = new Bicycle(2, gear: 9);
var bike2 = new Bicycle(2);
print(bike1.info());
print(bike2.info());

Output:

This bike has: 2 cadence, 9 gear, and 99 speed.
This bike has: 2 cadence, 1 gear, and 99 speed.

ได้เหน็ ตัวอย่างการเขียน Dart กันไปแล้ว นา่ จะไมย่ ากใช่มั้ยครับ ยง่ิ ถา้ ใครเขยี น Java มากอ่ นละก็นา่ จะ eszy สดุ ๆ
ไปเลย ภาษา Dart เป็นภาษาทนี่ ่าสนใจและมีการเตบิ โตอย่างตอ่ เนอ่ื ง

28

โค้ดทง้ั หมดทีเ่ ขยี นมาในบทความน้ี

class Bicycle {
int cadence;
int gear;
int _speed = 99;

Bicycle(this.cadence, {this.gear = 1});
int get speed => _speed;
String info() {

return "This bike has: " + cadence.toString() + " cadence, "
+ gear.toString() + " gear, and " + _speed.toString() + "

speed.";
}

}

void main() {
var bike1 = new Bicycle(2, gear: 9);
var bike2 = new Bicycle(2);
print(bike1.info());
print(bike2.info());

}

29

บรรณานุกรม

Tanapoj Chaivanichanan. (2020). Dart 101: ทาความรจู้ ักภาษา Dart ฉบบั โปรแกรมเมอร์. สบื ค้น
2 มีนาคม 2565, จาก https://www.centrilliontech.co.th/blog/2570/dart-101- introduction-
for-programmers/

androidthai.in.th (2019). Dart ทางานอย่างไร สบื ค้น 2 มนี าคม 2565, จาก

http://www.androidthai.in.th/android-flutter/250-
%E0%B8%A0%E0%B8%B2%E0%B8%A9%E0%B8%B2-dart-
%E0%B8%97%E0%B8%B3%E0%B8%87%E0%B8%B2%E0%B8%99%E0%B8%81%E0%B8%B1%E0%
B8%99%E0%B8%AD%E0%B8%A2%E0%B9%88%E0%B8%B2%E0%B8%87%E0%B9%84%E0%B8%A
3.html

borntodev.com. สบื ค้น 2 มนี าคม 2565, จาก

https://www.borntodev.com/2020/04/11/%E0%B9%80%E0%B8%A3%E0%B8%B5%E0%B8%A2%
E0%B8%99-dart-
%E0%B9%81%E0%B8%9A%E0%B8%9A%E0%B8%81%E0%B9%89%E0%B8%B2%E0%B8%A7%E0%
B8%81%E0%B8%A3%E0%B8%B0%E0%B9%82%E0%B8%94%E0%B8%94/#:~:text=Dart%20%E0%
B8%99%E0%B8%B1%E0%B9%89%E0%B8%99%E0%B9%80%E0%B8%9B%E0%B9%87%E0%B8%9
9%E0%B8%A0%E0%B8%B2%E0%B8%A9%E0%B8%B2%E0%B9%82%E0%B8%9B%E0%B8%A3%E0
%B9%81%E0%B8%81%E0%B8%A3%E0%B8%A1,%E0%B8%88%E0%B8%B0%E0%B9%80%E0%B8
%9B%E0%B9%87%E0%B8%99%E0%B9%83%E0%B8%99%20Desktop%20%E0%B8%81%E0%B8%
B1%E0%B8%9A