การหน่วงเวลาเพื่อการดำเนินการใน JavaScript

ตอนนี้เรามาทำความเข้าใจฟังก์ชัน setTimeout ซึ่งช่วยให้สามารถหน่วงเวลา ก่อนที่จะรันโค้ด ความล่าช้านี้แตกต่างจาก ฟังก์ชัน setInterval คือจะเกิดขึ้นเพียงครั้งเดียว

พารามิเตอร์แรก setTimeout รับ โค้ดต้นฉบับของฟังก์ชัน และตัวที่สองคือเวลาหน่วง ในหน่วยมิลลิวินาทีก่อนที่จะเรียกใช้ฟังก์ชันนั้น

เรามาดูการทำงานของฟังก์ชันจากตัวอย่าง สมมติว่าเรามีปุ่มแบบนี้:

<input type="submit" id="elem">

รับลิงก์ไปยัง ปุ่มของเราในตัวแปร:

let elem = document.querySelector('#elem');

ตอนนี้มาทำให้เมื่อกด ปุ่ม จะมี alert แสดงบนหน้าจอ แต่ไม่ใช่ทันที แต่จะแสดงหลังจากกดไปแล้ว 3 วินาที:

elem.addEventListener('click', function() {
	setTimeout(function() {
		alert('!');
	}, 3000);
});

กำหนดให้มีย่อหน้า เขียนโค้ดที่แสดง ข้อความในย่อหน้านี้ผ่านไป 10 วินาที หลังจากโหลดหน้าเว็บ