往期文章

【JS ES6】const var let 一文搞懂声明关键字所有的知识点

[JS ES6]传值和传址


目录

什么是严格模式

启用严格模式

严格模式中的变化


由于 JavaScript 语法不够严谨,一直被人们所诟病,例如在使用一个变量时,可以不使用 var 关键字来提前声明(例如:url = 'http://c.biancheng.net/';),此时 JavaScript 解释器会自动为您创建这个变量。为了使代码更加严谨,JavaScript 中引入了严格模式,一旦使用了严格模式,将不再允许使用那些不严谨的语法。

什么是严格模式

严格模式是在 ECMAScript5(ES5)中引入的,在严格模式下,JavaScript 对语法的要求会更加严格,一些在正常模式下能够运行的代码,在严格模式下将不能运行。

添加严格模式,主要有以下几个目的:

  • 消除 JavaScript 语法中一些不合理、不严谨的地方;
  • 消除代码中一些不安全的地方,保证代码的安全运行;
  • 提高 JavaScript 程序的运行效率;
  • 为以后新版本的 JavaScript 做好铺垫。

目前,主流浏览器包括 IE10 及其之后的版本都已支持严格模式,JavaScript 正在向着更合理、更安全、更严谨的方向发展。

启用严格模式

要启用严格模式,您只需要在 JavaScript 脚本的开头添加"use strict";'use strict';指令即可,如下所示:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>JavaScript</title>
</head>
<body><script>"use strict";x = 'http://c.binacheng.net/'; // 此处报错:Uncaught ReferenceError: x is not defined at index.html:11console.log(x);</script>
</body>
</html>

如果将"use strict";指令添加到 JavaScript 程序的第一行,则表示整个脚本都会处于严格模式。如果在函数的第一行代码中添加"use strict";,则表示只在该函数中启用严格模式。如下例所示:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>JavaScript</title>
</head>
<body><script>x = 'http://c.binacheng.net/';console.log(x);function sayHello(){'use strict';str = 'welcome http://c.binacheng.net/'; // 调用 sayHello() 函数在此处报错:Uncaught ReferenceError: str is not defined at sayHello (index.html:14) at index.html:17console.log(str);}sayHello();</script>
</body>
</html>

注意:"use strict";'use strict';指令只有在整个脚本第一行或者函数第一行时才能被识别,除了 IE9 以及更低的版本外,所有的浏览器都支持该指令。

严格模式中的变化

相对于普通模式来说,严格模式对 JavaScript 的语法都做了一些改变。

1、不允许使用未声明的变量

普通模式下,如果一个变量还没有声明,就直接拿来赋值,JavaScript 解释器会自动为您创建这个变量。而在严格模式下,则不允许这么做,所有变量在使用前必须显式的声明,否则将会抛出一个 ReferenceError 错误。

"use strict";
v = 1;        // 此处报错:Uncaught ReferenceError: v is not defined
for(i = 0; i < 2; i++) { // 此处报错:Uncaught ReferenceError: i is not defined
}

2、不允许删除变量或函数

在严格模式下,如果您尝试删除一个变量或函数,则会抛出语法错误。而在普通模式下,虽然不会成功,但并不报错。

"use strict";
var person = {name: "Peter", age: 28};
delete person;  // 此处报错:Uncaught SyntaxError: Delete of an unqualified identifier in strict mode.
function sum(a, b) {return a + b;
}
delete sum;  // 此处报错:Uncaught SyntaxError: Delete of an unqualified identifier in strict mode.

3、函数中不允许有同名的参数

在严格模式下,如果函数中有两个或多个同名参数,则会抛出语法错误,而在普通模式下则不会。

"use strict";
function square(a, a) {     // 此处报错:Uncaught SyntaxError: Duplicate parameter name not allowed in this contextreturn a * a;
}

4、eval 语句的作用域是独立的

普通模式下,eval 语句的作用域取决于它所在的位置,而在严格模式下,eval 语句本身就是一个局部作用域,通过 eval 语句生成的变量只能在 eval 语句内使用。

"use strict";
eval("var x = 5; console.log(x);");
console.log(x);     // 此处报错:Uncaught ReferenceError: x is not defined

5、不允许使用 with 语句

在严格模式下,不允许使用 with 语句。

"use strict";
var radius1 = 5;
var area1 = Math.PI * radius1 * radius1;
var radius2 = 5;
with(Math) {        // 此处报错:Uncaught SyntaxError: Strict mode code may not include a with statementvar area2 = PI * radius2 * radius2;
}

6、不允许写入只读属性

在严格模式下,不允许为只读或不存在的属性赋值,否则会造成语法错误,而在普通模式下,虽然不会成功,但并不会报错。

"use strict";
var person = {name: "Peter", age: 28};
Object.defineProperty(person, "gender", {value: "male", writable: false});
person.gender = "female"; // 此处报错:Uncaught TypeError: Cannot assign to read only property 'gender' of object '#<Object>'

7、不允许使用八进制数

在严格模式下,不允许使用八进制数(以零为前缀的数字,例如 010、0377),而在普通模式下则可以。

"use strict";
var x = 010; // 此处报错:Uncaught SyntaxError: Octal literals are not allowed in strict mode.
console.log(parseInt(x));

8、不能在 if 语句中声明函数

在严格模式下,不能在 if 语句中声明函数,调用在 if 语句中定义的函数时,会提示函数未定义。

"use strict";
//如果在if语句中声明函数,则会产生语法错误
if (true) {function demo() { // 此处报错:Uncaught ReferenceError: demo is not definedconsole.log("http://c.biancheng.net/");}
}
demo();

9、禁止使用 this 表示全局对象

在普通模式下,this 关键字表示全局对象 window,而在严格模式下,this关键字则表示 undefined。

"use strict";
var name = "http://c.biancheng.net/";
function demoTest() {console.log(this);
}
demoTest();

【JS ES6】use strict 严格模式相关推荐

  1. JS笔记 | JS中的strict model(严格模式)

    仅做笔记分享,如有错误请高手指出 ECMAscript5中引入了strict model.严格模式下的JS程序需要比非严格模式下的程序更加规范.严格模式对语法做了比较严格的要求, 变量上的不同 mes ...

  2. JS es6的Class类详解

    文章目录 JS es6的Class类详解 class基本语法 Class的基本语法之constructor Class的基本语法之类的调用方式 Class的基本语法之getter和setter Cla ...

  3. 笔记,前端重点 js,es6,vue2,vue3,小程序...... (记得收藏)

    ------------vue2 部分面试题--------# (1)防抖:就是将一段时间内连续的多次触发转化为一次触发. (2)节流:减少一段时间内触发的频率 区别:两者区别在于函数节流是固定时间做 ...

  4. java严格模式_“use strict” 严格模式使用(前端基础系列)

    ECMAscript5添加一种严格模式的运行模式("use strict"),让你的js语句在更加严格的环境下进行运行: 一.主要作用: 消除版本javascript中一些不合理及 ...

  5. “use strict” 严格模式使用(前端基础系列)

    ECMAscript5添加一种严格模式的运行模式("use strict"),让你的js语句在更加严格的环境下进行运行: 一.主要作用: 消除版本javascript中一些不合理及 ...

  6. JS ES6中export和import详解

    1.Export 模块是独立的文件,该文件内部的所有的变量外部都无法获取.如果希望获取某个变量,必须通过export输出, // profile.js export var firstName = ' ...

  7. JS魔法堂:浏览器模式和文档模式怎么玩?

    一.前言 从IE8开始引入了文档兼容模式的概念,作为开发人员的我们可以在开发人员工具中通过"浏览器模式"和"文档模式"(IE11开始改为"浏览器模式& ...

  8. Vue2系列教程——将js ES6兼容IE浏览器

    Vue2 将js ES6兼容IE浏览器 使用@babel-polyfill,可以将 Vue 中 ES6 的语法转成兼容 IE 内核的语法,配置如下, 安装@babel-polyfill,注意这里要用 ...

  9. [HTML CSS JS ES6 JS WebAPI JQuery]学习笔记目录

    文章目录 前言 HTML HTML 知识整理与补充 CSS CSS 知识整理与补充 JS ES6 JS Web API JQuery JS 知识整理与补充 前言 根据视频和PPT整理 视频及对应资料: ...

  10. JS ES6 加减乘除法小数浮点数计算BUG解决

    2018年3月6日 JS ES6 加减乘除法小数浮点数计算BUG解决 //检测是否为数字let num = (a) => {if(a != null && a.toString( ...

最新文章

  1. pythonapriori算法特点_Python --深入浅出Apriori关联分析算法(一)
  2. myeclipse安装svn插件的多种方式
  3. titanium开发教程-04-11其他属性和方法
  4. 关于printf()与自增自减运算符结和问题
  5. 深度学习方法(五):卷积神经网络CNN经典模型整理Lenet,Alexnet,Googlenet,VGG,Deep Residual Learning
  6. 一款黑科技让普通屏幕秒变触摸屏,厉害了我的哥
  7. python代码删掉了几行怎么撤回_78行Python代码实现现微信撤回消息功能
  8. ssl1747-登山机器人【离散化,玄学,贪心】
  9. 微信分享 ajax冲突,微信jssdk分享功能开发及解决ajax跨域的问题
  10. vb6在后台将窗体保存到图片_如何将寺库网多个商品图片一键分类保存到一个目录...
  11. 计算机系统性错误,《深入理解计算机系统-异常》
  12. 我们不再需要 Chrome?
  13. lambda函数if_Python中lambda的使用,与它的三个好基友介绍
  14. root工具android10,KingRoot安卓10root工具 5.4.0最新版
  15. [BZOJ3993] [SDOI2015]星际战争(最大流+二分)
  16. 【7gyy】密码丢了?揭秘你的密码是如何被偷走的
  17. 什么是PO设计(封装)?
  18. 2018入门微单相机推荐
  19. 最全Java各修饰符详解(接口、类、方法、变量)
  20. html在线翻译,HTML实现调用百度在线翻译API

热门文章

  1. 如何在php中针对距现在时间长短显示不同时间格式
  2. 2021年口碑超好旗舰:蓝牙耳机排行榜10强推荐
  3. SAP系统销售流程成本和收入的确认
  4. Transformer BEV perception
  5. 计算机菜单专业英语,InDesign中英文菜单对照表 -电脑资料
  6. 30分钟读懂Linux五大模块内核源码,内核整体架构设计
  7. matlab中正弦信号的功率计算,范数norm
  8. 《数字信号处理》正弦信号的波形及频谱的求解
  9. 中国大陆加港澳台手机正则验证
  10. 爬取武汉大学教务系统数据