Javascript 严格模式use strict详解


Posted in Javascript onSeptember 16, 2017

严格模式:由ECMA-262规范定义的JavaScript标准,对javascrip的限制更强。

(非严格的模式,被称为“马虎模式/稀松模式/懒散模式”。)

一、严格模式的使用

严格模式可以在脚本或函数级别实现。(即全局和局部模式)

1.全局

在js文件的最前面添加    "use strict"

2.局部

在函数内部添加   "use strict",如下

function fn() {
  "use strict";
  //some code
}

二、严格模式和非严格模式的对比

1.严格模式下,无法删除(delete)变量(delete是不合格的标识符))。非严格模式下会删除失败返回false

"use strict";
var x;
delete x;//报错Delete of an unqualified identifier in strict mode.(不合格的标识符)

2.严格模式中,函数形参存在同名的,抛出错误; 非严格模式不会

严格模式下

function fn(a,a){
 "use strict";
  result=a+a;
  console.log(result);
}
fn(2,4);//Duplicate parameter name not allowed in this context(重复的参数名称在此上下文中不允许)

非严格模式下

function fn1(a,a){
  "use strict";
  result=a+a;
  console.log(result);
}
fn1(2,4);//结果为8

3.严格模式不允许八进制整数直接量(如下)。非严格模式下不会报错。

"use strict"
var x=089;
console.log(x);//报错:Decimals with leading zeros are not allowed in strict mode.

4.严格模式中,arguments对象是传入函数内实参列表的静态副本(即不再追踪参数的变化);非严格模式下,arguments对象里的元素和对应的实参是指向同一个值的引用。

严格模式下

fn(5);
function fn(a){
  "use strict";
  a = 42;
  // return a==arguments[0];//返回false
  console.log(a);//结果为42
  console.log(arguments[0]);//结果为5,严格模式下arguments[0]表示这个调用方法的第一个参数     (不再追踪  参数的变化,在函数内部,参数a被重新赋值为42,但arguments[0]仍然为5.)
}

非严格模式下

fn(5);
function fn(a){
  a = 42;
  // return a==arguments[0];//返回true
  console.log(a);//结果为42
  console.log(arguments[0]);//结果为42(追踪参数变化)

}

5.严格模式中 eval和arguments当做关键字,它们不能被赋值和用作变量声明

"use strict";
var eval=3;//报错:Unexpected eval or arguments in strict mode
var argument=6;//同样报错

6.严格模式会限制对调用栈的检测能力,访问arguments.callee,arguments.callee.caller会抛出异常

严格模式下:

"use strict";
function fn(n){
  if(n==0){
    return 1;
  }else{
    return n*arguments.callee(n-1);
  }
}
console.log(fn(5));//报错

非严格模式下:

function fn(n){//阶乘
  if(n==0){
    return 1;
  }else{
    return n*arguments.callee(n-1);
  }
}
console.log(fn(5));//正常120

caller:在一个函数调用另一个函数时,被调用函数会自动生成一个caller属性,指向调用它的函数对象。如果该函数当前未被调用,或并非被其他函数调用,

则caller为null。如下:

严格模式下:

"use strict"
function fn1() {
  var n1= fn1.caller;
  console.log(n1);
}
function fn2() {
  fn1();
}
fn2();//报错

非严格模式下:

function fn1() {
  var n1= fn1.caller;//此例中caller指向调用它的函数(fn2)
  console.log(n1);
}
function fn2() {
  fn1();
}
fn2();// 结果打印出:function fn2(){ fn1( ) };

7.严格模式变量必须先声明,直接给变量赋值,不会隐式创建全局变量,不能用with。

严格模式下

"use strict";
with(obj){
  x;
}//报错:Strict mode code may not include a with statement

解释:道运行脚本时,首先是编译,然后再执行。显然在编译的时候,所以就不能在编译时确定with语句块中的变量到底归属哪个对象。[with语句块中的变量是(cl)的属性

还是上一层变量作用域链中的变量。]。只能在执行时才能确定(c1)是Clothes的一个实例。这与严格模式有编译时就检查变量是否定义冲突,所以严格模式不会with语句的使用。

扩展:with语句的使用(用来引用某个特定对象中已有的属性,但是不能用来给对象添加属性。)

with(object instance)
{
  //代码块
}
eg:function Clothes(){
  this.color="red";
  this.size="m";
  this.price="cheap";
}
var c1=new Clothes();
with(c1){
  var str="颜色:"+color+",尺寸:"+size+",价格:"+price;
  document.write(str);
}//结果(颜色:red,尺寸:m,价格:cheap)

严格模式中 call apply传入null undefined保持原样不被转换为window

总结

以上所述是小编给大家介绍的Javascript 严格模式use strict详解,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言小编会及时回复大家的!

Javascript 相关文章推荐
jquery创建div 实现代码
Apr 27 Javascript
js截取字符串的两种方法及区别详解
Nov 05 Javascript
JavaScript中Window对象的属性及事件
Dec 25 Javascript
javascript html5实现表单验证
Mar 01 Javascript
javaScript 事件绑定、事件冒泡、事件捕获和事件执行顺序整理总结
Oct 10 Javascript
JS仿京东移动端手指拨动切换轮播图效果
Apr 10 Javascript
JavaScript中正则表达式判断匹配规则及常用方法
Aug 03 Javascript
vue中使用localstorage来存储页面信息
Nov 04 Javascript
Angular4集成ng2-file-upload的上传组件
Mar 14 Javascript
Javascript的this详解
Mar 23 Javascript
vue实现员工信息录入功能
Jun 11 Javascript
JS实现canvas简单小画板功能
Jun 23 Javascript
ES6中Array.copyWithin()函数的用法实例详解
Sep 16 #Javascript
JS闭包的几种常见形式实例详解
Sep 16 #Javascript
ES6中Array.find()和findIndex()函数的用法详解
Sep 16 #Javascript
详解JS构造函数中this和return
Sep 16 #Javascript
Angular使用Md5加密的解决方法
Sep 16 #Javascript
使用JS实现气泡跟随鼠标移动的动画效果
Sep 16 #Javascript
EasyUI创建人员树的实例代码
Sep 15 #Javascript
You might like
如何在PHP中使用Oracle数据库(2)
2006/10/09 PHP
强烈声明: 不要使用(include/require)_once
2013/06/06 PHP
php读取csv文件后,uft8 bom导致在页面上显示出现问题的解决方法
2013/08/10 PHP
php运行报错Call to undefined function curl_init()的最新解决方法
2016/11/20 PHP
PHP 出现 http500 错误的解决方法
2021/03/09 PHP
10个新的最有前途的JavaScript框架
2009/03/12 Javascript
javaScript checkbox 全选/反选及批量删除
2010/04/28 Javascript
jquery图片放大功能简单实现
2013/08/01 Javascript
javascript 获取网页标题代码实例
2014/01/22 Javascript
jquery map方法使用示例
2014/04/23 Javascript
jQuery制作效果超棒的手风琴折叠菜单
2015/04/03 Javascript
jquery控制表单输入框显示默认值的方法
2015/05/22 Javascript
使用AngularJS实现表单向导的方法
2015/06/19 Javascript
JavaScript继承学习笔记【新手必看】
2016/05/10 Javascript
javascript判断图片是否加载完成的方法推荐
2016/05/13 Javascript
浅谈JS之iframe中的窗口
2016/09/13 Javascript
原生JS实现隐藏显示图片 JS实现点击切换图片效果
2021/01/27 Javascript
SVG实现时钟效果
2018/07/17 Javascript
Vue路由前后端设计总结
2019/08/06 Javascript
在vue和element-ui的table中实现分页复选功能
2019/12/04 Javascript
小程序跳转到的H5页面再跳转回跳小程序的方法
2020/03/06 Javascript
[01:11:48]Fnatic vs IG 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
使用Python的Treq on Twisted来进行HTTP压力测试
2015/04/16 Python
python-opencv 将连续图片写成视频格式的方法
2019/01/08 Python
浅谈python str.format与制表符\t关于中文对齐的细节问题
2019/01/14 Python
Python中函数参数匹配模型详解
2019/06/09 Python
Python类中方法getitem和getattr详解
2019/08/30 Python
Python基于read(size)方法读取超大文件
2020/03/12 Python
python 模拟登陆163邮箱
2020/12/15 Python
应届本科毕业生求职信
2014/07/23 职场文书
2015年小学校长工作总结
2015/05/19 职场文书
2016年党员读书月活动总结
2016/04/06 职场文书
导游词之淮安明祖陵
2019/11/25 职场文书
能用CSS实现的就不要麻烦JavaScript了
2021/10/05 HTML / CSS
HTML5+CSS+JavaScript实现捉虫小游戏设计和实现
2021/10/16 HTML / CSS
Python语言内置数据类型
2022/02/24 Python