帮助避免错误的Javascript陷阱清单


Posted in Javascript onMay 31, 2009

翻译讲究"信\雅\达",我就谈不上了.希望能把文章的意思不要弄错就行.

编程的陷阱(gotcha)是指计算机系统中的意想不到的文档特征而不是bug.这些陷阱使得初学者远离javascript编程.在我看来,因为所有的浏览器都能运行javascript使得它是使用最广泛的语言之一,但它也是最少人研究的.让我们从一个基础的示例开始.

1.浮点运算

这可能是挫败一些对javascript不熟悉并准备执行一些数学运算的人的主要原因.

  1. <script>  
  2. alert(0.02 / 0.1);  //0.19999999999999998   
  3. alert(1.14 * 100);  //113.99999999999999    ;)  
  4. </script> 

Math.round()就能在这里派上用场.

2.加号操作符的重载

"+"加号运算符即能做算术运算,又能够做字符串的连接.如果正确的使用它是很便利的.让我们看一看.

  1. <script>  
  2. var msg, one="1";  
  3. msg = 2 + "1"// msg = "21"  
  4. msg = 2 + one; // msg = "21"  
  5. msg = 1 + 1 + 1 + " musketeers"// msg = "3 musketeers"  
  6. msg = "Bond " + 0 + 0 + 7; //msg = "Bond 007"    
  7. </script> 

上述行为是因为这些运算都是从左到右执行的.类型的转换是基于其中的字符串或数字.

3.行尾插入分号

javascript 自动在行尾插入分号";",让我们来看看这在一个简单的示例中的情况.

  1. <script>  
  2. function returnSame(a){  
  3.    return                 //Inserts semi-colon to convert to return;  
  4.    a                      //a becomes a; - Unreachable  
  5. }  
  6. alert(returnSame(2));  //Output is undefined  
  7. </script> 

当在创建对象或使用对象的值的时候这个神奇的分号能使事情变得更复杂.

4.typeof操作符

typeof 是一个一元操作符,运算结果往往并不是如预期的那样.令人吃惊的是对"null"的运算结果是"object"

  1. <script>  
  2. var obj={};  //object created using object literal  
  3. var arr=[];  //array created by array literal  
  4. alert(typeof(obj));   //object  - Good  
  5. alert(typeof(arr));   //object  - Bad  
  6. alert(typeof(null));  //object  - Ugly!  ;) 
  7. </script>

它仅仅能查找对象的原始类型.

5. false, null, undefined, NaN, Infinity

尽管他们看起来相似,但他们代表着不通的意思.javascript有3种基本数据类型数字numbers, 字符串strings 和布尔 boolean,除此之外还有两个不重要的数据类型"undefine"和"null".按照"=="运算符运算,null和undefine是相等的.

  1. <script>  
  2. var a;  
  3. alert (a);    //undefined  
  4. alert (1/0);  //Infinity  
  5. alert (0/0);  //NaN  
  6. 0/0 == 0/0;   //false - a NaN != NaN  
  7. alert (b);    //error  
  8. </script> 

6.字符串只替换第一个匹配的字符

与PHP或其他程序语言不同,默认情况下,javascript的字符替换只替换第一个出现的匹配的字符.

  1. <script>  
  2. var nospace = "I dont need spaces".replace(" ","_");  
  3. alert(nospace);    //I_dont need spaces   - Only first occurence  
  4. var nospace = "I dont need spaces".replace(/ /g,"_");  
  5. alert(nospace);    //I_dont_need_spaces  
  6. </script> 

 7.parseInt 函数

parseInt 用来将一个字符串转换为整数类型.这个函数能传入两个参数,第二个参数是指定多少进制的.这里十进制用 10 指定.如果没有指定进制,则parseInt函数自己会试图找到合适的进制.如果是这样,以0开头的字符串将会转换为8进制.

  1. <script>  
  2. var str = "017";  
  3. var strInt = parseInt(str);      //strInt = 15  ;)  
  4. var strInt = parseInt(str,10);   //strInt = 17  
  5. </script> 
Javascript 相关文章推荐
JavaScript 新手24条实用建议[TUTS+]
Jun 21 Javascript
jQuery选中select控件 无法设置selected的解决方法
Sep 01 Javascript
jQuery中获取Radio元素值的方法
Jul 02 Javascript
jquery之超简单的div显示和隐藏特效demo(分享)
Jul 09 Javascript
JS中typeof与instanceof之间的区别总结
Nov 14 Javascript
基于JavaScript实现通用tab选项卡(通用性强)
Jan 07 Javascript
理解js对象继承的N种模式
Jan 25 Javascript
使用jQuery监听DOM元素大小变化
Feb 24 Javascript
详解bootstrap的modal-remote两种加载方式【强化】
Jan 27 Javascript
javascript 正则表达式分组、断言详解
Apr 20 Javascript
详解在vue-cli项目中使用mockjs(请求数据删除数据)
Oct 23 Javascript
react-native 实现购物车滑动删除效果的示例代码
Jan 15 Javascript
JS 文字符串转换unicode编码函数
May 30 #Javascript
Javascript 日期对象Date扩展方法
May 30 #Javascript
Jquery 基础学习笔记之文档处理
May 29 #Javascript
Jquery 基础学习笔记
May 29 #Javascript
javascript AutoScroller 函数类
May 29 #Javascript
关于JavaScript的一些看法
May 27 #Javascript
广告切换效果(缓动切换)
May 27 #Javascript
You might like
PHP生成HTML静态页面实例代码
2008/08/31 PHP
PHP积分兑换接口实例
2015/02/09 PHP
jquery blockUI 遮罩不能消失与不能提交的解决方法
2011/09/17 Javascript
jquery 操作DOM案例代码分享
2012/04/05 Javascript
JS下拉框内容左右移动效果的具体实现
2013/07/10 Javascript
Javascript弹出窗口的各种方法总结
2013/11/11 Javascript
jQuery 浮动导航菜单适合购物商品类型的网站
2014/09/09 Javascript
input 禁止输入特殊字符的四种实现方式
2016/08/24 Javascript
JS验证 只能输入小数点,数字,负数的实现方法
2016/10/07 Javascript
jQuery编写textarea输入字数限制代码
2017/03/23 jQuery
vue中appear的用法
2017/08/17 Javascript
javascript 中事件冒泡和事件捕获机制的详解
2017/09/01 Javascript
node.js 用socket实现聊天的示例代码
2017/10/17 Javascript
vue单页面打包文件大?首次加载慢?nginx带你飞,从7.5M到1.3M蜕变过程(推荐)
2018/01/16 Javascript
原生JS实现旋转轮播图+文字内容切换效果【附源码】
2018/09/29 Javascript
js中null与空字符串&quot;&quot;的区别讲解
2019/01/17 Javascript
解决使用layui对select append元素无效或者未及时更新的问题
2019/09/18 Javascript
Vue切换div显示隐藏,多选,单选代码解析
2020/07/14 Javascript
vue 公共列表选择组件,引用Vant-UI的样式方式
2020/11/02 Javascript
[52:20]VP vs VG Supermajor小组赛 B组胜者组决赛 BO3 第一场 6.2
2018/06/03 DOTA
[54:30]Liquid vs Newbee 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
python使用Berkeley DB数据库实例
2014/09/26 Python
Python 基础之字符串string详解及实例
2017/04/01 Python
python实现自动登录后台管理系统
2018/10/18 Python
对Python中plt的画图函数详解
2018/11/07 Python
python SQLAlchemy 中的Engine详解
2019/07/04 Python
HTML5中的Scoped属性使用实例
2014/04/23 HTML / CSS
印度网上购物首选目的地:Flipkart
2016/08/01 全球购物
澳大利亚宠物食品和药物在线:Jumbo Pets
2018/03/24 全球购物
罗马尼亚购物网站:Vivantis.ro
2019/07/20 全球购物
ECOSUSI官网:女式皮革背包
2019/09/27 全球购物
服务行业个人求职的自我评价
2013/12/12 职场文书
婚庆司仪主持词
2014/03/15 职场文书
学习雷锋做美德少年寄语大全
2014/04/09 职场文书
2014年文员工作总结
2014/11/18 职场文书
水电工岗位职责
2015/02/14 职场文书