深入浅析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 相关文章推荐
让插入到 innerHTML 中的 script 跑起来的实现代码
Jul 01 Javascript
ExtJS 2.0 GridPanel基本表格简明教程
May 25 Javascript
前端开发必须知道的JS之原型和继承
Jul 06 Javascript
jquery 删除cookie失效的解决方法
Nov 12 Javascript
javascript 数组的定义和数组的长度
Jun 07 Javascript
JavaScript性能优化之函数节流(throttle)与函数去抖(debounce)
Aug 11 Javascript
JavaScript 事件流、事件处理程序及事件对象总结
Apr 01 Javascript
利用jquery正则表达式在页面验证url网址输入是否正确
Apr 04 jQuery
vue-cli webpack 开发环境跨域详解
May 18 Javascript
vue.js 底部导航栏 一级路由显示 子路由不显示的解决方法
Mar 09 Javascript
JS正则表达式常见函数与用法小结
Apr 13 Javascript
详解Vue slot插槽
Nov 20 Vue.js
详解如何在你的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
WordPress判断用户是否登录的代码
2011/03/17 PHP
判断PHP数组是否为空的代码
2011/09/08 PHP
PHP基于curl后台远程登录正方教务系统的方法
2016/10/14 PHP
解决Laravel5.2 Auth认证退出失效的问题
2019/10/14 PHP
一款Jquery 分页插件的改造方法(服务器端分页)
2011/07/11 Javascript
jQuery EasyUI API 中文文档 - ValidateBox验证框
2011/10/06 Javascript
js使用正则实现ReplaceAll全部替换的方法
2014/08/22 Javascript
jquery ui resize 中border-box的bug修正
2015/04/26 Javascript
jQuery EasyUI学习教程之datagrid点击列表头排序
2016/07/09 Javascript
jQuery EasyUI 右键菜单--关闭标签/选项卡的简单实例
2016/10/10 Javascript
JS日期对象简单操作(获取当前年份、星期、时间)
2016/10/26 Javascript
基于jQuery的select下拉框选择触发事件实例分析
2016/11/18 Javascript
Javascript 实现全屏滚动实例代码
2016/12/31 Javascript
基于axios 解决跨域cookie丢失的问题
2018/09/26 Javascript
Openlayers实现地图全屏显示
2020/09/28 Javascript
vue-cli4使用全局less文件中的变量配置操作
2020/10/21 Javascript
[01:13]这,就是刀塔
2014/07/16 DOTA
python的re模块应用实例
2014/09/26 Python
浅析python的优势和不足之处
2018/11/20 Python
用python爬取租房网站信息的代码
2018/12/14 Python
对Django中的权限和分组管理实例讲解
2019/08/16 Python
关于PyTorch源码解读之torchvision.models
2019/08/17 Python
python二维键值数组生成转json的例子
2019/12/06 Python
tensorflow之tf.record实现存浮点数数组
2020/02/17 Python
PyCharm设置Ipython交互环境和宏快捷键进行数据分析图文详解
2020/04/23 Python
Python如何实现大型数组运算(使用NumPy)
2020/07/24 Python
Python 实现简单的客户端认证
2020/07/29 Python
HTML5 表单验证失败的提示语问题
2017/07/13 HTML / CSS
英国独特家具和家庭用品购物网站:Cuckooland
2020/08/30 全球购物
GWT的应用有哪两种部署模式
2012/12/21 面试题
GWT都有什么特性
2016/12/02 面试题
交通事故一次性赔偿协议书范本
2014/11/02 职场文书
2014年测量员工作总结
2014/12/12 职场文书
防震减灾主题班会
2015/08/14 职场文书
六五普法心得体会2016
2016/01/21 职场文书
Nginx实现高可用集群构建(Keepalived+Haproxy+Nginx)
2021/05/27 Servers