“use strict”; Mendefinisikan bahwa kode JavaScript harus dijalankan dalam “mode strict”.
Section Artikel
The “use strict” Directive
Perintah “use strict” adalah hal baru di ECMAScript versi 5.
Ini bukan pernyataan, tetapi ekspresi literal, dan akan diabaikan oleh JavaScript versi sebelumnya.
Tujuan dari “use strict” adalah untuk menunjukkan bahwa kode harus dijalankan dalam “mode strict”.
Dengan mode strict, kita tidak dapat, misalnya menggunakan variabel yang tidak dideklarasikan.
Semua browser modern mendukung “use strict” kecuali Internet Explorer 9 dan yang lebih rendah:
| Directive | Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| “use strict” | 13.0 | 10.0 | 4.0 | 6.0 | 12.1 |
Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung perintah tersebut.
Anda dapat menggunakan mode strict di semua program. Hal ini membantu menulis kode yang lebih bersih, seperti mencegah untuk menggunakan variabel yang tidak dideklarasikan.
“use strict” hanyalah sebuah string, jadi IE 9 tidak akan menampilkan error meskipun tidak memahaminya.
Deklarasi Mode Strict
Mode strict dideklarasikan dengan menambahkan “use strict”; ke awal skrip atau fungsi.
Dinyatakan di awal skrip, mode strict memiliki cakupan global (semua kode dalam skrip akan dijalankan dalam mode strict.
Contoh:
<!DOCTYPE html> <html> <body> <h2>"use strict":</h2> <h3> Menggunakan variabel tanpa mendeklarasikannya, tidak diperbolehkan. </h3> <p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p> <script> "use strict"; x = 3.14; // This will cause an error (x is not defined). </script> </body> </html>
<!DOCTYPE html>
<html>
<body>
<h2> Deklarasi global "use strict". </h2>
<p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p>
<script>
"use strict";
myFunction();
function myFunction() {
y = 3.14; // This will cause an error (y is not defined)
}
</script>
</body>
</html>
Dinyatakan di dalam suatu fungsi, mode ini juga memiliki cakupan lokal (hanya kode di dalam fungsi tersebut dalam mode strict).
Contoh:
<!DOCTYPE html>
<html>
<body>
<p> "use strict" dalam suatu fungsi hanya akan menyebabkan kesalahan dalam fungsi itu. </p>
<p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p>
<script>
x = 3.14; // This will not cause an error.
myFunction();
function myFunction() {
"use strict";
y = 3.14; // This will cause an error (y is not defined).
}
</script>
</body>
</html>
Sintaks “use strict”;
Sintaks, untuk mendeklarasikan mode strict, dirancang agar kompatibel dengan JavaScript versi lama.
Mengompilasi literal numerik (4 + 5;) atau literal string (“John Doe”;) dalam program JavaScript tidak memiliki efek samping. Ini hanya mengkompilasi ke variabel yang tidak ada.
Jadi “use strict”; hanya penting bagi kompiler baru yang “memahami” artinya.
Mengapa Mode strict?
Mode strict memudahkan penulisan JavaScript secara “aman”.
Perubahan mode strict yang sebelumnya menerima “sintaksis buruk” menjadi kesalahan nyata.
Sebagai contoh, dalam JavaScript normal, salah mengetik nama variabel akan membuat variabel global baru. Dalam mode strict, ini akan memunculkan kesalahan, sehingga tidak mungkin membuat variabel global secara tidak sengaja.
Dalam JavaScript normal, pengembang tidak akan menerima umpan balik kesalahan yang menetapkan nilai ke properti yang tidak dapat ditulis.
Dalam mode strict, setiap penugasan ke properti yang tidak dapat ditulis, properti khusus pengambil, properti yang tidak ada, variabel yang tidak ada, atau objek yang tidak ada, akan memunculkan kesalahan.
Hal yang Tidak Diizinkan dalam Mode strict
Menggunakan variabel, tanpa mendeklarasikannya, tidak diperbolehkan:
<!DOCTYPE html> <html> <body> <h2>"use strict":</h2> <h3>Menggunakan variabel, tanpa mendeklarasikannya, tidak diperbolehkan.</h3> <p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p> <script> "use strict"; x = 3.14; // This will cause an error (x is not defined). </script> </body> </html>
Objek juga variabel.
Menggunakan objek, tanpa mendeklarasikannya, tidak diperbolehkan:
<!DOCTYPE html>
<html>
<body>
<h2>"use strict":</h2>
<h3>Menggunakan objek, tanpa mendeklarasikannya, tidak diperbolehkan.</h3>
<p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p>
<script>
"use strict";
x = {p1:10, p2:20}; // This will cause an error (x is not defined).
</script>
</body>
</html>
Menghapus variabel (atau objek) tidak diperbolehkan.
<!DOCTYPE html> <html> <body> <h2>"use strict":</h2> <h3>Menghapus variabel (atau objek) tidak diperbolehkan.</h3> <p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p> <script> "use strict"; var x = 3.14; delete x; // This will cause an error </script> </body> </html>
Menghapus fungsi tidak diperbolehkan.
<!DOCTYPE html>
<html>
<body>
<h2>"use strict":</h2>
<h3>Menghapus fungsi tidak diperbolehkan.</h3>
<p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p>
<script>
"use strict";
function x(p1, p2) {};
delete x; // This will cause an error
</script>
</body>
</html>
Menduplikasi nama parameter tidak diperbolehkan:
<!DOCTYPE html>
<html>
<body>
<h2>"use strict":</h2>
<h3>Menduplikasi nama parameter tidak diperbolehkan:</h3>
<p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p>
<script>
"use strict";
function x(p1, p1) {}; // This will cause an error
</script>
</body>
</html>
Literal numerik oktal tidak diperbolehkan:
<!DOCTYPE html> <html> <body> <h2>"use strict":</h2> <h3>Literal numerik oktal tidak diperbolehkan:</h3> <p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p> <script> "use strict"; var x = 010; // This will cause an error </script> </body> </html>
Karakter pelarian oktal tidak diperbolehkan:
<!DOCTYPE html> <html> <body> <h2>"use strict":</h2> <h3>Karakter pelarian oktal tidak diperbolehkan:</h3> <p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p> <script> "use strict"; var x = "\010"; // This will cause an error </script> </body> </html>
Menulis ke properti read-only tidak diperbolehkan:
<!DOCTYPE html>
<html>
<body>
<h2>"use strict":</h2>
<h3>Menulis ke properti read-only tidak diperbolehkan.</h3>
<p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p>
<script>
"use strict";
var obj = {};
Object.defineProperty(obj, "x", {value:0, writable:false});
obj.x = 3.14; // This will cause an error
</script>
</body>
</html>
Menulis ke properti get-only tidak diperbolehkan:
<!DOCTYPE html>
<html>
<body>
<h2>"use strict":</h2>
<h3>Menulis ke properti get-only tidak diperbolehkan:</h3>
<p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p>
<script>
"use strict";
var obj = {get x() {return 0} };
obj.x = 3.14; // This will cause an error
</script>
</body>
</html>
Menghapus properti yang tidak dapat dihapus tidak diperbolehkan:
<!DOCTYPE html> <html> <body> <h2>"use strict":</h2> <h3>Menghapus properti yang tidak dapat dihapus tidak diperbolehkan:</h3> <p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p> <script> "use strict"; delete Object.prototype; // This will cause an error </script> </body> </html>
Kata eval tidak dapat digunakan sebagai variabel:
<!DOCTYPE html> <html> <body> <h2>"use strict":</h2> <h3>Kata eval tidak dapat digunakan sebagai variabel:</h3> <p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p> <script> "use strict"; var eval = 3.14; // This will cause an error </script> </body> </html>
Argumen kata tidak dapat digunakan sebagai variabel:
<!DOCTYPE html> <html> <body> <h2>"use strict":</h2> <h3>Argumen kata tidak dapat digunakan sebagai variabel:</h3> <p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p> <script> "use strict"; var arguments = 3.14; // This will cause an error </script> </body> </html>
Pernyataan with tidak diperbolehkan:
<!DOCTYPE html>
<html>
<body>
<h2>"use strict":</h2>
<h3>Pernyataan with tidak diperbolehkan:</h3>
<p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p>
<script>
"use strict";
with (Math){x = cos(2)}; // This will cause an error
</script>
</body>
</html>
Untuk alasan keamanan, eval () tidak diizinkan untuk membuat variabel dalam lingkup yang memanggilnya:
<!DOCTYPE html>
<html>
<body>
<h2>"use strict":</h2>
<h3>Untuk alasan keamanan, eval () tidak diizinkan untuk membuat variabel dalam lingkup yang memanggilnya.</h3>
<p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p>
<script>
"use strict";
eval ("var x = 2");
alert (x); // This will cause an error
</script>
</body>
</html>
Kata kunci dalam fungsi this berperilaku berbeda dalam mode strict.
Kata kunci this mengacu pada objek yang disebut fungsi.
Jika objek tidak ditentukan, fungsi dalam mode strict akan mengembalikan tidak terdefinisi dan fungsi dalam mode normal akan mengembalikan objek global (jendela):
<!DOCTYPE html>
<html>
<body>
<h2>"use strict":</h2>
<h3> Di dalam fungsi, kata kunci "ini" tidak lagi menjadi objek global jika tidak ditentukan.</h3>
<script>
"use strict";
function myFunction() {
alert(this);
}
myFunction();
</script>
</body>
</html>
Future Proof!
Kata kunci yang dicadangkan untuk versi JavaScript mendatang TIDAK dapat digunakan sebagai nama variabel dalam mode strict.
Ini adalah:
<!DOCTYPE html> <html> <body> <h2>"use strict":</h2> <h3> Kata kunci yang dipesan tidak diizinkan dalam mode strict. </h3> <p> Aktifkan debugging di browser Anda (F12) untuk melihat laporan kesalahan. </p> <script> "use strict"; var public = 1500; // This will cause an error </script> </body> </html>
Hati-hati!
Direktif “use strict” hanya dikenali di awal skrip atau fungsi.
