JavaScript "use strict" là gì? sử dụng strict mode trong JavaScript

Chào các bạn, để tiếp tục với những bài viết về học JavaScript cơ bản, hôm nay mình xin giới thiệu với các bạn lệnh 'use strict' trong JavaScript nhé!

JavaScript "use strict"

Trong JavaScript, khi sử dụng lệnh "use strict" thì đoạn code của chúng ta sẽ được thực thi ở strict mode (chế độ nghiêm ngặt). Điều này có thể giúp chúng ta viết code JS an toàn, tránh sai xót hơn.

Ví dụ:

blogName = 'homiedev';

Ở đây, blogName được tạo mà không cần sử dụng các từ khóa như var, let, const. Lúc này, blogName sẽ hoạt động như một biến toàn cục (global variable) trong JavaScript. Tuy nhiên, nếu chúng ta sử dụng kiểu này ở strict mode, chương trình sẽ báo lỗi.

Ví dụ:

'use strict';

blogName = 'homiedev.com'; 
// lỗi: Uncaught ReferenceError: blogName is not defined

Đoạn code trên xảy ra lỗi vì blogName không được khai báo. Trong strict mode, chúng ta không thể sử dụng các biến mà không khai báo.

Để chương trình của chúng ta ở strict mode, chúng ta sử dụng:

'use strict';

ở đầu chương trình.

Khi chúng ta khai báo strict mode ở đầu chương trình, nó sẽ có phạm vi toàn cầu (global scope) và tất cả code trong chương trình sẽ thực thi ở strict mode.

Sau đây, chúng ta cùng xem cách hoạt động của strict mode với biến, hàm,... nhé!

Sử dụng Strict Mode với biến

Trong strict mode, việc sử dụng một biến mà không khai báo nó sẽ gây ra lỗi.

Ví dụ:

console.log("blog Homiedev");

"use strict";

categories = ['front-end']; // không xảy ra lỗi

Chúng ta cần khai báo strict mode ở đầu chương trình. Nếu khai báo bên dưới một số đoạn code, nó sẽ không hoạt động.

Sử dụng Strict Mode với function

Chúng ta có thể sử dụng strict mode bên trong một function.

Ví dụ:

name = 'Hà';
console.log(name); // Hà

function sayHi() {
    // áp dụng strict mode trong hàm này
    'use strict';

    string = 'hi 🙋‍♂️'; // xảy ra lỗi
}

sayHi();

Nếu chúng ta sử dụng 'use strict' bên trong một hàm, code bên trong hàm sẽ ở strict mode.

Trong đoạn code trên, 'use strict' được sử dụng bên trong hàm sayHi(). Do đó, strict mode chỉ được áp dụng bên trong hàm này.

Như các bạn thấy ở trên, name vẫn sử dụng được mà không cần khai báo.

Nếu chúng ta khai báo 'use strict' ở đầu chương trình, chúng ta cũng không thể sử dụng một biến mà không khai báo nó trong hàm.

Ví dụ:

// áp dụng strict mode cho tất cả đoạn code
'use strict';

function sayHi() {
    string = 'hi 🙋‍♂️'; // xảy ra lỗi
}

sayHi();

Strict mode không áp dụng cho các đoạn mã chứa trong dấu ngoặc nhọn {}. Ví dụ:

{
   "use strict";
   footballPlayer = 'Messi';
   console.log(footballPlayer); // Messi
}

Lưu ý khi sử dụng strict mode

🤚 Khi sử dụng strict mode, chúng ta nên tránh những trường hợp sau, nếu không sẽ sảy ra lỗi.

Biến không được khai báo

'use strict';

rapper = 'Eminem'; // lỗi

'use strict';

blog = {name: 'homiedev', categories: ['JS', 'TS', 'GATSBYJS']}; 
// lỗi

Xóa object

'use strict';

let person = {name: 'Mi'};

delete person; 
// Uncaught SyntaxError: Delete of an unqualified identifier in strict mode.

Parameter trùng lặp

"use strict";

function display(param1, param1) { console.log('homiedev.com')}; 
// Uncaught SyntaxError: Duplicate parameter name not allowed in this context

display();

Gán giá trị cho non-writable property

'use strict';

let test = {};

Object.defineProperty(test, 'a', { value: 'A', writable: false });

// gán giá trị cho thuộc tính non-writable
test.a = 'B'; 
// Uncaught TypeError: Cannot assign to read only property 'a' of object

Bạn có thể tìm hiểu về Object Properties tại: Tìm hiểu Object Properties trong JavaScript.

Gán giá trị cho getter-only property

'use strict';

let test = { get a() { return 'A'; } };

// gán giá trị cho thuộc tính getter-only
test.a = 'B'; 
// Uncaught TypeError: Cannot set property a which has only a getter

Thêm thuộc tính cho non-extensible object

'use strict';

let test = {};
Object.preventExtensions(test);

// thêm thuộc tính cho non-extensible object
test.blogName = 'homiedev';
// Uncaught TypeError: Cannot add property blogName, object is not extensible

Sử dụng Octal literals

Các số bao gồm số 0 làm tiền tố (prefix) được gọi là các chữ số Bát phân (Octal) và chúng không được phép sử dụng trong strict mode của JavaScript.

'use strict';

let a = 001; 
// Uncaught SyntaxError: Octal literals are not allowed in strict mode

Sử dụng biến có tên eval và arguments

Trong strict mode, chúng ta không thể sử dụng eval và arguments làm tên hàm, tên biến hoặc tham số hàm. Cả eval và arguments đều được coi là keyword trong strict mode của JavaScript.

'use strict';

let arguments = 'hello'; // lỗi
let evalFunc = function eval(){}; // lỗi

//Uncaught SyntaxError: Unexpected eval or arguments in strict mode

Ngoài ra chúng ta cũng không thể sử dụng các reserved keyword: implements, interface, let, package, private, protected, public, static, yield như trong trường hợp trên.

Lợi ích khi sử dụng strict mode trong JavaScript

Dưới đây là một số lợi ích khi chúng ta sử dụng strict mode trong JavaScript:

1. strict mode hỗ trợ viết code rõ ràng hơn.
2. Thay đổi các silent errors (bad syntax) được chấp nhận trước đó thành lỗi thực sự và đưa ra thông báo lỗi.

Như vậy là trong bài viết này, chúng ta đã cùng nhau tìm hiểu về strict mode trong JavaScript. Bạn hay sử dụng chế độ strict mode hay non-strict mode trong việc viết code JavaScript 😁?

Nếu có bất kỳ thắc mắc nào, chúng ta cùng thảo luận bên dưới phần bình luận nhé!