有关JavaScript的10个怪癖和秘密分享(3)


getAnimal.apply(myObj, ['lovely']); //函数参数以数组形式发送


demo页面中,点击第一个按钮的结果如下截图:

有关JavaScript的10个怪癖和秘密分享


  点击第二个和第三个按钮的结果如下:

有关JavaScript的10个怪癖和秘密分享

7. 函数可以执行其本身
  下面这个是很OK的:

复制代码 代码如下:


(function() { alert('hello'); })(); //弹出 'hello'


  这里的解析足够简单:声明一个函数,然后因为()解析立即执行它。你可能会奇怪为何要这么做(指直接屁股后面()调用),这看上去是有点自相矛盾的:函数包含的通常是我们想稍后执行的代码,而不是当下解析即执行的,否则,我们就没有必要把代码放在函数中。

  另外一个执行函数自身(self-executing functions (SEFs))的不错使用是为在延迟代码中使用绑定变量值,例如事件的回调(callback),超时执行(timeouts)和间隔执行(intervals)。如下例子:

复制代码 代码如下:


var someVar ='hello';
setTimeout(function() { alert(someVar); }, 1000);
var someVar ='goodbye';


  Newbies在论坛里总问这里timeout的弹出为什么是goodbye而不是hello?答案就timeout中的回调函数直到其运行的时候才去赋值someVar变量的值。而那个时候,someVar已经被goodbye重写了好长时间了。

  SEFs提供了一个解决此问题的方法。不是像上面一样含蓄地指定timeout回调,而是直接将someVar值以参数的形式传进去。效果显著,这意味着我们传入并孤立了someVar值,保护其无论后面是地震海啸还是女朋友发飙咆哮都不会改变。

复制代码 代码如下:


var someVar = 'hello';
setTimeout((function(someVar) {
returnfunction() { alert(someVar); }
})(someVar), 1000);
var someVar ='goodbye';


  风水轮流转,这次,这里的弹出就是hello了。这就是函数参数和外部变量的点差别了哈。
例如,最后一个按钮点击后的弹出如下:

有关JavaScript的10个怪癖和秘密分享

浏览器
  8. FireFox以RGB格式读与返回颜色而非Hex
  直到现在我都没有真正理解为何Mozilla会这样子。为了有个清晰的认识,看下面这个例子:

复制代码 代码如下:


<!--
#somePara { color: #f90; }
-->
<p>Hello, world!</p>
<script>
var ie = navigator.appVersion.indexOf('MSIE') !=-1;
var p = document.getElementById('somePara');
alert(ie ? p.currentStyle.color : getComputedStyle(p, null).color);
</script>


  大部分浏览器弹出的结果是ff9900,而FireFox的结果却是rgb(255, 153, 0),RGB的形式。经常,处理颜色的时候,我们需要花费不少代码将RGB颜色转为Hex。
下面是上面代码在不同浏览器下的结果:

有关JavaScript的10个怪癖和秘密分享

有关JavaScript的10个怪癖和秘密分享

其它杂七杂八
  9. 0.1 + 0.2 !== 0.3
  这个古怪的问题不只会出现在JavaScript中,这是计算机科学中一个普遍存在的问题,影响了很多的语言。标题等式输出的结果是0.30000000000000004。

  这是个被称为机器精度的问题。当JavaScript尝试执行(0.1 + 0.2)这行代码的时候,会把值转换成它们喜欢的二进制口味。这就是问题的起源,0.1实际上并不是0.1,而是其二进制形式。从本质上将,当你写下这些值的时候,它们注定要失去精度。你可能只是希望得到个简单的两位小数,但你得到的(根据Chris Pine的注解)是二进制浮点计算。好比你想把一段应该翻译成中文简体,结果出来的却是繁体,其中还是有差异是不一样的。

一般处理与此相关的问题有两个做法:

转换成整数再计算,计算完毕再转换成希望的小数内容
调整你的逻辑,设定允许范围为不是指定结果。
  例如,我们不应该下面这样:

复制代码 代码如下:


var num1=0.1, num2=0.2, shouldEqual=0.3;
alert(num1 + num2 == shouldEqual); //false


  而可以试试这样:

复制代码 代码如下:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wdjpyy.html