JavaScript時間事件:setTimeout和setInterval

Programmers use timing events to delay the execution of certain code, or to repeat code at a specific interval.

程序員使用時序事件來延遲某些代碼的執行,或以特定的時間間隔重復代碼。

There are two native functions in the JavaScript library used to accomplish these tasks: setTimeout() and setInterval().

JavaScript庫中有兩個用于完成這些任務的本機函數: setTimeout()setInterval()

setTimeout (setTimeout)

setTimeout() is used to delay the execution of the passed function by a specified amount of time.

setTimeout()用于將傳遞的函數的執行延遲指定的時間。

There are two parameters that you pass to setTimeout(): the function you want to call, and the amount of time in milliseconds to delay the execution of the function.

傳遞給setTimeout()參數有兩個:要調用的函數,以及延遲該函數執行的時間(以毫秒為單位)。

Remember that there are 1000 milliseconds (ms) in a 1 second, so 5000 ms is equal to 5 seconds.

請記住,一秒內有1000毫秒(ms),因此5000毫秒等于5秒。

setTimeout() will execute the function from the first argument one time after the specified time has elapsed.

在指定的時間過去之后, setTimeout()將從第一個參數開始執行函數。

Example:

例:

let timeoutID;function delayTimer() {timeoutID = setTimeout(delayedFunction, 3000);
}function delayedFunction() {alert(“Three seconds have elapsed.”);
}

When the delayTimer function is called it will run setTimeout. After 3 seconds (3000 ms) pass, it will execute delayedFunction which will send an alert.

調用delayTimer函數時,它將運行setTimeout 。 經過3秒鐘(3000毫秒)后,它將執行delayedFunction ,它將發送警報。

setInterval

setInterval

Use setInterval() to specify a function to repeat with a time delay between executions.

使用setInterval()可以指定一個函數,該函數在兩次執行之間會有時間延遲。

Again, two parameters are passed to setInterval(): the function you want to call, and the amount of time in milliseconds to delay each call of the function .

同樣,將兩個參數傳遞給setInterval() :您要調用的函數,以及延遲該函數每次調用的時間(以毫秒為單位)。

setInterval() will continue to execute until it is cleared.

setInterval()將繼續執行,直到將其清除。

Example:

例:

let intervalID;function repeatEverySecond() {intervalID = setInterval(sendMessage, 1000);
}function sendMessage() {console.log(“One second elapsed.”);
}

When your code calls the function repeatEverySecond it will run setInterval. setInterval will run the function sendMessage every second (1000 ms).

當您的代碼調用函數repeatEverySecond ,它將運行setIntervalsetInterval將每秒(1000 ms)運行一次sendMessage函數。

clearTimeout和clearInterval (clearTimeout and clearInterval)

There are also corresponding native functions to stop the timing events: clearTimeout() and clearInterval().

還有相應的本機函數來停止計時事件: clearTimeout()clearInterval()

You may have noticed that each timer function above is saved to a variable. When either the setTimeout or setInterval function runs, it is assigned a number which is saved to this variable. Note that JavaScript does this all in the background.

您可能已經注意到上面的每個計時器功能都保存到一個變量中。 當setTimeoutsetInterval函數運行時,將為其分配一個數字,該數字將保存到該變量中。 請注意,JavaScript會在后臺完成所有操作。

This generated number is unique for each instance of timers. This assigned number is also how timers are identified when you want to stop them. For this reason, you must always set your timer to a variable.

對于每個計時器實例,此生成的編號都是唯一的。 當您要停止計時器時,此分配的編號也是如何標識計時器的。 因此,您必須始終將計時器設置為變量。

For clarity of your code, you should always match clearTimeout() to setTimeout() and clearInterval() to setInterval().

為了使代碼清晰,應始終將clearTimeout()setTimeout()匹配,并將clearInterval()setInterval()匹配。

To stop a timer, call the corresponding clear function and pass it the timer ID variable that matches the timer you wish to stop. The syntax for clearInterval() and clearTimeout() are the same.

要停止計時器,請調用相應的清除函數,并將與您要停止的計時器相匹配的計時器ID變量傳遞給它。 clearInterval()clearTimeout()的語法相同。

Example:

例:

let timeoutID;function delayTimer() {timeoutID = setTimeout(delayedFunction, 3000);
}function delayedFunction() {alert(“Three seconds have elapsed.”);
}function clearAlert() {clearTimeout(timeoutID);
}

翻譯自: https://www.freecodecamp.org/news/javascript-timing-events-settimeout-and-setinterval/

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/390708.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/390708.shtml
英文地址,請注明出處:http://en.pswp.cn/news/390708.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

webservice 基本要點

webservice的特點 webservices是自我包含的 webservices是自我描述的 webservices是跨平臺和語言的 webservices是基于開放和標準的 webservices是可以組合的 webservices是松散耦合的 webservices提供編程訪問的能力 webservices通過網絡進行發布,查找和使用 發布w…

文本數據可視化_如何使用TextHero快速預處理和可視化文本數據

文本數據可視化自然語言處理 (Natural Language Processing) When we are working on any NLP project or competition, we spend most of our time on preprocessing the text such as removing digits, punctuations, stopwords, whitespaces, etc and sometimes visualizati…

Less變量

Less變量 定義變量 Less 中的變量和其他編程語言一樣,可以實現值的復用,同樣它也有作用域(scope)。簡單的講,變量作用域就是局部變量和全局變量的概念。 Less 中,變量作用域采用的是就近原則,換…

漸進式web應用程序_如何在漸進式Web應用程序中添加到主屏幕

漸進式web應用程序添加到主屏幕 (Add To Homescreen) Here the web app install banner is focused on web app, with the feature of add to homescreen.在此,Web應用程序安裝標語專注于Web應用程序,具有添加到主屏幕的功能。 瀏覽器對“添加到主屏幕”…

linux shell 編程

shell的作用 shell是用戶和系統內核之間的接口程序shell是命令解釋器 shell程序 Shell程序的特點及用途: shell程序可以認為是將shell命令按照控制結構組織到一個文本文件中,批量的交給shell去執行 不同的shell解釋器使用不同的shell命令語法 shell…

Leetcode之javascript解題(No33-34)

附上我的github倉庫,會不斷更新leetcode解題答案,提供一個思路,大家共勉 在我的主頁和github上可以看到更多的關于leetcode的解題報告!(因為不知道為什么掘金沒有將其發布出來,目前已經聯系掘金客服&#x…

真實感人故事_您的數據可以告訴您真實故事嗎?

真實感人故事Many are passionate about Data Analytics. Many love matplotlib and Seaborn. Many enjoy designing and working on Classifiers. We are quick to grab a data set and launch Jupyter Notebook, import pandas and NumPy and get to work. But wait a minute…

轉:防止跨站攻擊,安全過濾

轉:http://blog.csdn.net/zpf0918/article/details/43952511 Spring MVC防御CSRF、XSS和SQL注入攻擊 本文說一下SpringMVC如何防御CSRF(Cross-site request forgery跨站請求偽造)和XSS(Cross site script跨站腳本攻擊)。 說說CSRF 對CSRF來說,其實Spring…

Linux c編程

c語言標準 ANSI CPOSIX(提高UNIX程序可移植性)SVID(POSIX的擴展超集)XPG(X/Open可移植性指南)GNU C(唯一能編譯Linux內核的編譯器) gcc 簡介 名稱: GNU project C an…

html怎么注釋掉代碼_HTML注釋:如何注釋掉您HTML代碼

html怎么注釋掉代碼HTML中的注釋 (Comments in HTML) The comment tag is an element used to leave notes, mostly related to the project or the website. This tag is frequently used to explain something in the code or leave some recommendations about the project.…

k均值算法 二分k均值算法_使用K均值對加勒比珊瑚礁進行分類

k均值算法 二分k均值算法Have you ever seen a Caribbean reef? Well if you haven’t, prepare yourself.您見過加勒比礁嗎? 好吧,如果沒有,請做好準備。 Today, we will be answering a question that, at face value, appears quite sim…

您好,這是我的第一篇文章

您好我是CYL 這是一個辣雞博客 歡迎指教 轉載于:https://www.cnblogs.com/pigba/p/8823472.html

08_MySQL DQL_SQL99標準中的多表查詢(內連接)

# sql99語法/*語法: select 查詢列表 from 表1 別名 【連接類型】 join 表2 別名 on 連接條件 【where 篩選條件】 【group by 分組】 【having 分組后篩選】 【order by 排序列表】分類內連接(重點): inner外連接 左外&#xff0…

java中抽象類繼承抽象類_Java中的抽象類用示例解釋

java中抽象類繼承抽象類Abstract classes are classes declared with abstract. They can be subclassed or extended, but cannot be instantiated. You can think of them as a class version of interfaces, or as an interface with actual code attached to the methods.抽…

新建VUX項目

使用Vue-cli安裝Vux2 特別注意配置vux-loader。來自為知筆記(Wiz)

衡量試卷難度信度_我們可以通過數字來衡量語言難度嗎?

衡量試卷難度信度Without a doubt, the world is “growing smaller” in terms of our access to people and content from other countries and cultures. Even the COVID-19 pandemic, which has curtailed international travel, has led to increasing virtual interactio…

Linux 題目總結

守護進程的工作就是打開一個端口,并且等待(Listen)進入連接。 如果客戶端發起一個連接請求,守護進程就創建(Fork)一個子進程響應這個連接,而主進程繼續監聽其他的服務請求。 xinetd能夠同時監聽…

《精通Spring4.X企業應用開發實戰》讀后感第二章

一、配置Maven\tomcat https://www.cnblogs.com/Miracle-Maker/articles/6476687.html https://www.cnblogs.com/Knowledge-has-no-limit/p/7240585.html 二、創建數據庫表 DROP DATABASE IF EXISTS sampledb; CREATE DATABASE sampledb DEFAULT CHARACTER SET utf8; USE sampl…

換了電腦如何使用hexo繼續寫博客

前言 我們知道,使用 Githubhexo 搭建一個個人博客確實需要花不少時間的,我們搭好博客后使用的挺好,但是如果我們有一天電腦突然壞了,或者換了系統,那么我們怎么使用 hexo 再發布文章到個人博客呢? 如果我們…

leetcode 525. 連續數組

給定一個二進制數組 nums , 找到含有相同數量的 0 和 1 的最長連續子數組,并返回該子數組的長度。 示例 1: 輸入: nums [0,1] 輸出: 2 說明: [0, 1] 是具有相同數量 0 和 1 的最長連續子數組。 示例 2: 輸入: nums [0,1,0] 輸出: 2 說明: [0, 1] (或 [1, 0]) 是…