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 相关文章推荐
解读JavaScript代码 var ie = !-[1,] 最短的IE判定代码
May 28 Javascript
javascript笔记 String类replace函数的一些事
Sep 22 Javascript
Jquery遍历checkbox获取选中项value值的方法
Feb 13 Javascript
jquery实现邮箱自动补全功能示例分享
Feb 17 Javascript
EasyUI中实现form表单提交的示例分享
Mar 01 Javascript
javascript操作ul中li的方法
May 14 Javascript
AngularJS 2.0新特性有哪些
Feb 18 Javascript
Javascript中Date类型和Math类型详解
Feb 27 Javascript
基于JavaScript实现 网页切出 网站title变化代码
Apr 03 Javascript
浅谈JavaScript闭包
Apr 09 Javascript
vue elementUI 表单校验的实现代码(多层嵌套)
Nov 06 Javascript
vue-cli 3如何使用vue-bootstrap-datetimepicker日期插件
Feb 20 Vue.js
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函数代码
2013/08/29 PHP
PHP使用第三方即时获取物流动态实例详解
2017/04/27 PHP
Yii框架实现的验证码、登录及退出功能示例
2017/05/20 PHP
PHP7 安装event扩展的实现方法
2019/10/08 PHP
jquery选择器(常用选择器说明)
2010/09/28 Javascript
密码框显示提示文字jquery示例
2013/08/29 Javascript
jquery实现table鼠标经过变色代码
2013/09/25 Javascript
使用jquery获取网页中图片高度的两种方法
2013/09/26 Javascript
javascript写的一个模拟阅读小说的程序
2014/04/04 Javascript
javascript操作符"!~"详解
2015/02/10 Javascript
js实现图片360度旋转
2017/01/22 Javascript
详解VueJs异步动态加载块
2017/03/09 Javascript
详解Vue.js基于$.ajax获取数据并与组件的data绑定
2017/05/26 Javascript
jQuery插件ImgAreaSelect实现头像上传预览和裁剪功能实例讲解一
2017/05/26 jQuery
基于JS实现html中placeholder属性提示文字效果示例
2018/04/19 Javascript
node中实现删除目录的几种方法
2019/06/24 Javascript
前端插件之Bootstrap Dual Listbox使用教程
2019/07/23 Javascript
js通过循环多张图片实现动画效果
2019/12/19 Javascript
微信小程序自定义modal弹窗组件的方法详解
2020/12/20 Javascript
[02:12]2015国际邀请赛 SHOWOPEN
2015/08/05 DOTA
Django 内置权限扩展案例详解
2019/03/04 Python
Python提取PDF内容的方法(文本、图像、线条等)
2019/09/25 Python
Python3.x+pyqtgraph实现数据可视化教程
2020/03/14 Python
pyecharts调整图例与各板块的位置间距实例
2020/05/16 Python
详解python内置模块urllib
2020/09/09 Python
python制作一个简单的gui 数据库查询界面
2020/11/19 Python
戴尔美国官网:Dell
2016/08/31 全球购物
Sandro Paris美国官网:典雅别致的法国时尚服饰品牌
2017/12/26 全球购物
Brora官网:英国领先的羊绒服装品牌
2019/08/28 全球购物
函授大学生自我鉴定
2014/02/05 职场文书
婚礼答谢宴主持词
2014/03/14 职场文书
买房委托公证书
2014/04/08 职场文书
教师求职自荐信范文
2015/03/04 职场文书
遇事可以测出您的见识与格局
2019/09/16 职场文书
Pytorch中的数据集划分&正则化方法
2021/05/27 Python
详解解Django 多对多表关系的三种创建方式
2021/08/23 Python