Dart: Methods สำคัญที่ต้องรู้

5 min readAug 12, 2021

--

https://moisesbm.wordpress.com/2018/09/20/dart-lang-syntax-cheat-sheet/

สรุปให้ดังนี้คับ
1. forEach()
2. map()
3. contains()
4. sort()
5. reduce(), fold()
6. every()
7. where(), firstWhere(), singleWhere()
8. take(), skip()
9. List.from()
10. expand()
11. any()
12. removeWhere(), join()
13. clear()
14. generate()
15. indexOf(), indexWhere(), lastIndexOf(), lastIndexWhere()
16. elementAt()
17. asMap()
18. substring()

1. forEach()

สำหรับ forEach() นะคับ จะเหมือน loop for ทั่วไปคับ แต่จะช่วยให้เขียน code ได้สั้นลงเหลือเพียงบรรทัดเดียว

Runs a function on each element in the list

2. map()

ตัวนี้ผมว่าเจอเยอะเหมือนกันนะคับ ใช้ในการสร้าง (produce) หรือ แปลง (transform) แต่ละ element ให้ได้ค่าใหม่ขึ้นมา เช่น ในรูปเป็นการแปลงค่า List<String> ของ fruits เพื่อให้ได้ list ชุดใหม่ขึ้นมาที่ชื่อว่า mappedFruits.

Produces a new list after transforming each element in a given list

อีกตัวอย่างของการใช้ map เพื่อแปลงจาก List ให้เป็น String

ตัวอย่างของ Used case จริงกรณีต้องการนำค่า element ด้านใน List ออกมาแสดง

ต้องการนำค่า element ใน List ออกมาแสดงใน UI

แสดงตัวอย่างของการ .map() และแปลงค่า result แต่ละแบบ

ปกติ .map() จะ return ออกมาเป็น Iterable ที่เป็น Generic type แบบนี้ Iterable<T> กล่าวคือ เราจะสามารถแปลงให้เป็น type อะไรต่อไปก็ได้โดยใช้การ dot ต่อได้เลยซึ่งจะมี auto completion ให้เลือกใช้ได้อยู่แล้วเช่น

List => toList()
Set => toSet()
String => toString()
join String => join()

etc. แล้วแต่เรากำหนดได้เลย

3. contains()

ตัวนี้สิ่งที่ผมเข้าใจมาตลอดคือ ใช้ในการเช็คค่าใน List นะคับว่ามีไหม และ return ออกมาเป็น boolean.

Checks to confirm that the given element is in the list

4. sort()

สำหรับ method นี้ใช้ในการเรียงลำดับ element ใน List นะคับ โดยเราสร้างเงื่อนไขในการเรียงเองได้เลย

ใช้ sort() ในการเรียงค่าของตัวเลข โดยจับมา compart ทีละ 2 ตัว

Order the elements based on the provided *ordering* function

5. reduce(), fold()

ตัวนี้ถ้าแปลตามตัวเลยคือ การ reducts a collectionให้เหลือแค่ single value เท่านั้นโดยกระทำผ่าน given function ที่เรากำหนดไว้.

Compresses the elements to a single value, using the given function

6. every()

คือการตรวจสอบว่าทุกๆ elements ตรงตามเงื่อนไขที่เรากำหนดไว้ใน Anonymous function ไหม และ return ออกมาเป็น boolean

Confirms that every element satisfies the test

7. where(), firstWhere(), singleWhere()

คือ การตรวจสอบและ return a collection of elements ที่ตรงตามเงื่อนไข

ความแตกต่างของทั้ง 3 methods นี้คือ

where() : function return new List สำหรับทุก elements ที่ตรงตามเงื่อนไข (เอาง่ายๆก็คือ มันคือ filter() หรือ find()ใน javascript นั่นเองคับ
firstWhere(): function return แค่ element แรกที่ตรงตามเงื่อนไขเท่านั้น
singleWhere(): function return element แรกที่ตรงตามเงื่อนไขและต้องมีค่าที่ไม่ซ้ำกับ element อื่นใน list (ถ้ามีค่าที่ซ้ำกัน ก็จะ Error แบบข้างล่างนะ )

Uncaught Error: Bad state: Too many elements

Returns a collection of elements that satisfy a test.

อันนี้อีกตัวอย่างที่เปรียบเทียบระหว่าง where() กับ filter() ใน js นะคับ มันคือเรื่องเดียวกัน

firstWhere() returns the first match in the list, while singleWhere() returns the first match provided there is exactly one match.

8. take(), skip()

เป็น method ที่ระบุตำแหน่งของ element ใน List และ return ออกมาเป็น new List.

Returns a collection while including or skipping elements.

9. List.from()

เป็นการสร้าง new List จาก given collection.

Creates a new list from the given collection

10. expand()

สำหรับ method นี้จะเป็นการขยายแต่ละ elelment ให้เพิ่มขึ้น, หรือช่วยแบะแต่ละ element ออกมา (เอา List ชั้นในออกไป) ฟังไม่ผิดนะคับ ผมใช้คำว่า “แบะ” นั่นแหละ

Expands each element into zero or more elements

ใน used case จริงๆ อาจใช้กับ json response ที่เป็นลักษณะของ list ซ้อน list โดยภายในจะเป็น object, แต่เราต้องการ list แค่ชั้นเดียว ก็ใช้ expand() จัดการได้เลย

11. any()

method นี้ก็สำคัญนะคับ มันคือ some() ใน javascript เลย แต่ใน dart จะใช้ any() แทน กล่าวคือ มันจะเช็ค element ทุกตัวว่า มีตัวไหนไหม สักตัวนึงที่ตรงตามเงื่อนไข และ return ออกมาเป็น Boolean. (ตรงกันข้ามกับ every() ที่ทุก element ต้องตรงตามเงื่อนไข แต่ any() แค่ตัวใดตัวนึงใน element ก้พอ)

เปรียบเทียบ js and dart (some and any method)

ใน Used case ที่เราใช้งานจริง เช่น ต้องการ validate ว่าก่อนที่ user จะกดไป next state จะต้องมีการ check ที่ checkbox อย่างน้อย 1 อันก่อนนะ ไม่เช่นนั้นจะ raise Error ออกไป

Used case สำหรับการ **validate check box** นะ

12. removeWhere(), join()

สำหรับ removeWhere() จะเป็นการ remove ค่าใน list ที่ตรงตามเงื่อนไขนะคับ จิงๆ มันใช้กับ map ก้อได้นะ โดยจะลบ key/value ออกจาก map ถ้าตรงตามเงื่อนไข

user.removeWhere((key, value) => key == “lastName”);

ส่วน join() เป็นการ concat โดย seperator = “” นะคับ ซึ่งตัว seperator เราสามารถกำหนดเป็นอะไรก้อได้ โดยค่าที่ return ออกมาก้อยังเป็น String อยู่

numbers.removeWhere((e) => e == null); // อันนี้คือการ remove ค่าทั้งหมดที่เจอว่าเป็น null นั่นเอง โดย method นี้จิงๆมัน return เป็น void นะคับจึงไม่สามารถเอาตัวแปรมารับค่าได้ ถ้าต้องการรับค่าจึงต้องใช้ join มาช่วย และ return ออกมาเป็น StringList<String> name = ["Q", "is" , "Atthana"];
String joinName = name.join();
print(joinName);  // output = QisAtthana โดยค่าเป็น String type นะ

อันนี้เป็นการใช้ removeWhere() ร่วมกับ join() นะคับ

13. clear()

สำหรับ clear() method เป็นการเคลียร์ค่าทั้งหมดใน List หรือ Map ทั้งหมดเลยนะคับ ตามรุปข้างล่างเลย

เมื่อ clear() List จะได้ [ ], เมื่อ clear() Map จะได้ { }

14. generate()

สำหรับ generate() เราจะใช้กับ List โดยเป็นการสร้าง List ขึ้นมาจาก Length ที่เราระบุเข้าไป และต้องการจะ return อะไรก้อระบุเข้าไปเป็น function ได้เลย เช่น

generate() ต้องระบุ length และ function ที่จะให้ return ออกมาเป็น List

หรือ เราจะใช้ Dart’s Iterableในการ generate range ตั้งแต่ 0…n-1 ก็ได้ มีรูปแบบนี้

ใช้ Iterable.generate(range) แบบนี้เลยก็ได้ คล้ายๆกับ Python for i in range() เลย

15. indexOf(), indexWhere(), lastIndexOf(), lastIndexWhere()

ทั้งหมดนี้เป็นการหาค่า index จากค่าที่เราต้องการ โดยหาภายใน List
ถ้าพบว่ามีค่านั้นใน List จะ return ออกมากเป็น index ของค่านั้นๆในลิสต์
แต่ถ้าไม่พบค่านั้น จะ return ออกมาเป็น -1

เปรียบเทียบการใช้ method index() ที่มีใน List

อ่อ ใน .startsWith('Mit') เราสามารถระบุ pattern ที่เป็น RegExp แทนค่าคงที่ได้ด้วยนะ

https://www.kindacode.com/snippet/dart-flutter-get-the-index-of-a-specific-element-in-a-list/
Used case.

16. elementAt()

สำหรับ method นี้จะใช้กับ List ซึ่งเราจะต้องส่งค่า index ผ่าน argument เข้ามาด้วย เพื่อระบุว่าเป็น index ที่เท่าไหร่ใน List ซึ่งจริงๆแล้ว มีค่าเหมือนกับการเรียกการเรียกค่าจากใน List แบบปกติเลยนะ แบบนี้

List<String> number = ['zero', 'one', 'two', 'three'];print(number.elementAt(3));
  
print(number[3]);  // จะมีค่าเหมือนกันนะ print 2 บรรทัดนี้คือ 'three'

number.elementAt(0) = number.first //นั่นคือ จะได้ ‘zero’ นะ
number.elementAt(0) = number[0] // ก็ได้ ‘zero’ เหมือนกัน มีค่าเท่ากัน

ตัวอย่างของ used case เช่น ใช้ในการเลือก tab ของ Bottom navigation bar เมือมีการ tab ในแต่ละตำแหน่งก็ให้ส่งไล่ไปตั้งแต่ 0, 1, 2,… เป็นต้น

17. asMap()

สำหรับ method asMap() นี้ จะใช้ในกรณีที่เราต้องการ convert List to Map เพราะบางครั้งเราต้องการรู้ค่า index ในList แต่ไม่รู้ไง

วิธีการ get access to index คือให้ใช้ asMap() จะทำให้ได้ key ของ Map มาเป็นค่า index ที่เรียงตั้งแต่ 0 ขึ้นมาเลย แบบนี้

ตัวอย่างของ used case ที่นำไปใช้ เมื่อ List ที่เราเก็บข้อมูลไว้ไม่มี index แต่ต้องส่งค่า index เข้าไปใน api ด้วย จึงใช้ asMap() ต่อด้วย forEach เพื่อดึง index ออกมา