Skip to content
CodingThailand's Blog
CodingThailand's Blog

by โค้ชเอก

  • Home
  • About Me
  • CodingThailand.com
CodingThailand's Blog

by โค้ชเอก

สรุปพื้นฐานภาษา Dart ก่อนเขียน Flutter

25/02/202025/02/2020

สำหรับคนที่อยากพัฒนา Mobile App หรือ Web App ด้วย Flutter สิ่งแรกที่ต้องทำคือ การศึกษาภาษา Dart ครับ

.
ภาษา Dart เป็นภาษาแบบ Object-Oriented รองรับทั้ง JIT (Just In Time) และ AOT (Ahead of Time) สำหรับคนที่เคยเขียนภาษาที่เป็น OOP มาก่อน จะทำให้การศึกษาภาษา Dart รวดเร็วยิ่งขึ้นครับ เช่น เคยเขียนภาษา JAVA หรือ C# เป็นต้น และแน่นอนภาษา Dart เป็นภาษาแบบ strongly typed (ต้องระบุชนิดข้อมูล แต่ก็รองรับ dynamic types ด้วยนะครับ ถ้าเราจะเลือกใช้)

สำหรับคนที่เคยเขียนภาษาที่เป็น dynamic types มาก่อน เช่น Ruby, Python หรือ JavaScript อาจจะต้องปรับตัวกันนิดนึงครับ 

.
วันนี้ผมจะลองสรุปพื้นฐานภาษา Dart แบบสั้นๆ ให้อ่านกันนะครับ เผื่อใครสนใจเขียน Flutter ทั้งแบบ Mobile และ Web App มาเริ่มกันเลย!

.
1. ตัวอย่างการประกาศตัวแปรรูปแบบต่างๆ

String name; // หากไม่กำหนดค่าเริ่มต้นให้กับตัวแปร จะมีค่า default เป็น null ครับ (null ใน dart จะเป็น objects)

int age;

double num2 = 10.50;

List<String> names; // List คือ arrays ในภาษาอื่นๆ

Map<String, int> products;

int three = null;

const String fullname= 'Akenarin';

var message = 'Hello'; // ประกาศตัวแปรโดยไม่ต้องระบุ type

dynamic myVar = "Hello"; // ตัวแปร myVar เป็นแบบ
dynamic types สามารถกำหนดค่าได้ทุกชนิดข้อมูล

final name = 'Bob';

.
2. ตัวอย่างการเขียนฟังก์ชัน การเขียนฟังก์ชันในภาษา Dart ต้องใส่ return type ด้วยนะครับ (รวมถึง argument) เช่น

int addNums(int x, int y) {
return x + y;
}

หรือ
String makeGreeting(String name) {
return 'Hello, $name';
}

.
3. การ comments โค้ด รองรับ 3 แบบ ดังนี้

// In-line comments

/*
Blocks of comments.
*/

/// Documentation
///
/// สำหรับเขียนเอกสารคู่มือ

.
4. การใช้งาน Operators คล้ายกันกับภาษาอื่นๆ เช่น การบวก ลบ คูณ หาร ( + , – , * , /) จะมีแตกต่างบ้าง เช่น

เครื่องหมาย ~/ คือ เมื่อหารกันแล้วจะปัดเศษผลลัพธ์เป็นจำนวนเต็มที่ใกล้เคียงที่สุด เช่น 5 ~/ 2 จะเท่ากับ 2

as เอาไว้สำหรับทำ typecasts

is และ is! สำหรับตรวจสอบว่า 2 objects มี type เดียวกันหรือไม่ (จะใช้ == หรือ != ก็ได้)

.
5. คำสั่งต่างๆ เกี่ยวกับการจัดการค่า null จะทำให้เราเขียนโค้ดสั้นลง คือไม่ต้องเขียนแบบนี้แล้ว
if (user != null) {
this.userAge = user.age;
}

.
5.1 เครื่องหมาย ?? สำหรับตรวจสอบว่าเป็นค่า null หรือไม่ ถ้าเป็น null ให้ใช้ค่า default แทน (คือ ตัวเลข 20)

this.userAge = user.age ?? 20;

.
5.2 เครื่องหมาย ?. สำหรับตรวจสอบว่าเป็นค่า null หรือไม่ ถ้ามีข้อมูลให้แสดงค่าของฟิลด์นั้นออกมา (ฟิลด์ age) แต่ถ้าเป็น null ก็จะไม่มี error อะไร

this.userAge = user?.age;

.
5.3 เครื่องหมาย ??= สำหรับตรวจสอบว่าเป็น null หรือไม่ ถ้าเป็น null ให้กำหนดค่าเป็นเลข 3 แทน ถ้าไม่เป็น null ก็ทำงานตามปกติ เช่น

int x;
x ??= 3;
print(x); //ผลลัพธ์ คือ 3 เพราะ x เป็น null

.
6. การเขียน if และ else เขียนแบบปกติได้เลยครับ เช่น

if (inBangkok && isSummer) {
print('The weather is amazing! 55');
} else if(inBangkok && isAnyOtherSeason) {
print('Torrential downpour.');
} else {
print ('Check the weather!');
}

.
7. การเขียน if แบบย่อ (ternary operator) ก็มีนะครับ คล้ายกันกับภาษาอื่นๆ

String loginStatus = user.isLogin == true ? 'success' : 'error';

.
8. การเขียน Loops ก็จะคล้ายกับภาษาอื่นๆ เช่นมี for, while, do while เป็นต้น ขอยกตัวอย่าง for-in ดังนี้

// for-in
var pets = ['OO', 'Duck', 'Yelly'];
for (var pet in pets) {
print(pet);
}

.
9. การนำ strings มาต่อหรือเชื่อมกัน (concatenate strings) ทำได้ดังนี้

String a = 'Bob';
String b = 'b';

var c1 = a + b; // ใช้เครื่อง +

var c2 = 'Hello $a and $b'; // ใช้ string interpolation (เครื่องหมาย $)

var c3 = 'a' 'b' 'c'; // ใช้การเว้นวรรคระหว่าง strings จะทำการต่อหรือเชื่อมอัตโนมัติ

var c4 = '${user.name}'; // ถ้าเป็น instance ให้ใส่ {} ครอบด้วย

.
10. การสร้าง string แบบหลายบรรทัด ให้ใช้ triple quote (พิมพ์ quote 3 ตัวติดกัน) หรือ double quotation marks (ฟันหนู 3 ตัวติดกัน) มาครอบ string ไว้ เช่น

var s1 = '''
บรรทัดที่ 1
บรรทัดที่ 2
บรรทัดที่ 3
''';

.
สำหรับคนที่อยากเขียน Flutter ก็ลองศึกษาภาษา Dart เพิ่มเติมได้นะครับ ที่เว็บ => https://dart.dev/

.
หรือถ้าใครอยากทดลองเขียนโดยไม่ต้องติดตั้ง ก็ไปที่เว็บ => https://dartpad.dev/

.
ลองศึกษาดูนะครับ
โค้ชเอก

Views: 7655

Flutter

Post navigation

Previous post
Next post

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Posts ล่าสุด

  • การใช้งาน Prefetching ใน Next.js
  • 14 ข้อคิด เพื่อการเป็น Developer ที่ดีขึ้น จาก “Lee Robinson”
  • เคยเจอ “TypeError: Cannot read property ‘x’ of undefined” หรือเปล่า
  • บันทึกการเขียนเว็บไซต์ใหม่ในรอบ 10 ปี ย้ายมาใช้ Next.js
  • ทำไมการจัดการ Error ใน JavaScript ถึงเป็นเรื่องท้าทาย?

Recent Comments

    หมวดหมู่

    • .NET
    • AI
    • Android
    • Angular
    • Angular 2
    • Coding
    • CSS
    • Database
    • Editor
    • Flutter
    • Git
    • HTML5
    • Ionic 2
    • Ionic 4
    • Ionic Framwork
    • JavaScript
    • Laravel
    • Laravel 5
    • Next.js
    • Node.js
    • PHP
    • PHP 7
    • Plugins
    • React
    • React Native
    • Template
    • Tools
    • TypeScript
    • UI
    • Uncategorized
    • Vue.js
    • XAMPP
    • Yii
    • คอร์สเรียน
    • แรงบันดาลใจ

    Archives

    • July 2025
    • April 2025
    • November 2024
    • October 2024
    • April 2020
    • February 2020
    • August 2019
    • September 2018
    • August 2018
    • February 2018
    • November 2017
    • October 2017
    • August 2017
    • July 2017
    • April 2017
    • October 2016
    • August 2016
    • May 2016

    Tags

    .NET android Angular Angular 2 Atom Coding Coding Standard CSS CSS 3 Datepicker Express.js extensions Git HTML HTML5 Ionic2 JavaScript Laravel5 laravel 5.5 MariaDB Material Design MySQL Node.js npm PHP PHP7 plugins PouchDB recaptcha Restful sail.js template typescript typscript XAMPP Yii2

    ผู้เยี่ยมชม

    • 0
    • 1,818,149
    • 547,558
    • 7,655
    ©2025 CodingThailand's Blog | WordPress Theme by SuperbThemes