文档章节

养成一个好习惯:在严格模式下开发Javascript

顽Shi
 顽Shi
发布于 2014/06/13 14:00
字数 1487
阅读 5046
收藏 188
点赞 15
评论 16

  前言

    坦白说对于Javascript所谓的严格模式在今年早些时候我还一无所知,真正在开发中应用也就几个月.对于这个ECMAScript5就已经引入的东西,已经不能算新了,对于这个东西一直处在字面的理解上,就是"更加严格,规范的限制Javscript代码的书写",今天打算结合使用的经验好好研究下它到底是怎么回事.

  正文

    Javascript中如果你想你的代码在严格模式下运行,非常简单,只要在代码的第一行,也就是首行加上"use strict"指令即可.对于那些不支持ECMAScript5的浏览器来说它没有任何影响,所以如果想它生效要确定一下你的浏览器,不是所有浏览器都支持,毕竟我们给力的国情决定IE还是市场主力,IE10一下的同学要注意了.

    使用"use strict"能给开发带来什么好处?

    其实如果你一直在Chrome环境下开发,并且代码书写算规范,那么你几乎不会感觉到有任何变化.但是确实有一些显而易见的好处,我也从中受益所以和大家分享一下.


    (1) 错误提示更加准确

    Javascript的错误提示一直是个比较伤心的问题,松散的语言结构在赋予格外灵活的同时也让他像调皮的孩子一样难以管教.在Javascript应用越来越重的今天,这会明显拖延我们的开发进度,影响开发的感觉.

    "use strict"模式下可以更加明确的提示你的代码出了什么样的错误,这让你可以更加快速并且专注的去解决问题.


    (2) 变量必须声明

    在非严格模式如果你没有声明一个变量就使用它,那么它会被当做一个全局变量,在严格模式下则报错并抛出异常.我一直认为先声明后使用是一个好习惯,并且一直坚持.


    (3) 属性或者参数不再可重复

    虽然没有写过,不过我确实看过类似的代码:

var a = {
  aaa: 'dddddd',
  bbb: 'dddddd',
  aaa: 'cccccc'
}

    虽然不算是惊呆了,不过我就想问,哥们你是从CSS转到JS的吗...属性覆盖都来了.在非严格模式下这样书写可能不会报错,如果你用"use strict"那么抱歉,浏览器会抛出异常.


    (4) with被禁用

    这个虽然是一个重要的改变,相当于API层次的禁用,不过貌似日常编码中我们使用with的时候并不多,所以影响不大


    (5) Function中this不再是window

    这一点算是严格模式下的一个很严谨的地方,经常在调用的函数中我们用this指向window这类全局变量.但是在严格模式下,这样的this的值是undefined.


    (6) 变量删除

    相比较与属性删除我们可能很少或者几乎不会去进行变量删除的操作,在严格模式下变量的删除是不允许的.而对于属性的删除,只有configurable设为true的属性才能被删除.

"use strict";
  var x;
  delete x; // 语法错误
  var o = Object.create(null, 'x', {
      value: 1,
      configurable: true
  });
  delete o.x; // 删除成功

    

    (7) 函数声明只能在顶层

    这个改变非常可能对旧有的代码或者原本书写就不规范的代码造成影响,以前我们定义function可以说是随心所欲,不管在if还是for中,都是想怎么样就怎么样.

    在"use strict"模式下,为了与以后ECMAScript6接轨,规定了函数的声明只能在全局作用域或者函数作用域的顶层进行声明.


    (8) arguments对象不再神奇

    在严格模式中,函数里的arguments对象拥有传入函数值的静态副本.而在非严格模式下,arguments对象的数组元素和函数参数都指向同一个值的引用.这种限制会使得很多神奇的代码不再可用.


  结论:

    上面这几点是我感觉使用了"use strict"后变化最大的地方,另外需要注意"use strict"的使用也是有风险的,并不是万金油.尤其是在旧有的项目中,如果想使用严格模式要非常谨慎,一旦你在文件首行加入了"use strict"那么整个文件都会受到这个限制,如果你合并所有文件,这一点要格外注意.

    当然你也可以灵活的使用"use strict",比如在函数内部的首行,或者在匿名函数作用域的首行去使用.注意这里之所以强调是首行,因为浏览器对于脚本代码以及函数体中第一条常规语句后的内容都不会当作指令去解析,也就是说如果你的"use strict"写在了var a=0;之后,那么浏览器只会将其当作一个普通的表达式语句.

    最后,希望大家在开发时条件允许的情况下尽量使用"use strict"开发,它最大的好处就是帮助你更快的定位错误!详细的提示信息让你更好的纠错.

© 著作权归作者所有

共有 人打赏支持
顽Shi
粉丝 272
博文 81
码字总数 92387
作品 0
普陀
程序员
加载中

评论(16)

土豆丶
土豆丶
好吧,是个好东东 mark
KelvinQ
KelvinQ
刚试了一下好像没报任何错误啊,难道我的代码一直很规范13
Undeadway
Undeadway
"use strict";
这个建议不错,以后尝试一下。
今天天气不错
今天天气不错

引用来自“水牛叔叔”的评论

又学到一个知识

+1
二妞
早已在项目中强制使用
顽Shi
顽Shi

引用来自“水牛叔叔”的评论

又学到一个知识
涨姿势...
水牛叔叔
水牛叔叔
又学到一个知识
顽Shi
顽Shi

引用来自“chape”的评论

是否可以,为了规范和查错,使用use strict;遇到类似8这种解除声明呢?
理论上是可以的,不过没有指令本身提供这种功能.或者你可以在函数内部使用"use strict",然后在希望放宽限制的函数中就不要加了. 要么就在开发的时候全文件加上,然后发布的项目上去掉.不过个人建议最好还是全部在严格模式下开发,在Js应用越来越庞大的现在,规范化是一种趋势和必然.
顽Shi
顽Shi

引用来自“肖羊”的评论

不错不错。之后再回味一下
我就知道一个为声明不再是全局变量,而会报错
严格模式下管理了全局变量以及声明使用的规则,这个在开发量大的情况下很有用.
顽Shi
顽Shi

引用来自“袁国涛”的评论

很好的东西,自由是有代价的啊。不过,ie依旧蛋疼,这是不得不吐槽的。
IE10以上还好,剩下的却是蛋疼
编写可维护的JavaScript

软件生命周期中80%的成本都消耗在了维护上;而且几乎所有的维护者都不是代码的直接开发人。如何让自己写的代码让别人阅读起来更高效?当然是写代码的时候注入一些规范。那么在Javascript中有...

Jouryjc
06/12
0
0
做一名合格的前端开发工程师(12篇)——第一篇 Javascript加载执行问题探索

做一名合格的前端开发工程师(12篇)——第一篇 Javascript加载执行问题探索 楼主做前端开发一年多了,对前端的见解还是多多少少有一点的,今天特拿出来跟大家分享分享。 做前端开发少不了各...

蜗牛奔跑
2015/06/25
0
0
编写高质量代码 Web前端开发修炼之道 读书笔记

第五章 高质量的JavaScript 5.1 养成良好的编程习惯 5.1.1 团队合作-如何避免JS冲突 使用匿名函数控制变量的作用域 (function(){})() 先定义一个匿名函数然后立即执行它 用匿名函数将脚本包起...

lilugirl
2014/04/27
0
0
在Expressjs4.0中使用dustjs模板引擎

引言 [dustjs][1]是一款js模板,最早由个人开发维护,后来由linkin接手,发展的更加迅速,说实话js模板这块有很多选择,都非常优秀,和paypal的选择一样,最终我使用dustjs作为我的首选模板语...

假正经哥哥
2014/10/19
0
0
Discuz 7.2坑爹集锦-js篇

Discuz 7.2坑爹集锦-js篇 在调试DZ过程中firebug经常提示common.js出错,什么“Error: s is null”,“$ is not defined”,“BROWSER not defined”。其实多半和XML有关:当ajax操作时后台P...

mark35
2012/01/12
0
2
JavaScript MVC 开源框架

腾讯Web前端框架库 JX by Tencent AlloyTeam 简介 JX 是模块化的非侵入式Web前端框架,开发于2008年,并于2009年开源于GoogleCode - http://code.google.com/p/j-et/,于2012年切换到Github,...

wewelove
2014/06/04
0
0
Javascript 严格模式详解

一、概述 除了正常运行模式,ECMAscript 5添加了第二种运行模式:"严格模式"(strict mode)。顾名思义,这种模式使得Javascript在更严格的条件下运行。 设立"严格模式"的目的,主要有以下几...

开源oschina
2014/12/24
0
3
使用javascript开发windows phone应用的相关问题

1、使用angularjs和winjs时的兼容问题 1、开启scp模式 <html ng-app="app" ng-csp><!-- Enables CSP (Content Security Policy) support --> 2、使用winjs提供的垫片文件 使在winjs内无法使用......

Arrowing
2014/10/19
0
1
JavaScript语法支持严格模式:”use strict”

JavaScript语法支持严格模式:”use strict” 如果给JavaScript代码标志为“严格模式”,则其中运行的所有代码都必然是严格模式下的。 其一:如果在语法检测时发现语法问题,则整个代码块失效...

造化玉碟
2014/04/28
0
0
Javascript 严格模式

1.什么是严格模式? 严格模式就是使javascript在更严格的条件下运行。 2.严格模式的目的? 2.1 消除一些javascript语法一些不合理、不严谨之处,减少一些怪异行为; 2.2 消除代码运行的一些不...

w-rain
2015/02/05
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

python浏览器自动化测试库【2018/7/22-更新】

64位py2.7版本 更新 document_GetResources 枚举页面资源 document_GetresourceText 获取指定url的内容 包括页面图片 下载地址下载地址 密码:upr47x...

开飞色
14分钟前
17
0
关于DCL双重锁失效及解决方案

关于DCL双重锁失效及解决方案 Double Check Lock (DCL)实现单例 DCL 方式实现单例的优点是既能够在需要时才初始化单例,又能够保证线程安全,且单例对象初始化后调用getInstance方法不进行...

DannyCoder
20分钟前
0
0
PowerDesigner 16.5 安装配置

PowerDesigner16.5破解版是一款业内领先且开发人员常用的数据库建模工具,PowerDesigner可以从物理和概念两个层面设计数据库,方便用户制作处清晰直观的数据流程图和结构模型,欢迎有需要的朋...

Gibbons
45分钟前
0
0
mac Homebrew 指令积累

1通用命令 brew install [包名] //安装包 brew list //列举安装的包 brew info [包名] // 显示安装包的详细信息 mysql 相关 #启动mysql 服务 brew service start mysql my...

Kenny100120
今天
0
0
前端Tips: 创建, 发布自己的 Vue UI 组件库

创建, 发布自己的 Vue UI 组件库 前言 在使用 Vue 进行日常开发时, 我们经常会用到一些开源的 UI 库, 如: Element-UI, Vuetify 等. 只需一行命令, 即可方便的将这些库引入我们当前的项目: n...

ssthouse_hust
今天
1
0
大数据教程(2.13):keepalived+nginx(多主多活)高可用集群搭建教程【自动化脚本】

上一章节博主为大家介绍了目前大型互联网项目的keepalived+nginx(主备)高可用系统架构体系,相信大家应该看了博主的文章对keepalived/nginx技术已经有一定的了解,在本节博主将为大家分享k...

em_aaron
今天
4
0
Git 2.18版本发布:支持Git协议v2,提升性能

在最新的官方 Git 客户端正式版2.18中添加了对 Git wire 协议 v2 的支持,并引入了一些性能与 UI 改进的新特性。在 Git 的核心团队成员 Brandon Williams 公开宣布这一消息前几周,Git 协议 ...

六库科技
今天
0
0
Java8新特性之接口

在JDK8以前,我们定义接口类中,方法都是抽象的,并且不能存在静态方法。所有的方法命名规则基本上都是 public [返回类型] [方法名](参数params) throws [异常类型] {}。 JDK8为接口的定义带...

developlee的潇洒人生
今天
0
0
aop + annotation 实现统一日志记录

aop + annotation 实现统一日志记录 在开发中,我们可能需要记录异常日志。由于异常比较分散,每个 service 方法都可能发生异常,如果我们都去做处理,会出现很多重复编码,也不好维护。这种...

长安一梦
今天
2
0
将博客搬至CSDN

AHUSKY
今天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部