Strict Mode trong JavaScript

Ngày đăng: 06/10/2020 - Cập nhật: 07/10/2020

Mục Lục

1. Strict mode là gì?
2. Khai báo và sử dụng strict mode
3. Các quy tắc khi sử dụng chế độ strict mode
Tổng kết

Strict Mode là một tính năng rất hay ho được thêm trong phiên bản EMAScript 2015. Đây là một khái niệm mới, hãy cùng mình tìm hiểu nhé.

1. Strict mode là gì?

Bạn có để ý những file JS trên internet hoặc những thư viện như jQuery khi mở file ra thì bạn sẽ thấy dòng chữ use strict không?

Từ khóa use strict là từ khóa để bật chế độ Strict Mode, tạm dịch là chế độ nghiêm ngặt của JavaScript, bắt đầu xuất hiện từ phiên bản ECMAScript 5.

Khi một đoạn lệnh được khai báo use strict thì tất cả các dòng code ở phía dưới dòng khai báo use strict sẽ được JavaScript quản lý nghiêm ngặt hơn về mặt cú pháp.

Điều này được yêu cầu cực kỳ khắt khe ở các dự án phức tạp.

Yêu cầu các lập trình viên phải quản lý thật chặt chẽ code của mình, tránh các lỗ hổng tiềm tàng.

> Tham khảo: Học để trở thành lập trình viên chuyên nghiệp với khóa học LẬP TRÌNH FULL STACK

Khi sử dụng strict mode có thể bạn sẽ không chạy được những dòng code JS bình thường trước đó (Mình sẽ nói rõ hơn ở phần sau)

Từ khóa use strict có thể đươc sử dụng ở hai vị trí đó là:

Đặt ở đầu file hay đầu code JavaScript có tác dụng cho toàn bộ code JavaScript trong file đó

Đặt ở đầu một hàm có tác dụng cho code trong hàm đó mà thôi.

2. Khai báo và sử dụng strict mode

Để bật chế độ strict mode cũng rất đơn giản, bạn chỉ cần đặt như thế này ở đầu file JS, hoặc đầu một hàm:

	
	"use strict";

Chỉ cần gõ như vậy ở đầu một file (dành cho toàn cục), hay đầu một function (dành cho cục bộ).

2.1. Khai báo strict mode trong toàn cục

Các bạn xem đoạn code dưới đây, tình huống đặt ra là chúng ta sử dụng “use strict” cho toàn bộ code JavaScript.

Sau đó, chúng ta không khai báo biến message mà vẫn sử dụng nó.

Hãy xem kết quả nhận được là gì?

		
		<script>

		    // Khai báo đầu file

		    "use strict";

		    // Đoạn code này lỗi vì biến message chưa được khởi tạo

		    message = "Học lập trình JavaScript cơ bản!";

		    // In ra màn hình

		    document.write(message);

		</script>

Kết quả trong tab console như sau:

Lỗi vi phạm quy tắc code trong Strict Mode

Chương trình sẽ báo lỗi như trên do chúng ta sử dụng strict mode (chế độ code nghiêm ngặt).

Bây giờ mình comment dòng // “use strict”; lại và chạy lại để xem kết quả:

Ví dụ không sử dụng Strict Mode trong JavaScript

Chương trình sẽ chạy bình thường dù chúng ta không khai báo biến message trước đó. Nhưng, điều này có thể gây ra lỗi về sau.

2.2. Khai báo strict mode trong cục bộ

Để khai báo stric mode trong cục bộ, đơn giản là bạn đặt "use strict" trong phạm vi cục bộ nào đó.

Ví dụ, mình tinh chỉnh một chút ở đoạn code trên để nó thành phạm vi cục bộ cho các bạn tiện theo dõi.

		
		<script>

		    function print_message() {

		        // Khai báo đầu function

		        "use strict";

		    }

		    print_message();

		    message = "Phạm vi ngoài hàm print_message";

		    document.write(message);

		</script>

Chạy trên trình duyệt, kết quả nhận được:

Đoạn code này thì kết quả vẫn chạy bình thường vì chúng ta “use strict” trong hàm print_message() nên không ảnh hưởng ra bên ngoài.

Nếu chúng ta sử dụng một biến không khai báo trong phạm vi cục bộ này thì chương trình sẽ báo lỗi và không chạy.

		
		<script>

		    function print_message() {

		        // Khai báo đầu function

		        "use strict";

		        // Đoạn code này lỗi vì biến message chưa được khởi tạo

		        message = "Học lập trình JavaScript cơ bản!";

		        // In ra màn hình

		        document.write(message);

		    }

		    print_message();

		    message = "Phạm vi ngoài hàm print_message";

		    document.write(message);

		</script>

Đến đây thì bạn đã hiểu cơ bản về chế độ nghiêm ngặt trong phạm vi toàn cục và phạm vi cục bộ rồi.

Vậy, làm thế nào để viết code đúng trong stric mode.

Hãy tìm hiểu tiếp qua phần các quy tắc trong chế độ strict mode.

3. Các quy tắc khi sử dụng chế độ strict mode

Vì JavaScript là ngôn ngữ lỏng lẻo thế nên khi dự án bắt đầu phình to, các vấn đề do lỏng lẻo gây ra bắt đầu thể hiện rõ rệt.

Nhưng may mắn là người ta đã tạo ra strict mode.

Khi sử dụng strict mode tức là bạn đã thông báo rằng tôi chuyển JavaScript từ chế độ lỏng lẻo về chế độ nghiêm ngặt.

Vì thế, code của bạn viết bây giờ dĩ nhiên phải nghiêm ngặt.

Nghiêm ngặt thì bạn không được làm những điều sau:

3.1. Gán giá trị cho biến chưa được khai báo

Nếu không sử dụng strict mode thì bạn có thể vô tư với điều này, nhưng khi bật chế độ combat à không chế độ strict mode lên thì bạn không được gán giá trị cho một biến chưa khai báo:

Ví dụ:

Trong chế độ mặc định, làm thế này thì vô tư:

		
		message = "Học lập trình JavaScript cơ bản";

		document.write(message);

Nhưng khi bật strict mode thì lại không được:

		
		// Không được làm thế này

		"use strict";

		message = "Học lập trình JavaScript cơ bản";

		document.write(message);

Đoạn code trên sẽ báo lỗi và không thực thi tiếp.

Để không bị lỗi, bạn phải khai báo biến rõ ràng với từ khóa let, var, const

		
		"use strict";

		// Khai báo biến rõ ràng với từ khóa

		let message = "Học lập trình JavaScript cơ bản!";

Và cả đối với đối tượng.

		
		"use strict";

		// Chưa khai báo đối tượng. Chưa được phép sử dụng

		// như thế này

		x = {

		    tenThuongHieu: "NIIT - ICT Hà Nội",

		    namThanhLap: 2002

		};

Bạn chưa khai báo thì chưa được phép gán giá trị cho chúng.

3.2. Báo lỗi khi sử dụng `delete`

Khi bật chế độ strict mode lên thì bạn không thể sử dụng từ khóa delete để xóa các hàm hay biến.

		
		"use strict";

		// Khai báo biến rõ ràng với từ khóa

		let message = "Học lập trình JavaScript cơ bản!";

		// Sai vì không được delete

		delete message;

3.3. Các tham số của hàm không được trùng nhau

Ở chế độ strict mode bạn sẽ không đươc khai báo các tham số trùng với nhau. Nó chửi đấy!

		
		"use strict";

		// Sai vì tham số message bị trùng

		function print_message(message, message) {

		    document.write("Lập trình JavaScript căn bản");

		}

3.4. Không cho phép khai báo biến dưới dạng hệ nhị phân

Các số khi khai báo biến dưới dạng nhị phân hay nói cách khác là có tiền tố 0 phía trước sẽ không được chấp nhận trong chế độ này.

		
		"use strict";

		let number = 01010;

		// Uncaught SyntaxError: Octal literals are not allowed in strict mode.

3.5. Không đươc phép ghi đè lên thuộc tính chỉ đươc phép đọc

Khi đã nói thuộc tính chỉ đọc thì chỉ được đọc, không được ghi đè.

		
		"use strict";

		let obj_demo = {};

		Object.defineProperty(obj_demo, "ver", {

		    value: 1,

		    writable: false,

		});

		// Cố ghi đè lên thuộc tính chỉ đọc

		obj_demo.ver = 10;

		// Uncaught TypeError: Cannot assign to read only property 'ver' of object '#<Object>'

3.6. Không được sử dụng `with`

Từ khóa with cũng không được sử dụng trong chế độ strict mode.

		
		"use strict";

		let one = 1;

		let two = 2;

		with(one) {

		        document.write(one);

		    }

		// Uncaught SyntaxError: Strict mode code may not include a with statement

3.7. Không cho phép khai báo biến bên trong `eval()`

Trong chế độ nghiêm ngặt này không cho phép khai báo biến bên trong eval() vì lý do bảo mật.

		
		"use strict";

		eval("let x = 17");

		document.write(x);

		// Uncaught ReferenceError: x is not defined

3.8. Không chấp nhận khai báo biến bằng tên keyword ở phiên bản cao hơn

Ở chế độ strict mode sẽ không cho phép bạn sử dụng các từ khóa sau để khai báo biến, hằng hay đặt tên cho hàm được sử dụng ở các phiên bản cao hơn (trong tương lai) như: implements, interface, let, package, private, protected, public, static và yield.

3.9. Hành vi khác của từ khóa this

Từ khóa this là một trường hợp có hành vi khá là khó nắm bắt trong JavaScript (nếu bạn là người mới học hay kể cả những người có kinh nghiệm)

Chính vì thế, với mục tiêu làm cho code nghiêm ngặt hơn.

Hành vi của từ khóa this cũng là một thứ được trọng tâm điều chỉnh trong strict mode.

Từ khóa this đề cập đến đối tượng được gọi là hàm.

Nếu đối tượng không được chỉ định, các hàm ở chế độ nghiêm ngặt sẽ trả về undefined

		
		"use strict";

		function myFunction() {

		  console.log(this); // Kêt quả: undefined

		}

		myFunction();

Và các hàm ở chế độ bình thường sẽ trả về đối tượng toàn cục (Window)

		
		function myFunction() {

		    console.log(this); // Kêt quả: Window

		}

		myFunction();

Tổng kết

Như vậy mình đã giới thiệu về chế độ strict mode trong JavaScript. Chế độ này giúp anh em viết lập trình JS “chuẩn” hơn, đảm bảo khả năng tương thích, duy trì và mở rộng trong tương lai.

Hy vọng bài viết này đã giúp bạn hiểu về một tính năng rất thú vị của các phiên bản JavaScript hiện đại.

Hẹn gặp lại bạn ở bài học tiếp theo.

> Đọc thêm về Strict Mode trên Mozilla.

Về trang trước Bài tiếp theo

Gửi email in trang