深入浅析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 相关文章推荐
js使用for循环与innerHTML获取选中tr下td值
Sep 26 Javascript
Javascript中的包装类型介绍
Apr 02 Javascript
jQuery实现Email邮箱地址自动补全功能代码
Nov 03 Javascript
基于Bootstrap实现Material Design风格表单插件 附源码下载
Apr 18 Javascript
JS实现消息来时让网页标题闪动效果的方法
Apr 20 Javascript
Webpack打包慢问题的完美解决方法
Mar 16 Javascript
bootstrap响应式导航条模板使用详解(含下拉菜单,弹出框)
Nov 17 Javascript
vue.js element-ui validate中代码不执行问题解决方法
Dec 18 Javascript
layUI实现前端分页和后端分页
Jul 27 Javascript
解决vue项目F5刷新mounted里的函数不执行问题
Nov 05 Javascript
彻底搞懂并解决vue-cli4中图片显示的问题实现
Aug 31 Javascript
js实现可爱的气泡特效
Sep 05 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 防注入函数(格式化数据)
2011/08/08 PHP
php读取文件内容的方法汇总
2015/01/24 PHP
php随机显示指定文件夹下图片的方法
2015/07/13 PHP
实例说明js脚本语言和php脚本语言的区别
2019/04/04 PHP
PHP session垃圾回收机制实例分析
2019/06/28 PHP
基于php+MySql实现学生信息管理系统实例
2020/08/04 PHP
js 返回时间戳所对应的具体时间
2010/07/20 Javascript
Angularjs实现多个页面共享数据的方式
2016/03/29 Javascript
ionic实现可滑动的tab选项卡切换效果
2020/04/15 Javascript
Node.JS中快速扫描端口并发现局域网内的Web服务器地址(80)
2017/09/18 Javascript
基于react后端渲染模板引擎noox发布使用
2018/01/11 Javascript
解决axios发送post请求返回400状态码的问题
2018/08/11 Javascript
详解如何配置vue-cli3.0的vue.config.js
2018/08/23 Javascript
在Vant的基础上封装下拉日期控件的代码示例
2018/12/05 Javascript
微信小程序下拉框组件使用方法详解
2018/12/28 Javascript
vue实现的上拉加载更多数据/分页功能示例
2019/05/25 Javascript
vue实现给div绑定keyup的enter事件
2020/07/31 Javascript
手把手教你如何编译打包video.js
2020/12/09 Javascript
python有证书的加密解密实现方法
2014/11/19 Python
Python3中的2to3转换工具使用示例
2015/06/12 Python
详解 Python中LEGB和闭包及装饰器
2017/08/03 Python
Python使用爬虫爬取静态网页图片的方法详解
2018/06/05 Python
对python中的six.moves模块的下载函数urlretrieve详解
2018/12/19 Python
python实现对服务器脚本敏感信息的加密解密功能
2019/08/13 Python
python 上下文管理器及自定义原理解析
2019/11/19 Python
Python使用urllib模块对URL网址中的中文编码与解码实例详解
2020/02/18 Python
tensorflow之读取jpg图像长和宽实例
2020/06/18 Python
韩国知名的家庭购物网站:CJmall
2016/08/01 全球购物
几道PHP面试题
2013/04/14 面试题
js正则匹配markdown里的图片标签的实现
2021/03/24 Javascript
环境科学专业优秀毕业生自荐书
2014/02/03 职场文书
单位活动策划方案
2014/08/17 职场文书
房屋鉴定委托书范本
2014/09/23 职场文书
生活小常识广播稿
2015/08/19 职场文书
python实现网络五子棋
2021/04/11 Python
el-form每行显示两列底部按钮居中效果的实现
2022/08/05 HTML / CSS