Hướng dẫn dùng nreak JavaScript

Nội dung chính

  • Lệnh break trong JavaScript
  • Sử dụng lệnh break để thoát khỏi vòng lặp while trong JavaScript
  • Sử dụng lệnh break để thoát khỏi vòng lặp for trong JavaScript
  • Tổng kết

Hướng dẫn cách sử dụng lệnh break trong JavaScript. Bạn sẽ học được cách dùng lệnh break để thoát khỏi vòng lặp trong JavaScript sau bài học này.

Lệnh break trong JavaScript

Lệnh break trong JavaScript được sử dụng để thoát khỏi vòng lặp trong JavaScript khi điều kiện chỉ định được thỏa mãn. Các vòng lặp trong JavaScript như vòng lặp while hoặc vòng lặp for sẽ buộc phải kết thúc khi câu lệnh break được thực thi.

Cú pháp của lệnh break trong JavaScript như sau:

break;

Câu lệnh break trong JavaScript được sử dụng kết hợp với câu lệnh if trong JavaScript và được miêu tả trong khối lệnh while hoặc khối lệnh for giống như sau đây:

while (biểu thức điều kiện while) {
    Câu lệnh 1 ;
    Câu lệnh 2 ;
    if (biểu thức điều kiện if){
        break;
        }
}

Để hiểu rõ hơn, chúng ta sẽ sử dụng lại ví dụ trong bài While trong JavaScript và cách xử lý chi tiết. Chúng ta có một vòng lặp while để in ra màn hình 3 lần dòng hello như sau:

let i = 1;
while(i < 4){
console.log("hello " + i);
i += 1;
}
console.log('bye');





Chúng ta sẽ dùng lệnh break để dừng vòng lặp while tại vòng lặp thứ 2 khi i=2 như sau:

let i = 1;
while(i < 4){
if (i == 2){
console.log("BREAK!");
i += 1;
break;
}
console.log("hello " + i)
i += 1;
}
console.log('bye');

Khi đó vòng lặp while break trong JavaScript sẽ chạy như sau:
Lượt lặp đầu tiên:

  1. Khai báo biến i và gán giá trị ban đầu i = 1
  2. Biểu thức điều kiện i < 3 là TRUE nên thực thi vòng lặp
  3. Biểu thức điều kiện IF i == 2 là là False nên khối lệnh if (chứa lệnh break) được bỏ qua
  4. Chạy lệnh console.log("hello " + i); trong khối lệnh
  5. Biểu thức thay đổi tăng giá trị i lên 1 đơn vị thành i=2

Lượt lặp thứ 2:

  1. Biểu thức điều kiện For (i < 3) là TRUE nên thực thi vòng lặp
  2. Biểu thức điều kiện IF i == 2 là True nên các lệnh trong khối if (bao gồm cả lệnh break) được thực thi. Do lệnh break được chạy nên vòng lặp bị dừng lại và chúng ta thoát khỏi vòng lặp.

Ngoài vòng lặp:

  1. Chạy lệnh tiếp theo console.log('bye') sau khi thoát vòng lặp.

Kết quả, vòng lặp while ở trên sẽ in ra màn hình console như sau:

hello 1
BREAK!
bye

Chúng ta có thể khái quát xử lý bằng sơ đồ khối của lệnh break trong JavaScript khi sử dụng trong vòng lặp while như sau:

Hướng dẫn dùng nreak JavaScript

Sử dụng lệnh break để thoát khỏi vòng lặp while trong JavaScript

Chúng ta sử dụng lệnh break để thoát khỏi vòng lặp while trong JavaScript theo điều kiện mà bạn muốn. Lệnh while sẽ dừng lại khi lệnh break được thực hiện, tất cả các xử lý sau lệnh break cũng như các lượt lặp còn lại trong lệnh while đều bị dừng giữa chừng.

Hãy xem ví dụ về vòng lặp while để in ra các số từ 1 đến 10. Nếu không sử dụng lệnh break thì chương trình sẽ chạy như sau:

let num = 1;

while (num <= 10){
console.log(num);
num++;
}










Tuy nhiên khi chúng ta sử dụng thêm lệnh break và muốn dừng vòng lặp khi biến num đạt giá trị bằng 2, chương trình sẽ chạy như sau:

let num = 1;

while (num <= 10){
console.log(num);
if(num == 2){
console.log("BREAK!");
break;
}
num++ ;
}



Bạn có thể thấy chúng ta đã thoát khỏi vòng lặp trong JavaScript bằng lệnh break tại vị trí num ==2 rồi phải không nào?

Về cách sử dụng vòng lặp while, hãy xem chi tiết tại bài viết Vòng lặp while trong JavaScript

Lại nữa, câu lệnh break cũng thường được sử dụng kết hợp với vòng lặp while true để thoát khỏi một vòng lặp vô hạn trong JavaScript. Ví dụ:

let num = 1;

while (true){
console.log(num);
if(num == 10){
break;
}
num++
}










Sử dụng lệnh break để thoát khỏi vòng lặp for trong JavaScript

Chúng ta sử dụng lệnh break để thoát khỏi vòng lặp for trong JavaScript theo điều kiện mà bạn muốn. Lệnh for sẽ dừng lại khi lệnh break được thực hiện, tất cả các xử lý sau lệnh break cũng như các lượt lặp còn lại trong lệnh for đều bị dừng giữa chừng.

Ví dụ, chúng ta dừng lệnh tính tổng một dãy số nguyên dương nhỏ hơn 100 khi tổng đó lớn hơn 10 như sau:

let sum = 0;
for (let i = 1; i <=100; i++){
sum += i ;
if (sum >= 10){
break;
}
console.log(sum);
}



Về cách sử dụng vòng lặp for, hãy xem chi tiết tại bài viết Vòng lặp for trong JavaScript

Tổng kết

Trên đây Kiyoshi đã hướng dẫn bạn về cách sử dụng lệnh break trong JavaScript rồi. Để nắm rõ nội dung bài học hơn, bạn hãy thực hành viết lại các ví dụ của ngày hôm nay nhé.

Và hãy cùng tìm hiểu những kiến thức sâu hơn về JavaScript trong các bài học tiếp theo.

Viết bởi Kiyoshi. Đã đăng ký bản quyền tác giả tại &lt;a title="Bạn được tự do chia sẻ bài viết nhưng phải để lại đường link bài viết từ laptrinhcanban.com. Bạn không được sử dụng tài liệu cho mục đích thương mại. Không được phép chỉnh sửa nội dung được phát hành trên website của chúng tôi" style="color:#fff;background-color:silver" rel="license noopener" target="_blank" href="https://creativecommons.org/licenses/by-nc-nd/4.0/"&gt;Creativecommons&lt;/a&gt;&amp;nbsp;và &lt;a title="Bạn được tự do chia sẻ bài viết nhưng phải để lại đường link bài viết từ laptrinhcanban.com. Bạn không được sử dụng tài liệu cho mục đích thương mại. Không được phép chỉnh sửa nội dung được phát hành trên website của chúng tôi" style="color:#fff;background-color:silver" target="_blank" rel="noopener" href="https://www.dmca.com/Protection/Status.aspx?ID=1631afcd-7c4a-467d-8016-402c5073e5cd" class="dmca-badge"&gt;DMCA&lt;/a&gt;&lt;script src="https://images.dmca.com/Badges/DMCABadgeHelper.min.js"&gt;</p><h3 style="font-size:15px">Bài viết liên quan</h3><ul class="popular-posts"><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/for-in-trong-javascript/" title="for...in trong JavaScript và cách lấy thuộc tính từ đối tượng" rel="bookmark">for...in trong JavaScript và cách lấy thuộc tính từ đối tượng</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/do-while-trong-javascript/" title="do...while trong JavaScript và vòng lặp có ít nhất 1 lần chạy" rel="bookmark">do...while trong JavaScript và vòng lặp có ít nhất 1 lần chạy</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/for-trong-javascript/" title="For trong JavaScript và vòng lặp với số lần cụ thể" rel="bookmark">For trong JavaScript và vòng lặp với số lần cụ thể</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/lenh-continue-trong-javascript/" title="Continue trong JavaScript và cách bỏ qua vòng lặp" rel="bookmark">Continue trong JavaScript và cách bỏ qua vòng lặp</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/vong-lap-vo-han-trong-javascript/" title="Vòng lặp vô hạn trong JavaScript" rel="bookmark">Vòng lặp vô hạn trong JavaScript</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/for-of-trong-javascript/" title="for...of trong JavaScript và cách lấy giá trị từ đối tượng" rel="bookmark">for...of trong JavaScript và cách lấy giá trị từ đối tượng</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/for-long-trong-javascript/" title="For lồng (for trong for) trong JavaScript" rel="bookmark">For lồng (for trong for) trong JavaScript</a></h3></div></li><li class="popular-posts-item"><div class="popular-posts-title"><h3><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/while-trong-javascript/" title="While trong JavaScript và vòng lặp không giới hạn số lần" rel="bookmark">While trong JavaScript và vòng lặp không giới hạn số lần</a></h3></div></li></ul></div><div id="keugoi"><span>Hãy chia sẻ và cùng lan tỏa kiến thức lập trình Nhật Bản tại Việt Nam!</span></div><section class="icon-bar-2" style="border-bottom:dotted grey .3px!important"><a target="_blank" title="chia sẻ qua facebook" rel="noopener noreferrer" href="https://www.facebook.com/sharer/sharer.php?u=https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/lenh-break-trong-javascript/" class="facebook"><i class="fa fa-facebook"></i></a> <a target="_blank" rel="noopener noreferrer" href="https://twitter.com/intent/tweet?url=https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/lenh-break-trong-javascript/" title="chia sẻ qua twitter" class="twitter"><i class="fa fa-twitter"></i></a> <a target="_blank" rel="noopener noreferrer" href="https://getpocket.com/edit?url=https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/lenh-break-trong-javascript/" title="chia sẻ qua pocket" class="pocket"><i class="fa fa-get-pocket"></i></a> <span class="zalo-share-button" title="chia sẻ qua zalo" style="margin-left:18px;margin-bottom:-3px" data-href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/lenh-break-trong-javascript/" data-oaid="579745863508352884" data-layout="3" data-color="blue" data-customize="false"></span></section><p class="ico-folder"><a target="_blank" href="https://laptrinhcanban.com/"><span itemprop="HOME">HOME</span></a><span class="sya"></span>&gt;&gt; <a target="_blank" class="article-category-link" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/">học javascript - lập trình javascript cơ bản</a>&gt;&gt;<a target="_blank" class="article-category-link" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/">05. vòng lặp trong javascript</a></p><nav id="article-nav"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/while-trong-javascript/" id="article-nav-older" class="article-nav-link-wrap" style="float:left;text-align:right;padding-right:20px"><strong class="article-nav-caption">Bài sau</strong><div class="article-nav-title">While trong JavaScript và vòng lặp không giới hạn số lần</div></a><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/vong-lap-trong-javascript/lenh-continue-trong-javascript/" id="article-nav-newer" class="article-nav-link-wrap" style="float:right;text-align:left;padding-left:20px"><strong class="article-nav-caption">Bài tiếp</strong><div class="article-nav-title">Continue trong JavaScript và cách bỏ qua vòng lặp</div></a><span id="ezoic-pub-ad-placeholder-611" class="ezoic-adpicker-ad"></span></nav><div id="recent_posts_down"><div class="widget_athemes_tabs"><ul id="widget-tab" class="clearfix widget-tab-nav"><li class="active">Bài viết mới nhất</li></ul><div class="widget"><ul><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/lam-tron-so-trong-javascript/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban46.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/lam-tron-so-trong-javascript/">Làm tròn số trong JavaScript (Math.round, Math.ceil, Math.floor)</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/so-mu-trong-javascript/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban45.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/so-mu-trong-javascript/">Số mũ trong JavaScript (Math.pow, Math.exp)</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/math-max-math-min-trong-javascript/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban44.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/math-max-math-min-trong-javascript/">Math.max và Math.min trong JavaScript</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/math-random-trong-javascript/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban43.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/math-object-trong-javascript/math-random-trong-javascript/">Math.random trong JavaScript</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/throw-trong-javascript/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban42.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/throw-trong-javascript/">throw trong JavaScript và cách trả về ngoại lệ tuỳ ý</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/cac-ngoai-le-trong-javascript-va-cach-xu-ly/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban41.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/cac-ngoai-le-trong-javascript-va-cach-xu-ly/">Các ngoại lệ trong JavaScript và cách xử lý tương ứng</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/try-catch-trong-javascript/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban40.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/try-catch-trong-javascript/">try...catch trong JavaScript và cách xử lý ngoại lệ</a></span> <span>tháng 7 1, 2022</span></div></li><li class="clearfix"><div class="widget-entry-thumbnail"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/xu-ly-ngoai-le-cua-ham-xu-ly-mo-ta-trong-khoi-try/"><img width="60px" height="60px" class="ezlazyload attachment-thumb-small size-thumb-small wp-post-image" alt="" ezimgfmt="rs rscb2 src ng ngcb2" data-ezsrc="/css/images/thumbnail_img/laptrinhcanban39.webp"></a></div><div class="widget-entry-summary"><span style="margin:0"><a target="_blank" href="https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/xu-ly-ngoai-le-trong-javascript/xu-ly-ngoai-le-cua-ham-xu-ly-mo-ta-trong-khoi-try/">Xử lý ngoại lệ của hàm xử lý mô tả trong khối try</a></span> <span>tháng 7 1, 2022</span></div></li></ul></div></div></div><footer class="entry-meta entry-footer"></footer><hr class="entry-footer-hr"></div><span class="ezoic-autoinsert-ad ezoic-longest_content"></span><div id="profiletitle2">Profile</div><div id="profileblock2"><div id="profilephoto2"><a target="_blank" rel="noopener" href="https://www.facebook.com/mr.nchita"><img width="100" height="100" alt="きよしです!笑" ezimgfmt="rs rscb2 src ng ngcb2" class="ezlazyload" data-ezsrc="/css/images/kiyoshi.webp"></a></div><div id="profiletext2"><p>Tác giả : <a href="https://www.facebook.com/mr.nchita" target="_blank" rel="nofollow noopener">Kiyoshi (Chis Thanh)</a></p><p>Kiyoshi là một <a href="https://www.youtube.com/c/ChisThanh" target="_blank" rel="nofollow noopener">cựu du học sinh tại Nhật Bản</a>. Sau khi tốt nghiệp đại học Toyama năm 2017, Kiyoshi hiện đang làm BrSE tại Tokyo, Nhật Bản.<span id="ezoic-pub-ad-placeholder-196" class="ezoic-adpicker-ad"></span></p></div></div></div></article><aside id="sidebar"><div id="sidebar_first"><span class="ezoic-autoinsert-ad ezoic-sidebar"></span><div class="search" style="margin-top:-30px"><div id="fb-root"></div><script async defer crossorigin="anonymous" src="https://connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v12.0&appId=3084959888222500&autoLogAppEvents=1" nonce="KPkvxeh4">