搜尋
首頁web前端前端問答JavaScript循環有哪三種方法

JavaScript循環有哪三種方法

Nov 04, 2021 pm 03:25 PM
javascript循環

js的三種循環方法:1、while循環,語法「while(條件式){語句區塊}」;2、「do-while」循環,語法「do{語句區塊}while(條件表達式)」;3、for循環,語法「for(變數初始化;條件表達式;變數更新){語句區塊}」。

JavaScript循環有哪三種方法

本教學操作環境:windows7系統、javascript1.8.5版、Dell G3電腦。

我們在使用JavaScript時經常會遇到需要一遍一遍地運行相同程式碼,而這樣不浪費時間,還效率低下,使用循環是個明智的選擇,大大提高了效率,也減少了程式碼量。

JS中循環有三種:

1、while循環

2、do-while循環

3、for循環

一、while循環

1、while迴圈的語法結構:

while(条件表达式){
当条件表达式为布尔值true时要执行的语句块
}

2、while迴圈的應用

while循環常用於那種不知道循環次數是多少的情況,例如讓使用者循環輸入整數,直到輸入某個特殊的字元為止,你根本沒法直到這個循環會進行的次數。例如:

JavaScript循環有哪三種方法
JavaScript循環有哪三種方法

二、do…while

1、do…while的語法結構:

do{
条件表达式为true时执行的语句块
}while(条件表达式)

2、do… while的應用

do-while與while循環的不同之處在於:它先執行循環中的語句,然後再判斷表達式是否為真, 如果為真則繼續循環;如果為假, 則終止循環。因此, do-while迴圈至少要執行一次迴圈語句。如下:

JavaScript循環有哪三種方法

三、for 迴圈

1、for迴圈的語法結構:

for(变量初始化;条件表达式; 变量更新){
条件表达式为true时执行语句块
}

2、 for迴圈的應用

for迴圈多用於迴圈次數比較明確的情況,就是那種一眼就能看出來要迴圈幾次,比較直觀,for迴圈的第一句包含變數的初始化結束迴圈的條件以及每次更新的值,循環體內部才執行真正要做的事情。例如for(n=1;n

JavaScript循環有哪三種方法

3、for迴圈的變形

  • #for-in---迴圈遍歷物件的屬性

  • forEach---ES5引進新迴圈

  • for-of---ES6新引入迴圈

##四、比較三者的區別

1、while是先判斷條件,後執行循環主體,如果初始條件不滿足,while循環主體不執行(先判斷後執行)

2、do-while是先執行迴圈主體後判斷條件,不管條件滿不滿足都先執行迴圈主體一次。 (先執行後判斷)

3、for是先判斷條件,後執行迴圈主體,大體上和while相似,在迴圈次數確定的情況上用for。

【推薦學習:

javascript進階教學#

以上是JavaScript循環有哪三種方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
React強大的社區和生態系統的好處React強大的社區和生態系統的好處Apr 29, 2025 am 12:46 AM

React'sstrongCommunityAndecoSystemoffernumerBeneFits:1)age awealthoflibrariesandgithub; 2)AwealthoflibrariesandTools,sustasuicomponentLibontlibemontLibrariesLikeChakaAkraUii; 3)

反應移動開發的本地:構建跨平台應用程序反應移動開發的本地:構建跨平台應用程序Apr 29, 2025 am 12:43 AM

ReactNativeischosenformobiledevelopmentbecauseitallowsdeveloperstowritecodeonceanddeployitonmultipleplatforms,reducingdevelopmenttimeandcosts.Itoffersnear-nativeperformance,athrivingcommunity,andleveragesexistingwebdevelopmentskills.KeytomasteringRea

用react中的usestate()正確更新狀態用react中的usestate()正確更新狀態Apr 29, 2025 am 12:42 AM

在React中正確更新useState()狀態需要理解狀態管理的細節。 1)使用函數式更新來處理異步更新。 2)創建新狀態對像或數組來避免直接修改狀態。 3)使用單一狀態對像管理複雜表單。 4)使用防抖技術優化性能。這些方法能幫助開發者避免常見問題,編寫更robust的React應用。

React的基於組件的體系結構:可擴展UI開發的關鍵React的基於組件的體系結構:可擴展UI開發的關鍵Apr 29, 2025 am 12:33 AM

React的組件化架構通過模塊化、可重用性和可維護性使得可擴展UI開髮變得高效。 1)模塊化允許UI被分解成可獨立開發和測試的組件;2)組件的可重用性在不同項目中節省時間並保持一致性;3)可維護性使問題定位和更新更容易,但需避免組件過度複雜和深度嵌套。

用反應的聲明性編程:簡化UI邏輯用反應的聲明性編程:簡化UI邏輯Apr 29, 2025 am 12:06 AM

在React中,聲明式編程通過描述UI的期望狀態來簡化UI邏輯。 1)通過定義UI狀態,React會自動處理DOM更新。 2)這種方法使代碼更清晰、易維護。 3)但需要注意狀態管理複雜性和優化重渲染。

React的生態系統的大小:瀏覽複雜的景觀React的生態系統的大小:瀏覽複雜的景觀Apr 28, 2025 am 12:21 AM

TonavigateReact'scomplexecosystemeffectively,understandthetoolsandlibraries,recognizetheirstrengthsandweaknesses,andintegratethemtoenhancedevelopment.StartwithcoreReactconceptsanduseState,thengraduallyintroducemorecomplexsolutionslikeReduxorMobXasnee

React如何使用密鑰有效地識別列表項目React如何使用密鑰有效地識別列表項目Apr 28, 2025 am 12:20 AM

RectuseSkeyStoeficelyListifyListIdifyListItemsbyProvidistableIdentityToeachelement.1)keysallowReaeActTotRackChangEsInListSwithouterSwithoutreThoutreTheenteringTheEntirelist.2)selectuniqueandstablekeys,避免使用

在React中調試與密鑰相關的問題:識別和解決問題在React中調試與密鑰相關的問題:識別和解決問題Apr 28, 2025 am 12:17 AM

KeysinrectarecrucialforOptimizingTherEnderingProcessandManagingDynamicListSefectefection.tospotaTandFixKey與依賴的人:1)adduniqueKeykeystoliquekeystolistItemStoAvoidWarningSwarningSwarningSwarningSperformance和2)useuniqueIdentifiersIdentifiersIdentifiersIdentifiersFromdatainSteAtofIndicessuessuessessemessuessessemessemessemesseysemessekeys,3)

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

這個專案正在遷移到osdn.net/projects/mingw的過程中,你可以繼續在那裡關注我們。 MinGW:GNU編譯器集合(GCC)的本機Windows移植版本,可自由分發的導入函式庫和用於建置本機Windows應用程式的頭檔;包括對MSVC執行時間的擴展,以支援C99功能。 MinGW的所有軟體都可以在64位元Windows平台上運作。

SublimeText3 英文版

SublimeText3 英文版

推薦:為Win版本,支援程式碼提示!

SublimeText3 Linux新版

SublimeText3 Linux新版

SublimeText3 Linux最新版

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

Atom編輯器mac版下載

Atom編輯器mac版下載

最受歡迎的的開源編輯器