Strict Mode trong JavaScript

manhhung

17 Th12 2021 • 6 min read

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.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

Trong javascript, use strict là từ khóa khai báo sử dụng chế độ strict mode. Nghĩa là nếu bạn muốn sử dụng chế độ Strict Mode ở đâu thì chỉ việc đặt từ khóa "use strict".Chế độ Strict Mode có hai phạm vi sử dụng, đó là toàn cục và cục bộ. Tính toàn cục tức là khi bạn đặt từ "use strict" ở ngoài hàm và nằm phía trên cùng của file, thì lúc này tất cả các đoạn code bên dưới đều bị ảnh hưởng. Tính cục bộ tức là bạn đặt "use strict" nằm trong một hàm nào đó thì phạm vi ảnh hưởng chỉ nằm trong hàm đó mà thôi.

Strict mode toàn cục

Trong ví dụ này chương trình chạy bị sẽ bị sai vì biến domain chưa được khởi tạo. Tuy nhiên nếu ta bỏ từ khóa use strict đi thì chương trình sẽ chạy bình thường.

// Phía trên cùng của file
"use strict";
 
// Đoạn code này lỗi vì biến domain chưa được khởi tạo
domain = "https://blog.haposoft.com/";
 
// In ra màn hình
document.write(domain);

Bây giờ ta thử gom đoạn code trên vào một hàm thử.

// Phía trên cùng của file
"use strict";
 
function show_domain(){
    // Đoạn code này lỗi vì biến domain chưa được khởi tạo
    domain = "https://blog.haposoft.com/";
 
    // In ra màn hình
    document.write(domain);
}
 
show_domain();

Chương trình vẫn bị lỗi vì ta đã khai báo tính strict mode toàn cục.

Strict mode cục bộ

Mình sẽ sử dụng lại ví dụ trên nhưng sẽ khai báo trong phạm vi của hàm.

function show_domain(){
    "use strict";    
}
 
// Đoạn code này không có lỗi
// Mặc dù domain chưa được khai báo nhưng vì ta đang chạy chế độ bình thường
domain = "https://blog.haposoft.com/";
 
// In ra màn hình
document.write(domain);

Chạy lên chương trình vẫn hoạt động bình thường. Tuy nhiên, nếu ta sử dụng một biến chưa được khai báo trong hàm đó thì chương trình sẽ không hoạt động.

function show_domain(){
    "use strict";    
     
    // Đoạn code này lỗi vì biến domain chưa được khởi tạo
    domain = "https://blog.haposoft.com/";
 
    // In ra màn hình
    document.write(domain);
}
 
show_domain();

3. Các trường hợp của use strict trong Javsacript

Bây giờ mình sẽ liệt kê ra một số trường hợp bị lỗi khi chạy ở chế độ strict mode.

Sử dụng biến chưa được định nghĩa: Bạn không thể sử dụng một biến mà chưa được định nghĩa trước đó.

1

2

3

4

"use strict";
 
// sai vì biến domain chưa được khởi tạo trừ trước
domain = 'blog.haposoft.com/';

Không chấp nhận delete biến: Bạn không thể delete các hàm, biến nếu chạy ở chế độ strict mode

1

2

3

4

5

6

"use strict";
 
var domain = 'blog.haposoft.com/'; 
 
// Sai vì không được delete
delete domain;

Định thuộc tính nghĩa hai lần: Nếu trong một Object bạn định nghĩa tên key bị trùng thì sẽ bị lỗi.

1

2

3

4

5

6

7

"use strict";
 
// Sai vì key email bị trùng
var info = {
    email : "thehalfheart@gmail.com",
    email : "haposoft.net@gmail.com"
};

Khao báo tham số bị trùng: Nếu bạn khai báo các tham số bị trùng tên thì sẽ bị lỗi

1

2

3

4

5

6

"use strict";
 
// Sai vì tham số domain bị trùng
function show_domain(domain, domain){
    // do some thing
}

Lỗi literals và escape với number: Bạn không được sử dụng literals và escape với kiểu number.

1

2

3

4

5

"use strict";
 
// Sai
var x = 0100;
var y = \0100;

Khai báo tên biến trùng với key: Bạn không thể khai báo tên của biến trùng với key của Javascript.

// Lỗi: Trùng hàm eval
var eval = 12;
 
// Lỗi: từ khóa arguments không được sử dụng làm tên biến
var arguments = 12;
 
// Lỗi: Từ khóa delete là khóa nên không được sử dụng làm tên biến
var delete = 123;

Ngoài ra bạn không thể đặt tên biến trùng với các từ khóa sau:

implements
interface
package
private
protected
public
static
yield

Đó là những từ khóa mà javascript chắc chắn sẽ có sử dụng trong tương lai.

Từ khóa with bị loại bỏ: Bạn không thể sử dụng từ khóa with trong chế độ strict mode.

"use strict";
let one = 1;
let two = 2;
 
// Sai, vì đây là chế độ strict mode
with(one) {
        document.write(one);
}

Không được khai báo biến trong lệnh eval: Eval là một hàm dùng để biên dịch một chỗi chứa mã javascript. Nếu trong chuỗi đó có chứa đoạn code khai báo biến thì sẽ bị lỗi.

1

2

3

4

"use strict";
eval("let x = 17");
document.write(x);
// Uncaught ReferenceError: x is not defined

Từ khóa this không còn là đối tượng windows nữa: Trước đây, khi bạn sử dụng this trong một hàm không phải là constructor, hoặc sử dụng this bên ngoài chương trình chính, thì con trỏ this lúc này chính là đối tượng window. Tuy nhiên, ở chế độ strict mode thì this sẽ mang giá trị undefined.

"use strict"; function myFunction() { console.log(this); // Kêt quả: undefined } myFunction();

Nếu không sử dụng use strict thì kết quả sẽ là window:

1

2

3

4

function myFunction() {
    console.log(this); // Kêt quả: Window
}
myFunction();

4. Strict mode luôn được kích hoạt trong module

Từ khi ES6 ra đời thì xuất hiện thêm khái niệm module. Module ra đời giúp lập trình viên có cách tổ chức cho cấu trúc của ứng dụng trở nên chuyên nghiệp hơn. Mỗi module sẽ là tập hợp những biến, hàm, lớp có liên quan với nhau, và nó cho phép các module khác sử dụng tài nguyên thông qua từ khóa export và import.

Điều đặc biệt là chế độ strict mode luôn được bật trong module, vì vậy hãy tập thói quen code cho thật cẩn thận nhé.

1

2

3

<script type="module">
    alert(a); // Sai, vì biến a chưa được định nghĩa
</script>

5. Lời kết

Qua bài này bạn sẽ không còn thắc mắc về từ khóa use strict trong js nữa phải không nào? Đây là chế độ biên dịch rất nghiêm túc, là xu hướng lập trình javascript tương lai