好程序员web前端教程之详解JavaScript严格模式

简介:

  好程序员web前端教程之详解JavaScript严格模式,严格模式(Strict mode)是由ECMA-262规范定义的新兴JavaScript标准,发布于2009年12月第五版。旨在改善错误检查功能并且标识可能不会延续到未来JavaScript版本的脚本。ES5严格模式是限制性更强的JavaScript变体,它与常规JavaScript的语义不同,其分析更为严格。
  目前,除了IE6-9,其它浏览器均已支持ES5严格模式。
一、严格模式的使用
严格模式 的使用很简单,只有在代码首部加入字符串 “use strict”。有两种应用场景,一种是全局模式,一种是局部模式。
1)全局模式
'use strict'//code
2)局部模式
将”use strict”放到函数内的第一行,如下
function() {

"use strict";
//code}

二、严格模式下的执行限制
1)不使用var声明变量严格模式中将不通过
我们知道JS中,不使用var声明的变量默认转为全局变量。但在严格模式中将不允许,会报语法错误。
'use strict'g = 100 //错误
比如for循环
'use strict'for (i=0; i<5; i++) { //错误 console.log(i)}
2)任何使用’eval’的操作都会被禁止
'use strict'var obj = {}var eval = 3for (var eval in obj) {}function eval() {}function func(eval) {}
3)eval作用域 JS中作用域有两种,全局作用域和函数作用域。严格模式带来了第三种作用域:eval作用域,如下
'use strict'var a = 10eval('var a = 20; console.log(a)'); //20console.log(a) //10
4)with被禁用
'use strict'var obj = {
name:'zhangsan',
age:100,
sex:'男'}with(obj) { //报错 console.log(name);

console.log(age);
console.log(sex);}

5)caller/callee 被禁用
function func() {

'use strict'
arguments.callee
arguments.caller}func()

6)对禁止扩展的对象添加新属性会报错
'use strict'var obj = {}Object.preventExtensions(obj)obj.a = 1 // 报错
7)删除系统内置的属性会报错
'use strict'delete Object.prototype // 报错delete Function.prototype // 报错
8)delete使用var声明的变量或挂在window上的变量报错
'use strict'var obj = {a:1}window.a = 1delete obj // 报错delete a // 报错
9)delete不可删除属性(isSealed或isFrozen)的对象时报错
'use strict'var obj = {a: 1}Object.seal(obj)delete obj.a //报错
10)对一个对象的只读属性进行赋值将报错
'use strict'var obj = {}Object.defineProperty(obj, 'a', {value: 1, writable: false})obj.a = 2 // 报错
11)函数有重名的参数将报错
'use strict'function func(a, a) {

alert(a)}func()

而在非严格模式中,后面的同名参数将覆盖前面的。
12)八进制表示法被禁用
'use strict'var num = 022
13)arguments严格定义为参数,不再与形参绑定
function func(a) {

arguments[0] = 2
alert(a) // 2}  func(1)

func调用时传参为1,函数内部通过arguments修改为2,此时alert的为修改后的2。 而在严格模式中则不能被修改,如下
'use strict'function func(a) {

arguments[0] = 2
alert(a) // 1}  func(1)

14)函数必须声明在顶层
我们知道函数声明和函数表达式是两个不同的概念。一般函数声明都在最顶层,ES5前的JS宽松,你可以写在if或for内。当然Firefox的解析方式与其他浏览器不同,见SJ9002。而在严格模式中这些写法将直接报错
'use strict'if (true) {

function func1() { } // 语法错误}for (var i = 0; i < 5; i++) {
function func2() { } // 语法错误}

15)ES5里新增的关键字不能当做变量标示符使用,如implements, interface, let, package, private, protected, public, static, yield
'use strict'var let = 10 //报错var yield = 20
16)call/apply的第一个参数直接传入不包装为对象
'use strict'function func() {

console.log(typeof this)}func.call('abcd') // stringfunc.apply(1)     // number

依次为”string”,”number”。而在非严格模式中call/apply将对值类型的”abcd”,1包装为对象后传入,即两次输出都为”object”。
17)call/apply的第一个参数为null/undefined时,this为null/undefined 这里以call来示例
'use strict'function func() {

console.log(this)}func.call(undefined) // undefinedfunc.call(null)      // null

依次是undefined,null。而非严格模式中则是宿主对象,浏览器里是window,node.js环境则是global。
18)bind的第一个参数为null/undefined时,this为null/undefined bind是ES5给Function.prototype新增的一个方法,它和call/apply一样在function上直接调用。它返回一个指定了上下文和参数的函数。当它的第一个参数为null/undefined时,情形和call/apply一样,this也为null/undefined。
'use strict'function func() {

console.log(this)}var f1 = func.bind(null)var f2 = func.bind(undefined)f1() // nullf2() // undefined

而在非严格模式中输出的都是window(或global)。
“use strict” 的位置必须在首部。首部指其前面没有任何有效js代码。以下都是无效的,将不会触发严格模式。
a)“use strict” 前有代码, 无效
var width = 10'use strict' g = 100
b)“use strict” 前有个空语句,无效
;//这里是空语句'use strict' g = 100

function func() {

;
'use strict'
g = 200}

function func() {

;'use strict'
localVar = 200}

当然,“use strict”前加注释是可以的
// strict mode'use strict'g = 100
function func() {

// strict mode    'use strict'
g = 200}func()
相关文章
|
2天前
|
前端开发 JavaScript
前端ES5 | js —添加元素方法
前端ES5 | js —添加元素方法
|
1天前
|
前端开发 JavaScript 开发者
现代前端框架激烈交锋,高效响应式 Web 界面的归属扑朔迷离!
【9月更文挑战第6天】本文通过实际案例,比较了主流前端框架 Vue.js、React 和 Angular 的特点与优势。Vue.js 以简洁的语法和灵活的组件化架构著称,适合小型到中型项目;React 强调性能和可扩展性,适用于大型应用;Angular 凭借全面的功能和严格架构,适合企业级开发。开发者应根据项目需求和技术栈选择合适的框架。
9 0
|
7天前
|
开发者 图形学 API
从零起步,深度揭秘:运用Unity引擎及网络编程技术,一步步搭建属于你的实时多人在线对战游戏平台——详尽指南与实战代码解析,带你轻松掌握网络化游戏开发的核心要领与最佳实践路径
【8月更文挑战第31天】构建实时多人对战平台是技术与创意的结合。本文使用成熟的Unity游戏开发引擎,从零开始指导读者搭建简单的实时对战平台。内容涵盖网络架构设计、Unity网络API应用及客户端与服务器通信。首先,创建新项目并选择适合多人游戏的模板,使用推荐的网络传输层。接着,定义基本玩法,如2D多人射击游戏,创建角色预制件并添加Rigidbody2D组件。然后,引入网络身份组件以同步对象状态。通过示例代码展示玩家控制逻辑,包括移动和发射子弹功能。最后,设置服务器端逻辑,处理客户端连接和断开。本文帮助读者掌握构建Unity多人对战平台的核心知识,为进一步开发打下基础。
24 0
|
7天前
|
Java Spring 数据库
怎样动动手指就能实现数据操作?Spring Data JPA背后的魔法揭秘
【8月更文挑战第31天】在Java开发中,数据库交互至关重要。传统的JDBC操作繁琐且难维护,而Spring Data JPA作为集成JPA的数据访问层解决方案,提供了CRUD等通用操作接口,显著减少代码量。通过继承`JpaRepository`,开发者能轻松实现数据的增删改查,甚至复杂查询和分页也不再困难。本文将通过示例详细介绍如何利用Spring Data JPA简化数据访问层的开发,提升代码质量和可维护性。
14 0
|
7天前
|
API Java Python
API的神秘面纱:从零开始构建你的RESTful服务
【8月更文挑战第31天】在现代网络应用开发中,RESTful API已成为数据交互的标准。本文通过比较流行的技术栈(如Node.js、Python的Django和Flask、Java的Spring Boot)及其框架,帮助你理解构建RESTful API的关键差异,涵盖性能、可扩展性、开发效率、社区支持、安全性和维护性等方面,并提供示例代码和最佳实践,指导你选择最适合项目需求的工具,构建高效、安全且易维护的API服务。
16 0
|
7天前
|
Java Spring 容器
彻底改变你的编程人生!揭秘 Spring 框架依赖注入的神奇魔力,让你的代码瞬间焕然一新!
【8月更文挑战第31天】本文介绍 Spring 框架中的依赖注入(DI),一种降低代码耦合度的设计模式。通过 Spring 的 DI 容器,开发者可专注业务逻辑而非依赖管理。文中详细解释了 DI 的基本概念及其实现方式,如构造器注入、字段注入与 setter 方法注入,并提供示例说明如何在实际项目中应用这些技术。通过 Spring 的 @Configuration 和 @Bean 注解,可轻松定义与管理应用中的组件及其依赖关系,实现更简洁、易维护的代码结构。
11 0
|
7天前
|
Android开发 iOS开发 C#
Xamarin:用C#打造跨平台移动应用的终极利器——从零开始构建你的第一个iOS与Android通用App,体验前所未有的高效与便捷开发之旅
【8月更文挑战第31天】Xamarin 是一个强大的框架,允许开发者使用单一的 C# 代码库构建高性能的原生移动应用,支持 iOS、Android 和 Windows 平台。作为微软的一部分,Xamarin 充分利用了 .NET 框架的强大功能,提供了丰富的 API 和工具集,简化了跨平台移动应用开发。本文通过一个简单的示例应用介绍了如何使用 Xamarin.Forms 快速创建跨平台应用,包括设置开发环境、定义用户界面和实现按钮点击事件处理逻辑。这个示例展示了 Xamarin.Forms 的基本功能,帮助开发者提高开发效率并实现一致的用户体验。
13 0
|
7天前
|
开发者 C# Android开发
明白吗?Xamarin与Native的终极对决:究竟哪种开发方式更适合您的项目需求,让我们一探究竟!
【8月更文挑战第31天】随着移动应用开发的普及,开发者面临多种技术选择。本文对比了跨平台解决方案Xamarin与原生开发方式的优势与劣势。Xamarin使用C#进行跨平台开发,代码复用率高,可大幅降低开发成本;但因基于抽象层,可能影响性能。原生开发则充分利用平台特性,提供最佳用户体验,但需维护多套代码库,增加工作量。开发者应根据项目需求、团队技能和预算综合考量,选择最适合的开发方式。
47 0
|
7天前
|
开发者 Android开发 iOS开发
Xamarin开发者的神器!揭秘你绝不能错过的插件和工具,让你的开发效率飞跃式提升
【8月更文挑战第31天】Xamarin.Forms 是一个强大的框架,让开发者通过单一共享代码库构建跨平台移动应用,支持 iOS、Android 和 Windows。使用 C# 和 XAML,它简化了多平台开发流程,保持一致的用户体验。本指南通过创建一个简单的 “HelloXamarin” 应用介绍 Xamarin.Forms 的基本功能和工作原理。首先配置 Visual Studio 开发环境,然后创建并运行一个包含标题、按钮和消息标签的示例应用,展示如何定义界面布局及处理按钮点击事件。这帮助开发者快速入门 Xamarin.Forms,提高跨平台应用开发效率。
19 0
|
26天前
|
存储 前端开发 JavaScript
前端语言串讲 | 青训营笔记
前端语言串讲 | 青训营笔记
19 0
下一篇
DDNS