SOFTWARE DEVELOPMENT | 1 min read

Array Method in JavaScript

By Nan Chonthicha on 17 Jun 2020
sennalabs-blog-banner

สวัสดีเพื่อนๆทุกคนวันนี้เราจะมาทำเสนอ method ที่ใช้สำหรับการจัดการกับ array รู้ไว้จะทำให้งานเขียนโค้ดเร็วขึ้น 1000% แน่นอน ><~

 

1. Method ForEach

 

 

เรามาเริ่มกันที่ method ของเราตัวแรกของเราเลยดีกว่า นั่นคือ ForEach method ใช้สำหรับวนลูปเพื่อนำค่าใน Array แต่ละตัวมากระทำตามใน Function ที่เรากำหนดไว้ และไม่สามารถ return ค่าออกมาได้ จากตัวอย่างการเขียนโค้ดด้านบนเราได้ประกาศค่า peoples array แล้วนำไปใช้กับ Method ForEach และได้ทำการใช้ console.log() เพื่อแสดงผลลัพธ์ตามลำดับใน  peoples array สุดยอดไปเลยใช่มั้ย ^0^

 

2. Method Map

 

 

method ตัวที่สองคือ Map method สำหรับ Method Map นั้นจะคล้ายกับ ForEach คือค่าใน Array แต่ละตัวจะทำการนำไปผ่าน Function ที่เรากำหนดไว้ แต่ Map นั้น สามารถ return ค่าออกมาได้ จากตัวอย่างการเขียนโค้ดด้านบนเราได้ประกาศค่า numbers array แล้วนำไปใช้กับ Method map และได้ใส่เงื่อนไขในการวนลูปแต่ครั้ง number*2 ซึ่งจะทำให้ได้ผลลัพธ์ตามภาพตัวอย่างด้านบน

 

3. Filter method

 

 

method ตัวที่สามคือ Filter method สำหรับ Method Filter จะมีหน้าที่ไว้คัดกรองถ้าค่าใน Array ตามเงื่อนไขที่เรากำหนดไว้ใน Function ค่าที่ return ออกมาจะได้ค่า Array ที่เป็นผลลัพธ์ใหม่ จากตัวอย่างการเขียนโค้ดด้านบน เราได้ประกาศค่า peoples array แล้วนำไปใช้กับ Method Filter และได้ใสเงื่อนไขในการวนลูปแต่ครั้ง people.age >= 45 หากค่าของ array แต่ละตัวตรงตามเงื่อนไขจะ return true และเก็บค่านั้นไว้ในผลลัพธ์ ซึ่งจะทำให้ได้ผลลัพธ์ตามภาพตัวอย่างด้านบน

 

4. Find method

 

 

method ตัวที่สี่คือ Find method สำหรับ Method Find นั้นจะคล้ายกับ Method Filter แต่ต่างกันตรงที่ Method Find นั้น return เฉพาะผลลัพธ์ตัวแรกที่เจอตามเงื่อนไขที่เราได้กำหนดไว้ จากตัวอย่างการเขียนโค้ดด้านบน เราได้ประกาศค่า peoples array นำไปใช้กับ Method find และได้ใสเงื่อนไขในการวนลูปแต่ครั้ง people.age <= 18 หากค่าของ array ตัวใดตัวหนึ่งตรงตามเงื่อนไขจะ return ค่านั้นออกมาทันที

 

5.Every method

 

 

method ตัวที่ห้าคือ Every method สำหรับ Method Every จะเป็นการวนลูปเพื่อนำค่าที่ได้มากระทำกับ  function ที่เรากำหนดไว้ โดยจะ return ออกมาเป็น True หรือ False ซึ่ง Method Every จะนำค่าที่ได้นั่นมาต่อกันผ่าน Logical Operator And(&&) จากตัวอย่างการเขียนโค้ดด้านบน เราได้ประกาศค่า peoples array นำไปใช้กับ Method every และได้ใส่เงื่อนไขในการวนลูปแต่ละครั้ง  people.age >= 45  หาก array แต่ละตัวตรงตามเงื่อนไขจะ return true ถ้าไม่ตรงจะ return false และทำผลลัพธ์ที่ได้มา && And กัน

 

6. Some method 

 

 

สำหรับ method ตัวที่หกคือ Some method สำหรับ Method some จะทำงานคล้ายกับ method every ซึ่งจะ return True หรือ False เช่นกัน แต่จะเปลี่ยน Logical Operator จาก And(&&) เป็น Or (||) จากตัวอย่างการเขียนโค้ดด้านบนเราได้ประกาศค่า peoples array นำไปใช้กับ Method some และได้ใส่เงื่อนไขในการลบลูปแต่ละครั้ง  people.age >= 45  หาก array แต่ละตัวตรงตามเงื่อนไขจะ return true ถ้าไม่ตรงจะ return false และทำผลลัพธ์ที่ได้มา || Or กัน

 

7. Reduce method 

 

 

และสำหรับ method ตัวสุดท้าย นั่นก็คือ Reduce method สำหรับ Method Reduce นั้นจะทำหน้าที่รวมผลลัพธ์ โดยที่เราสามารถกำหนดค่าเริ่มต้นที่ใช้ในการรวมผลลัพธ์

 

เป็นอย่างไรบ้างเพื่อน ๆ จากตัวอย่าง method array ด้านบนที่เราได้ยกตัวอย่างมา หวังว่าจะเป็นประโยชน์กับเพื่อน ๆได้ไม่มากก็น้อย และเราเชื่อว่าต่อจากนี้ทุกคนจะเขียนโค้ดได้ดีขึ้นแน่นอนจ้า ^[   ]^!! สำหรับวันนี้ลาไปก่อนแล้วเจอกันอีกทีกระทู้หน้านะจ้ะ ^,~

 

 

Written By