การใช้งาน interval ใน javascript สำหรับการนำมา Loop การทำงานเป็น loop

jQuery & Ajax Knowledge ความรู้เกี่ยวกับ Javascript , jQuery และ Ajax

Moderator: mindphp, ผู้ดูแลกระดาน

ภาพประจำตัวสมาชิก
ewqolf
PHP Super Hero Member
PHP Super Hero Member
โพสต์: 621
ลงทะเบียนเมื่อ: 14/11/2022 9:26 am

การใช้งาน interval ใน javascript สำหรับการนำมา Loop การทำงานเป็น loop

โพสต์ที่ยังไม่ได้อ่าน โดย ewqolf »

การใช้งาน interval ใน javascript สำหรับการนำมา Loop การทำงานเป็น loop นั้นใน javascript นั้นจะมีการทำ loop แบบที่ไม่รู้จบอยู่ครับซึ่งการทำ loop แบบนั้นเราจะใช้งาน Interval interval นั้นเป็นคำสั่งคำสั่ง นึงที่สามารถใช้งานสำหรับการ loop โค้ดส่วนนึงได้โดยไม่จำกัดครั้ง โดยส่วนมาก loop ของเรานั้นจะทำ loop ไปเรื่อยๆจนถึงจุดสิ้นสุดของโค้ดซึ่งการทำงานแบบนั้นเราจำเป็นจะต้องทำการกำหนดจำนวนรอบภายใน Loop เอาไว้อย่างชัดเจนและจากนั้นถ้าหากว่าไม่ทำให้จบใน Loop นั้นโค้ดส่วนต่อไปก็จะยังทำงานต่อไปไม่ได้จนกว่าจะจบ loop แต่ไม่ใช่กับ interval ครับ

interval นั้นจะอธิบายง่ายนั้นก็คือ Loop ที่เราไม่จำเป็นจะต้องทำ loop ก่อนซึ่งข้อดีนั้นก็คือเราสามารถเขียนให้ interval นั้นดีเลย์ระหว่างแต่ละรอบของการวนแต่ละรอบได้ ซึ่งเราสามารถใช้งานได้ง่ายๆเลยเพียงแค่เรานั้นจะต้องตั้งชื่อตัว Interval ก่อนครับเหมือนกับประกาศตัวแปรเลย จากนั้นเราจะมากำหนดโค้ดในส่วนที่จะทำงานกันครับ

โค้ด: เลือกทั้งหมด

<script>
	var intervalId1
	intervalId1 = setInterval(() => {
	console.log("helloworld")
	}, 1000);
</script>
จากโค้ดนี้เป็นโค้ดที่ใช้สำหรับการสร้าง interval จะเห็นได้ว่าผมได้ทำการสร้างตัวแปร intervalid1 ขึ้นมาจากนั้น setinterval ขึ้นมาครับผม แล้วต่อจากนี้ในวงเล็บปีกกา {} ทั้งหมดนั้นจะเป็นโค้ดที่จะทำ Loop ซึ้งในที่นี้ผมจะทำการ print helloworld ออกมา และจากนั้นทุกๆ 1000 millisecond หรือก็คือ 1 วินาทีครับ ซึ่งตรงนี้เราสามารถปรับไปมาได้ครับโดยหลักของเวลานั้นเป็นหลังก millisecond หรือก็คือ 1000 = 1 วินาทีครับและจากนั้นมันก็จะทำการ Loop คำว่า helloworld ออกเรื่อยๆทุกๆ 1 วินาทีครับ
ผลลัพธ์การ intarval
ผลลัพธ์การ intarval
ผลลัพธ์การ intorval.gif (7.34 KiB) Viewed 1229 times
ซึ่งจากภาพก็จะเห็นได้ว่า helloworld นั้นจะถูกแสดงออกมาในทุกๆ 1 วินาทีครับ ซึ่งถ้าหากว่าสงสัยว่าเรานั้นจะหยุด interval ยังไงดีนั้นเรานั้นจำเป็นจะต้อง clear interval เพื่อหยุดเท่านั้นครับ

โค้ด: เลือกทั้งหมด

clearInterval(intervalId1);
และเพียงแค่เราใช้งานโค้ดในส่วนนี้รันตัว ืะำพอฟส ี่เราสร้างมาเป็นตัวแปรไว้ตั้งแต่แรกที่ใช้ชื่อว่า intervalId1 นั้นจะหยุดทำงานครับผม

ซึ่งจากในกระทู้นี้จะเป็นการสอนการใช้งาน Interval ที่เอาไว้ใช้สำหรับการสร้าง loop โค้ดออกมาเรื่อยๆโดยที่เรานั้นไม่จำเป็นจะต้องกำหนดจำนวนรอบได้ซึ่งเหมาะกับการทำงานประเภทการจับเวลาหรือก็ส่งข้อมูลเป็นรอบๆอย่างไม่มีที่สิ้นสุดอย่างแน่นอนได้ครับอีกทั้งยังสามารถทำงานไปควบคู่กับโค้ดส่วนอื่นได้โดยที่การทำงานของ interval นั้นจะไม่ทำให้เกิดการหยุดรอครับหรือก็คือโค้ดนั้นจะทำงานยไปพร้อมกันได้โดยไม่ต้องหยุดรอจนกว่าเราจะทำ loop เสร็จครับ อีกทั้งยังสอนวิธีการ clear Interval อีกด้วยครับ

อ้างอิง
https://www.w3schools.com/jsref/met_win_setinterval.asp
https://developer.mozilla.org/en-US/docs/Web/API/setInterval
https://www.w3schools.com/JSREF/met_win_clearinterval.asp
คนจะตายเมื่อถูกฆ่า...ขอบคุณครับ
  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ผู้ใช้งานขณะนี้

สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 63