(五)我的JavaScript系列:JavaScript的糟粕
泪眼问花花不语,乱红飞过秋千去。
JavaScript的糟粕
JavaScript语言是一门集精华与糟粕于一体的语言。在JavaScript: the good parts中,便集中讨论了关于精华与糟粕的主题。有兴趣的同学可以读读这本书,真的不错。基础不错的可以跳过前面的章节,直接进入附录的糟粕与鸡肋的部分。我呢,就先在这本书里列举几个我感兴趣的糟粕部分与大家分享:
全局变量
这恐怕是JavaScript当中最坑的部分了。先且不论全局变量的种种坏处了。在JavaScript中,定义一个全局变量是很轻松的一件事,可以通过下面的三种方式:
在函数外通过var定义:
var foo = value;
绑定到全局对象window:
window.foo = value;
在任何地方不通过var定义变量:
foo = value;
这里的准则就是一般不要在函数外定义变量(即便是通过var),定义变量时一定不能忘记var(但忘记var又是件很常见的错误)。
作用域
JavaScript中的只有全局作用域和函数作用域两种,没有块作用域。同一个函数内的所有变量属于同一个作用域。例如下面的代码,foo的作用域不是if块,而是函数foo,所以在if块之外依然可以访问foo。
function f() {if(true) {var foo = 'foo';}console.log(foo); //依然可以访问foo
}
所以一种推荐的方式是在函数的顶部声明变量,就像C语言那样做。整个函数看上去就像下面的形式:
function f() {var a, b, c; //在函数顶部声明函数内使用的所有变量a = b = c = 2; //然后再使用变量
}
不过,像这样编程是一种很烦的方式。
自动插入分号机制
JavaScript会在每行末尾自动插入一个分号,只要语法允许。例如下面的代码
return
{ status: true
};
会被转化为:
return;
{ status: true
};
但下面的代码却不会(因为插入分号语法上不允许):
return {status: true
}
所以为了避免理解上的歧义,JavaScript最佳实践建议手动加上分号,而不要依赖语言的自动插入分号机制。不过,现代语言(Ruby、Python等)基本都去掉分号行为了,每行代码都要加上个分号也是个烦人的事。
保留字
JavaScript上定义了很多但压根没用上的保留字,例如:abstract
, boolean
, byte
, int
…
typeof
JavaScript的typeof往往文不对题,例如:
typeof null === 'object'
所以,用到typeof时,往往要多加小心。
浮点数
JavaScript中的数字没有整数类型,只有浮点数类型(实际为IEEE 754,即C语言的double类型)。众所周知,浮点数得到的结果是不精确的。不过好在浮点数表示的整数,它们之间的运算是精确的。
False值
JavaScript中,有很多值能够表示假值:
- 0
- NaN (非数)
- ‘’ (空字符串)
- false
- null
- undefined
所以,在使用if条件判断的时候,要适当注意下。
==
在JavaScript中,有两种形式的等号操作符:==
,===
。其中==
存在坑的地方。它在比较前,会先尝试进行类型转化再去比较。这里的问题在于,类型转化的规则太过复杂了,很难掌握。例如
'' == '0' //false
0 == '' //true
0 == '0' //true
而===
在比较的时候不会进行类型转化,只有类型相同和值相等的两个对象才会返回true。
缺少块符号的语句
块符号,即{}
。在JavaScript中,if
,while
,for
内部的语句需要用大括号括起来。例外的情况是它们下面只有一条语句的时候。
if(ok)t = true;
不过这不是建议的方式。JavaScript最佳实践要求无论何种情况都要加上大括号,除非它们写在同一行。要么
if(ok) {t = true;
}
要么
if(ok) t = true;
第二种明显不怎么易看。
new语句
JavaScript的构造器函数需要通过new新建对象。如果忘记new,那它就是一个普通的函数调用,this被绑定到全局对象window。此时是非常危险的。
function Dog(name) {this.name = name;
}Dog.prototype.bark = function() {return 'I am ' + this.name;
}
当调用构造器函数时,千万别漏掉new。JavaScript最佳实践甚至建议不要使用构造器函数,也就是不要通过new来新建对象。它的意思大概是像下面这样新建对象:
function dog(name) {var dog = {};dog.bark = function() {return 'I am ' + name;}return dog;
}
这是我以前经常用的一种方式。这里利用闭包的特性将name化为私有变量。一个很明显的缺点是bark函数被定义了多次。
就该被遗忘的特性
下面的一些特性我从来没接触过,据说是坑人的特性。既然这样,我也不要去学习它们了。大家直接忽略它们就可以了。
- with语句
- eval函数
- ++ -- (不要a++,用a+=1替代)
- 位运算符 (& | ^ ~ >> <<)
相关资源
一些推荐的JavaScript学习教程
- JavaScript: the good parts
- JavaScript 秘密花园
转载于:https://www.cnblogs.com/starstone/p/4861354.html
(五)我的JavaScript系列:JavaScript的糟粕相关推荐
- javascript系列--javascript数组的常用算法解析
一.不改变原数组,返回新数组(字符串) 1.concat() 连接两个或者多个数组,两边的原始数组都不会变化,返回的是被连接数组的一个副本. 2.join() 把数组中所有的元素放入到一个字符串中,返 ...
- 事半功倍系列 javascript
清华大学出版的<事半功倍系列 javascript>,本人照着书敲出来的,有些翻译了一下.前几年看了一下,最近无事,重新翻了翻,很有帮助.本书应该有光盘的,但学校的书,光盘不知在哪.希望对 ...
- 深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点
才华横溢的Stoyan Stefanov,在他写的由O'Reilly初版的新书<JavaScript Patterns>(JavaScript模式)中,我想要是为我们的读者贡献其摘要,那会 ...
- 深入理解JavaScript系列:This? Yes,this!
介绍 在这篇文章里,我们将讨论跟执行上下文直接相关的更多细节.讨论的主题就是this关键字.实践证明,这个主题很难,在不同执行上下文中this的确定经常会发生问题. 许多程序员习惯的认为,在程序语言中 ...
- 深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点(转)
才华横溢的Stoyan Stefanov,在他写的由O'Reilly初版的新书<JavaScript Patterns>(JavaScript模式)中,我想要是为我们的读者贡献其摘要,那会 ...
- JavaScript(五)—— Web APIs 简介/JavaScript 必须掌握的 DOM 操作 (丰富案例 + 思维导图)
本篇为 JavaScript 系列笔记第五篇,将陆续更新后续内容.参考:黑马程序员JavaScript核心教程,前端基础教程 系列笔记: JavaScript(一)-- 初识JavaScript / ...
- 【JavaScript系列】JS基础语法_从变量到数组一网打尽_有教程有实战
[JavaScript系列]基础语法_从变量到数组一网打尽_有教程有实战 JavaScript基础语法目录 基础语法 延迟和异步脚本 变量 数据类型 数据类型简介 简单数据类型与复杂数据类型 栈和堆 ...
- 前端代码编码和设计规范系列——JavaScript编程规范
1文档信息 条目 内容 项目编号 通用 项目名称 通用 标题 JavaScript编程规范 类别 规范文档 当前 试用草稿 摘要 当前版本 V1.0 日期 2015/11/9 作者 徐维坚(xuwei ...
- JavaScript系列(三) - 收藏集 - 掘金
JS 全栈教程 - 前端 - 掘金 本课程是基于阮一峰的 js 全栈教程的视频版本,免费供大家观看... 不要过度依赖 jQuery(一) - 前端 - 掘金 毫无疑问,JQuery是一款非常优秀的J ...
- 160630、五句话搞定JavaScript作用域
JavaScript的作用域一直以来是前端开发中比较难以理解的知识点,对于JavaScript的作用域主要记住几句话,走遍天下都不怕. 一."JavaScript中无块级作用域" ...
最新文章
- 转程序员,都去写一写前端代码吧
- Vscode 调试 Flutter 项目
- 市值破万亿美金的苹果 近年在AI上搞了些新动作
- GMap.net 离线地图问题
- html漂浮广告随页面移动代码,JS漂浮广告代码,慢慢漂移的广告JS代码
- python 实现卷积操作
- Spring-AOP 通过配置文件实现 前置增强
- mysql一些操作个人备忘(持续更新)
- 跳跃游戏Python解法
- Sitecore A / B测试
- Hungary(匈牙利算法)——二分图最大匹配
- oracle 数据分页功能,Oracle数据库实现分页功能
- C++ STL容器vector篇(五) vector容器常用初始化操作总结(一维/二维)
- python格式化字符串_Python字符串格式化问题:%、format()与f-strings
- HttpReponse
- 玩平衡小车系列—TB6612FNG与直流电机控制教程
- 聊一聊如何把SSL证书安装到小鸟云服务器上
- 好莱坞明星识别-第六周
- 动图演示:彻底理解红黑树?
- qt连接mdb_【原创】QT数据库学习和以连接Access为例