开发者社区> 好程序员> 正文

好程序员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()

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
微软新工具准确率达 80% ,程序员:我谢谢您嘞~
微软宣布推出一种可以提高大型语言模型性能的新工具 Jigsaw。“大型的预训练语言模型(如 GPT-3、Codex 等),可以被调整为从程序员意图的自然语言规范中生成代码。这种自动化模型有可能提高世界上每个程序员的生产力;但是,由于这些模型可能难以理解程序语义,因此所生成的代码的质量不能得到保证。” 根据介绍,Jigsaw 部署了理解程序语法和语义的后处理技术,然后利用用户反馈来提高未来的性能;该工具旨在使用多模式输入为 Python Pandas API 合成代码。
5 0
IDEA maven web项目无法加载css,js,image等一系列路径问题
我们大二班级 刚刚学习maven 控制台输出 和mybatis的时候我提前进入学习的路程自己摸索 maven web开发 遇到了各种配置环境还有运行报错一大堆的问题, 前面的问题都属于环境配置看我之前的博客吧 这里主要讲解路径问题 步入:很多新手按照之前的步骤 部署网站的时候 发现css,js,image,还有各种有关路径的引入都无法显示,因为这些静态资源很有可能被spring拦截 方案:必须在web.xml文件中设置其为可加载资源
5 0
高校学生在家实践ECS弹性云服务器
简单谈谈我这几周使用ECS弹性云服务器的体验感
5 0
跳槽涨薪后一个月考核转正——C# 面试考核基础知识
以上文章讲述的是【SQL调优与设计规范】接下来我总结一下【C# 面试考核基础知识】。
4 0
飞天加速计划初体验
最近因需要使用云服务器来学习,老师让我们用这个阿里云类进行相关的学习,让我们先进行免费的使用进行学习,慢慢了解,毕竟对于首次接触的事物都是了解为主不会投入大量资金。阿里云平台有详细的教程,让初学者能十分轻松的进行学习。飞天加速计划是个好想法,可以让我们这些学生进行学习,制作出自己的网站。让我在暑假对计算机有了浓厚的兴趣,于是在阿里云我选择了飞天加速计划,学习大数据和服务器啥的,让自己get到更多的知识~
4 0
ECS使用体验
在阿里云领取了一个服务器,分享一下使用体验
5 0
飞天加速计划初体验
最近因需要使用云服务器来学习,老师让我们用这个阿里云类进行相关的学习,让我们先进行免费的使用进行学习,慢慢了 解,毕竟对于首次接触的事物都是了解为主不会投入大量资金。阿里云平台有详细的教程,让初学者能十分轻松的进行学习 。飞天加速计划是个好想法,可以让我们这些学生进行学习,制作出自己的网站。让我在暑假对计算机有了浓厚的兴趣,于 是在阿里云我选择了飞天加速计划,学习大数据和服务器啥的,让自己get到更多的知识~
4 0
SLS日志服务
SLS日志服务
4 0
SpringMVC源码分析:POST请求中的文件处理
一起阅读和分析SpringMVC的部分源码,看看收到POST请求中的二进制文件后,SpingMVC框架是如何处理的
5 0
+关注
333
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
OceanBase 入门到实战教程
立即下载
阿里云图数据库GDB,加速开启“图智”未来.ppt
立即下载
实时数仓Hologres技术实战一本通2.0版(下)
立即下载