前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >【JS】312- 复习 JavaScript 严格模式(Strict Mode)

【JS】312- 复习 JavaScript 严格模式(Strict Mode)

作者头像
pingan8787
发布2019-08-09 19:40:51
9870
发布2019-08-09 19:40:51
举报
文章被收录于专栏:前端自习课前端自习课

点击上方“前端自习课”关注,学习起来~

注:本文为 《 JavaScript 完全手册(2018版) 》第30节,你可以查看该手册的完整目录。

严格模式是一项 ES5 功能,它使 JavaScript 以更好的方式运行,因为启用严格模式会更改 JavaScript 语言的语义。

了解严格模式与普通模式(通常称为草率模式)下 JavaScript 代码之间的主要区别非常重要。

严格模式主要是删除 ES3 中可能的功能,并且从ES5开始就被弃用(但是由于向后兼容性要求而没有被删除)。

如何开启严格模式

严格模式是可选的。与 JavaScript 中的每一个重大变化一样,我们不能简单地改变语言行默认的为方式,因为这会破坏大量的 JavaScript ,并且 JavaScript 会花费大量精力来确保1996年的JavaScript代码仍然有效。这是其成功的关键。

因此,我们需要使用 'use strict' 指令来启用严格模式。

你可以将它放在文件的开头,将其应用于文件中包含的所有代码:

JavaScript 代码:

代码语言:javascript
复制
'use strict' const name = 'Flavio'const hello = () => 'hey' //...

你还可以通过在函数体的开头的位置添加 'use strict' ,来为该函数单独启用严格模式:

JavaScript 代码:

代码语言:javascript
复制
function hello() {  'use strict'    return 'hey'}

在遗留代码上操作时,这很有用,在遗留代码中你没有时间进行测试,也可能没有信心在整个文件上启用严格模式。

严格模式改变了什么

意外的全局变量

如果为未声明的变量赋值,则默认情况下 JavaScript 会在全局对象上创建该变量:

JavaScript 代码:

代码语言:javascript
复制
;(function() {  variable = 'hey'})() (() => {  name = 'Flavio'})() variable //'hey'name //'Flavio'

转到严格模式,如果你尝试执行上面的操作,则会出现错误:

JavaScript 代码:

代码语言:javascript
复制
;(function() {  'use strict'  variable = 'hey'})() (() => {  'use strict'  myname = 'Flavio'})()

分配错误

JavaScript 中会隐式转换一些值。

在严格模式下,这些隐式转换会抛出错误:

JavaScript 代码:

代码语言:javascript
复制
undefined = 1 (() => {  'use strict'  undefined = 1})()
代码语言:javascript
复制

这同样适用于 Infinity,NaN,evalarguments 等。

在 JavaScript 中,可以使用下面代码定义对象属性不可写

JavaScript 代码:

代码语言:javascript
复制
const car = {}Object.defineProperty(car, 'color', { value: 'blue', writable: false })

在严格模式下,你不能覆盖这个值,但在非严格模式下可以这么做:

和 getters 的原理一样:

JavaScript 代码:

代码语言:javascript
复制
const car = {  get color() {    return 'blue'  }}car.color = 'red'(  //ok   () => {    'use strict'    car.color = 'yellow' //TypeError: Cannot set property color of # which has only a getter  })()

非严格模式允许扩展一个不可扩展的对象:

JavaScript 代码:

代码语言:javascript
复制
const car = { color: 'blue' }Object.preventExtensions(car) car.model = 'Fiesta'(  //ok  () => {    'use strict'    car.owner = 'Flavio' //TypeError: Cannot add property owner, object is not extensible  })()

另外,非严格模式允许设置原始值的属性,而不会失败,但也没有做任何事情:

JavaScript 代码:

代码语言:javascript
复制
true.false = ''(  //''  1).name =  'xxx' //'xxx'var test = 'test' //undefinedtest.testing = true //truetest.testing //undefined

在严格模式下,上面所有这些情况都会失败:

JavaScript 代码:

代码语言:javascript
复制
;(() => {  'use strict'  true.false = ''(    //TypeError: Cannot create property 'false' on boolean 'true'    1  ).name =    'xxx' //TypeError: Cannot create property 'name' on number '1'  'test'.testing = true //TypeError: Cannot create property 'testing' on string 'test'})()

删除错误

在非严格模式,如果你尝试删除无法删除的属性,JavaScript 只返回 false ,而在严格模式下,它会引发 TypeError:

JavaScript 代码:

代码语言:javascript
复制
delete Object.prototype(  //false    () => {    'use strict'    delete Object.prototype //TypeError: Cannot delete property 'prototype' of function Object() { [native code] }  })()

具有相同名称的函数参数

在普通函数中,你可以使用重复的参数名称:

JavaScript 代码:

代码语言:javascript
复制
(function(a, a, b) {  console.log(a, b)})(1, 2, 3)//2 3 (function(a, a, b) {  'use strict'  console.log(a, b)})(1, 2, 3)//Uncaught SyntaxError: Duplicate parameter name not allowed in this context

请注意,在这种情况下,箭头函数始终引发 SyntaxError:

JavaScript 代码:

代码语言:javascript
复制
((a, a, b) => {  console.log(a, b)})(1, 2, 3)//Uncaught SyntaxError: Duplicate parameter name not allowed in this context

八进制

JavaScript 代码:

代码语言:javascript
复制
  console.log(010)})()//8 (() => {  'use strict'  console.log(010)})()//Uncaught SyntaxError: Octal literals are not allowed in strict mode.

你仍然可以使用 0oXX 语法在严格模式下启用八进制数字:

JavaScript 代码:

代码语言:javascript
复制
;(() => {  'use strict'  console.log(0o10)})()//8

移除了 with

严格模式不能使用 with 关键字,以移除一些边缘情况,并允许在编译器层面进行更多优化。

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2019-08-08,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 前端自习课 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 如何开启严格模式
  • 严格模式改变了什么
    • 意外的全局变量
    • 八进制
    • 移除了 with
    领券
    问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档