数据结构
网络
关系型数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理
化学
生物
数学
英语
经济学
心理学
社会学
时尚研究
法律研究JavaScript "严格模式" 的特点是什么？
本教程将向您解释 JavaScript "严格模式" 的不同特点。因此，JavaScript 中有两种不同的编程模式。
默认情况下，启用简单模式或有时称为宽松模式。在此模式下，我们在编写代码时无需遵循严格的规则。
另一方面，也存在严格模式。此模式在环境中启用一些严格规则。严格模式不是宽松模式的子集，但它也具有与普通代码不同的语义。
语法
严格模式可以在不同的作用域中启用。语法如下所示：
- 脚本的严格模式：将整个脚本转换为严格模式
‘use strict’;
- 函数的严格模式：将函数转换为严格模式
function function_name(){
‘use strict’;
// function body
}
- JavaScript 类已处于严格模式，我们无需为它们编写任何内容。
在 JavaScript 中启用严格模式后会发生哪些变化？
在宽松的 JavaScript 中，它有时会隐藏错误并使其在执行时静默。例如，如果我们在之前没有声明变量，我们可以为未声明的变量赋值。它将在该初始化语句之后自动创建一个全局变量。但在严格模式下，它将引发错误，因为我们正在为某个未声明的变量赋值。下面列出了其他一些更改：
严格模式会引发一些在宽松模式下转换为静默错误的错误。
有时严格模式代码运行速度比相同的宽松模式代码快，因为修复错误对于 JavaScript 引擎执行任何优化变得更加困难。
当严格模式引发许多错误并使我们的环境更加严格时，我们为什么要进入此模式？好吧，也有一些优点。
严格模式帮助我们编写安全的 JavaScript 代码。
宽松的 JavaScript 代码可能会静默地接受错误的语法。这可以在严格模式下转换为真正的错误。这有助于在 JavaScript 中编写更好的代码。
当变量不可写时，宽松的 JavaScript 变体不会返回任何错误，而严格模式会向开发人员反馈错误消息。
在严格模式下，当我们尝试为不可写属性、仅 getter 属性或不存在的属性赋值时，它将引发错误。
示例
让我们看一些示例以了解哪些在严格模式下不允许：
源代码
<!DOCTYPE html> <html> <head> <title>HTML Console</title> </head> <body> <h3> Output Console </h3> <p> Output: </p> <div id = "output" > </div> <script> "use strict" // enabling strict mode var content = '' var opDiv = document.querySelector( '#output' ) // actual javascript code try{ // Assigning to a variable that is not declared beforehand a = 2.5; content = "Value of variable a = " + a; } catch (err) { content = err opDiv.style.color = '#ff0000' } finally{ // display on output console opDiv.innerHTML = content } </script> </body> </html>
因此，声明一个变量并使用它
源代码
<!DOCTYPE html> <html> <head> <title>HTML Console</title> </head> <body> <h3> Output Console </h3> <p> Output: </p> <div id="output"> </div> <script> "use strict" // enabling strict mode var content = '' var opDiv = document.querySelector('#output') // actual javascript code try { var a a = 2.5; var b = 5.7; content = "Value of variable a: " + a + "<br>"; content += "Value of variable b: " + b; } catch (err) { content = err opDiv.style.color = '#ff0000' } finally { // display on output console opDiv.innerHTML = content } </script> </body> </html>
在严格模式下不允许删除变量。
源代码
<!DOCTYPE html> <html> <head> <title>HTML Console</title> </head> <body> <h3> Output Console </h3> <p> Output: </p> <div id="output"> </div> <script> "use strict" // enabling strict mode var content = '' var opDiv = document.querySelector('#output') // actual javascript code try { let a = 2.5; content += 'Value of a:' + a + '<br>'; delete a; } catch (err) { content += err opDiv.style.color = '#ff0000' } finally { // display on output console opDiv.innerHTML = content } </script> </body> </html>
输出（此错误无法通过 HTML 页面在线控制台显示。复制上述代码并在本地计算机中创建一个 HTML 文件，然后尝试运行此 HTML 文件，然后检查页面控制台以获取此错误）
不允许写入只读对象。
源代码
<!DOCTYPE html> <html> <head> <title>HTML Console</title> </head> <body> <h3> Output Console </h3> <p> Output: </p> <div id="output"> </div> <div id="opError" style = "color : #ff0000"> </div> <script> "use strict" // enabling strict mode var content = '' var error = '' var opDiv = document.querySelector('#output') var opErrDiv = document.querySelector('#opError') // actual javascript code try { const obj = {}; Object.defineProperty(obj, "a", { value: 10, writable: false }); content += "The value of obj.a: " + obj.a + "<br>" obj.a = 5.27; } catch (err) { error += err } finally { // display on output console opDiv.innerHTML = content opErrDiv.innerHTML = error } </script> </body> </html>
不允许创建与保留关键字名称相同的变量：
源代码
<!DOCTYPE html> <html> <head> <title>HTML Console</title> </head> <body> <h3> Output Console </h3> <p> Output: </p> <div id="output"> </div> <div id="opError" style = "color : #ff0000"> </div> <script> "use strict" // enabling strict mode var content = '' var error = '' var opDiv = document.querySelector('#output') var opErrDiv = document.querySelector('#opError') // actual javascript code try { let public = 15; content += "The value of public: " + public + "<br>" } catch (err) { error += err } finally { // display on output console opDiv.innerHTML = content opErrDiv.innerHTML = error } </script> </body> </html>
在宽松模式下，我们可以使用“With”关键字，这在严格模式下不允许：
源代码
<!DOCTYPE html> <html> <head> <title>HTML Console</title> </head> <body> <h3> Output Console </h3> <p> Output: </p> <div id="output"> </div> <div id="opError" style = "color : #ff0000"> </div> <script> // Sloppy Mode var content = '' var error = '' var opDiv = document.querySelector('#output') var opErrDiv = document.querySelector('#opError') // actual javascript code try { with (Math){a = sqrt(64)}; content += "The value of a: " + a + "<br>" } catch (err) { error += err } finally { // display on output console opDiv.innerHTML = content opErrDiv.innerHTML = error } </script> </body> </html>
源代码
<!DOCTYPE html> <html> <head> <title>HTML Console</title> </head> <body> <h3> Output Console </h3> <p> Output: </p> <div id="output"> </div> <div id="opError" style = "color : #ff0000"> </div> <script> "use strict" // enabling strict Mode var content = '' var error = '' var opDiv = document.querySelector('#output') var opErrDiv = document.querySelector('#opError')// actual javascript code try { with (Math){a = sqrt(64)}; content += "The value of a: " + a + "<br>" } catch (err) { error += err } finally { // display on output console opDiv.innerHTML = content opErrDiv.innerHTML = error } </script> </body> </html>
结论
JavaScript 严格模式为 JavaScript 开发提供了一个安全的环境。在此模式下，它不允许包含错误语法的代码，并且还限制了从宽松模式的隐式转换。JavaScript 优化代码以在编译时减少错误，但在严格模式下，优化级别要低得多。有时，用严格模式编写的代码运行速度比用宽松模式编写的类似代码快。
更新于： 2022年8月22日
442 次浏览
广告