深入浅析JS中的严格模式


Posted in Javascript onJune 04, 2018

什么是严格模式?

使JS编码更加规范化的模式,消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为

怎么使用?

直接添加下面的这句字符串就可以了,这种语法可以向后兼容,如果是不支持严格模式的javascript引擎,就会直接当成是一个未赋值的字符串字面量,会直接忽略,支持的引擎就会开启严格模式

'use strict'

说明:

1.在全局作用域使用的话,那整个js脚本就会开启这种模式

2.如果是只在函数内部使用的话,那么就只是该函数内部开启而已

function doSomething(){
 'use strict' 
 // 其他代码 
}

变量

1. 在严格模式中什么时候创建变量以及怎么创建变量都是有限制的.首先,不允许意外创建全局变量.在非严格模式下是可以像下面这样创建全局变量,但是严格模式中是不可以的

// 未声明变量
// 非严格模式:创建全局变量
// 严格模式 :抛出referenceEror错误

2.在严格模式下,对变量名也是有限制.特别的,不能使用implements,interface,let,package,private等保留字作为变量名,用这些变量命名的话,都会导出语法错误

对象

在严格模式下 操作对象比在非严格模式下更容易导致错误,下面几种情形会导致语法错误

1.为只读属性赋值会抛出TypeError

2.对不可配置的属性使用delete 操作符会抛出TypeError

3.对不可扩展的对象添加属性会抛出TypeError

函数

在严格模式下,要求命名函数的参数必须是唯一的

// 重命名参数的
// 非严格模式:没有错误,只能访问第二个参数,如果要访问第一个参数,就必须通过arguments
// 严格模式语法错误
function sum(num,num){
  //do something   
}

在严格模式下arguments对象的行为也有所不同.在严格模式下,修改命名参数的值也会反映到argument对象中,但是在严格模式下这两个值是完全独立的

function showValue(value){
 value = 'foo'
 console.log(value)
 console.log(arguments[0]) // 非严格模式 : 'foo' 严格模式 :'hello'
  
}   
showValu('hello')
                              

 函数

 在严格模式中,函数的参数必须唯一

// 重名的参数
// 非严格模式中,没有错误,只能访问第一个参数
// 严格模式 :抛出错误 Uncaught SyntaxError: Duplicate parameter name not allowed in this context
function sum(num,num){
  'use strict'
  // do something 
}

arguments对象

在非严格模式中,修改命名参数的值也会反应到arguments对象中,而严格模式坐下,这两个值是完全独立的

// 修改命名参数的值
// 非严格模式:修改会反应到arguments中
// 严格模式中不会反应到arguments中
function sum(num,num2){
  'use strict'
num=3
  console.log(arguments[0],num2)// 严格模式下输出为1,2 非严格模式下输出为3,2
}
sum(1,2)

 eval()

 eval函数最大的变化就是他在包含上下文中不在创建变量或者函数:

// 使用eval函数创建变量
// 非严格模式中:弹出框弹窗 20
// 严格模式中:调用alert(x)时报错
function doSomething(){
  eval('var x=20')
  alert(x)
}

在严格模式中,可以在eval()中声明变量和函数,但这些边行或者函数只能在被求值的特殊作用域中有效,随后就将被销毁,下面这段代码执行就是没问题的

'use strict'
var result=eval('x=1,y=13;x+y')
alert(result)

在这里,eval中声明了变量x和y,然后将他们加在一起,反悔了他们的和,于是result变量的值就是21,即x+y的结果,在调用alert时,尽管x和y已经不存在了,result变量的值还是有效的

抑制this

在非严格模式下使用函数的apply()或则call()方法时,null和undefined值会被转换为全局对象,而在严格模式下,函数的this值始终是指定的值,无论指定的是什么值:

// 访问属性
// 非严格模式:访问全局实行
// 严格模式:抛出错误,因为this的值是null
var color = "red";
function displayColor() {
 alert(this.color);
}
displayColor(null);

其他变化

在严格模式中with语句被抛弃掉了,在非严格模式中with语句能够改变解析标识符的路径,但在严格模式下,with语句被简化掉了,因此,在严格模式下使用with语句是导致语法错误

// with语句
// 非严格模式:允许
// 严格模式:抛出语法错误
with (location) {
 console.log(href);
}

总结

以上所述是小编给大家介绍的JS中的严格模式,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
用ASP将SQL搜索出来的内容导出为TXT的代码
Jul 27 Javascript
获取URL地址中的文件名和参数的javascript代码
Sep 02 Javascript
combox改进版 页面原型参考dojo的,比网上jQuery的那些combox功能强,代码更小
Apr 15 Javascript
关于onchange事件在IE和FF下的表现及解决方法
Mar 08 Javascript
js和jQuery设置Opacity半透明 兼容IE6
May 24 Javascript
详解js运算符单竖杠“|”与“||”的用法和作用介绍
Nov 04 Javascript
JavaScript实现动态增删表格的方法
Mar 09 Javascript
vue2.5.2使用http请求获取静态json数据的实例代码
Feb 27 Javascript
vue项目初始化到登录login页面的示例
Oct 31 Javascript
JavaScript this关键字指向常用情况解析
Sep 02 Javascript
Electron+vue从零开始打造一个本地播放器的方法示例
Oct 27 Javascript
JavaScript实现页面动态验证码的实现示例
Mar 23 Javascript
详解如何在你的Vue项目配置vux
Jun 04 #Javascript
详解vue-loader在项目中是如何配置的
Jun 04 #Javascript
vue.js打包之后可能会遇到的坑!
Jun 03 #Javascript
详解vue项目中如何引入全局sass/less变量、function、mixin
Jun 02 #Javascript
vue之将echart封装为组件
Jun 02 #Javascript
React学习笔记之高阶组件应用
Jun 02 #Javascript
浅谈node中的cluster集群
Jun 02 #Javascript
You might like
需要发散思维学习PHP
2009/06/29 PHP
is_uploaded_file函数引发的不能上传文件问题
2013/10/29 PHP
PHP将XML转数组过程详解
2013/11/13 PHP
Server.HTMLEncode让代码在页面里显示为源代码
2013/12/08 PHP
php中动态调用函数的方法
2015/03/16 PHP
PHP防盗链的基本思想 防盗链的设置方法
2015/09/25 PHP
php插件Xajax使用方法详解
2017/08/31 PHP
laravel 解决paginate查询多个字段报错的问题
2019/10/22 PHP
模拟电子签章盖章效果的jQuery插件源码
2013/06/24 Javascript
当前页禁止复制粘贴截屏代码小集
2013/07/24 Javascript
js和jQuery设置Opacity半透明 兼容IE6
2016/05/24 Javascript
仿百度换肤功能的简单实例代码
2016/07/11 Javascript
基于Vue.js实现数字拼图游戏
2016/08/02 Javascript
Jquery遍历select option和添加移除option的实现方法
2016/08/26 Javascript
Bootstrap基本插件学习笔记之折叠(22)
2016/12/08 Javascript
input获取焦点时底部菜单被顶上来问题的解决办法
2017/01/24 Javascript
jQuery+ThinkPHP+Ajax实现即时消息提醒功能实例代码
2017/03/21 jQuery
使用jQuery,Angular实现登录界面验证码详解
2017/04/27 jQuery
vue与vue-i18n结合实现后台数据的多语言切换方法
2018/03/08 Javascript
.netcore+vue 实现压缩文件下载功能
2020/09/24 Javascript
nuxt.js 在middleware(中间件)中实现路由鉴权操作
2020/11/06 Javascript
详解Python中的array数组模块相关使用
2016/07/05 Python
Python实现并行抓取整站40万条房价数据(可更换抓取城市)
2016/12/14 Python
利用python如何处理nc数据详解
2018/05/23 Python
在PyCharm环境中使用Jupyter Notebook的两种方法总结
2018/05/24 Python
Python利用Django如何写restful api接口详解
2018/06/08 Python
对Pandas DataFrame缺失值的查找与填充示例讲解
2018/11/06 Python
Python中的类与类型示例详解
2019/07/10 Python
python selenium循环登陆网站的实现
2019/11/04 Python
Python代码需要缩进吗
2020/07/01 Python
html5使用canvas实现弹幕功能示例
2017/09/11 HTML / CSS
美国购买新书和二手书网站:Better World Books
2018/10/31 全球购物
西班牙香水和化妆品购物网站:Arenal Perfumerías
2019/03/01 全球购物
网上开商店的创业计划书
2014/01/19 职场文书
北京故宫导游词
2015/01/31 职场文书
村级干部党员公开承诺事项
2015/05/04 职场文书