Archive for: 六月, 2010

javascript将函数的实际参数转换成数组

六 29 2010 Published by zdy under 杂七杂八

实际参数在函数中我们可以使用 arguments 对象获得 (注:形参可通过 arguments.callee 获得),虽然 arguments 对象与数组形似,但仍不是真正意义上的数组。

值得庆幸的是,我们可以通过数组的 slice 方法将 arguments 对象转换成真正的数组:

var args = Array.prototype.slice.call(arguments, 0);
对于slice 方法,ECMAScript 262 中 15.4.4.10 Array.prototype.slice (start, end) 章节有备注:

The slice function is intentionally generic; it does not require that its this value be an Array object. Therefore it can be transferred to other kinds of objects for use as a method. Whether the slice function can be applied successfully to a host object is implementation-dependent.

《Pro JavaScript Design Patterns》(《JavaScript 设计模式》)的作者 Dustin Diaz 曾指出:

instead of…
var args = Array.prototype.slice.call(arguments, 0); // 怿飞注:下称方法一
do this…
var args = [].slice.call(arguments, 0); // 怿飞注:下称方法二

但二者的性能差异真的存在吗?经过个人简单测试发现:

在 arguments.length 较小的时候,方法二性能上稍有一点点优势,而在arguments.length 较大的时候,方法一却又稍有优势。

2010年1月30日更新(测试地址):几经验证,性能差异不大,反而第一张方法性能稍优势一点,或许由于第二种方法创建新数组产生开销。

最后附上方法三,最老土的方式:

var args = [];
for (var i = 1; i < arguments.length; i++) {
args.push(arguments[i]);
}
不过对于平常来说,个人建议使用第一种方法,但任何解决方案,没有最好的,只有最合适:

var args = Array.prototype.slice.call(arguments, 0);

No responses yet

全面兼容ie6,ie7,ie8,ff的CSS HACK写法

六 29 2010 Published by zdy under 杂七杂八

<style type=”text/css”>
#body {
border:2px solid #00f;     /*ff的属性*/
border:2px solid #090\9;   /* IE6/7/8的属性 */
border:2px solid #F90\0;     /* IE8支持 */
_border:2px solid #f00;     /*IE6的属性*/
}
</style>
<div id=”body”>
<ul>
<li>FF下蓝边</li>
<li>IE6下红边</li>
<li>IE7下绿边</li>
<li>IE8下黄边</li>
</ul>
</div>

全面兼容ie6,ie7,ie8,firfox

No responses yet

javascript在窗口见通信

六 19 2010 Published by zdy under 编程技巧

1.打开一个新窗口:window.open();为了便于父窗口操作子窗口可以为window.open()定义一个变量,例如:

var opW = window.open(‘tests.html’,’popup’,’width=300,height=300′);

这样要关闭子窗口可直接使用:opW.close();

要操作子窗口元素,例如:

opW.document.getElementById(“fartherWindowTxt”).innerHTML = “操作子窗口”;

2.子窗口可以使用window.opener来引用父窗口:window.opener.document.getElementById(“fartherWindowTxt”).innerHTML=”子窗口操作父窗口!”;

3.窗口关闭自身窗口可以使用:window.close();

No responses yet

parseInt处理数字类型时的问题

六 15 2010 Published by zdy under 编程技巧

看代码:
alert(parseInt(0.000001));
alert(parseInt(0.0000001));
第一条语句输出 0, 第二条语句输出 1, 囧。

继续看代码:
alert(parseInt(’0.000001′));
alert(parseInt(’0.0000001′));
都输出 0, 这才符合预期。

查看 ECMA-262 规范,parseInt 会先调用 toString 方法。问题已逐渐清晰:
alert(0.000001);
alert(0.0000001);
第一条语句原样输出,第二条语句输出 1e-7.
继续翻查 ECMA-262 9.8.1 ToString Applied to the Number Type 一节,恍然大悟:
assertEquals(“0.00001″, (0.00001).toString());
assertEquals(“0.000001″, (0.000001).toString());
assertEquals(“1e-7″, (0.0000001).toString());
assertEquals(“1.2e-7″, (0.00000012).toString());
assertEquals(“1.23e-7″, (0.000000123).toString());
assertEquals(“1e-8″, (0.00000001).toString());
assertEquals(“1.2e-8″, (0.000000012).toString());
上面是 V8 引擎 number-tostring 的单元测试脚本, 很好地诠释了 ECMA 规范。

小结:对于小于 1e-6 的数值来说,ToString 时会自动转换为科学计数法。因此 parseInt 方法,在参数类型不确定时,最好封装一层:

function parseInt2(a) {
    if(typeof a === 'number') {
        return Math.floor(a);
    }
    return parseInt(a);
}

No responses yet

几个icon图标查找网站

六 10 2010 Published by zdy under 互联网, 编程技巧

應用程式要讓人看了喜歡,覺得漂亮,必少不了一些圖示,而且應用程式中有些地方用文字表達遠沒有圖示好(如ToolBar),相信也有不少開發人跟我一樣,程式要自己寫,美工也有自己用,小弟我的美術細胞不好,要我自己畫圖跟要我命一樣,不過還好總是有善心的美術設計師分享他的作品,不過這些圖示在Google是非常不好找的,不過到是有幾個搜尋網站專門在收集這些圖示,方便大家使用。

1.IconFinder 強力推廌

image

這是我最常上去搜尋的網站,太部分應用程式需要圖示都可以找到。

image

搜尋的介面很有善。

image

大部分的圖示都有提供不同大小下載。

image

也有提供相關的圖示,如Favorite與Bookmark、Star相關。

image

也有所選圖示所在資料夾的其他圖示,這個功能我覺得不錯,用一個關鍵字就可以找到所需的圖。

2.IconSpedia

image

這個網站也不錯,提供的圖比較多樣化,不過很多開發應用程式用不到。

image

其中一個電影類的圖示。

3.IconLook

image

這網站就比較差一點,提供的圖也比較少。

image

4.IconLet

image

這網站提供的圖示不少,只是偏向16X16,而且高彩的比較少。

image

6.IconArchive

image

這網站最大的缺點就是用Google搜尋,因為都是文字,沒辦法預覽。

image

要從一堆文字中找到所需要的圖,一個字~難。

No responses yet

javascript获取网页中鼠标选中的文字或选中指定文字

六 06 2010 Published by zdy under 编程技巧

文章收集自http://playgoogle.com/?p=316http://playgoogle.com/?p=351这两篇

获得选中文件

<pre> var PG={
            isIE:!-[1,],  //判断浏览器是否为IE,为IE时返回true
            getText:function(){
                 if(this.isIE){
                     return this._getText();
                }else{
                    var element = document.activeElement;
                    if (element && (element.tagName.toLowerCase() == 'input' || element.tagName.toLowerCase() == 'textarea')) {
                        return this._getTextInput()
                    } else {
                        return this._getText()
                    }
                }
            },
            _getText:function(){
                if (window.getSelection) {
                    return window.getSelection().toString();
                } else if (document.selection && document.selection.createRange) {
                    return document.selection.createRange().text;
                }
                return "";
            },
            //获取非IE浏览器中input框和textarea框中的文字
            _getTextInput:function(){
                var element = document.activeElement;
                if (element.selectionStart != undefined && element.selectionEnd != undefined) {
                    return element.value.substring(element.selectionStart, element.selectionEnd);
                }
                return "";
            }
        }</pre>

使用方法

<pre> document.onmouseup = function(){
            alert("您选中的文字是:"+PG.getText());
        }</pre>

demo

选中指定文字

<pre>var PG={
    isIE:!-[1,],  //判断浏览器是否为IE,为IE时返回true
    /*
    * 设置文本框中的文字为选中状态,包括开始索引,不包括结束索引
    * param domObj 文本框的dom对象,start为开始索引,不填则从0开始, end为结束索引,不填则选中到文本结束
    * 若domObj参数不填,则直接返回为false.
    */
    setSelectText:function(domObj,start,end){
        if(typeof domObj !=="object"){
            return false;
        }
        start = start ||0;
        end = end || domObj.value.length
        domObj.focus();
        if(this.isIE){
            var range = domObj.createTextRange();
            range.move("character",start);
            range.moveEnd("character",end-start);
            range.select();
        }else{
            domObj.setSelectionRange(start,end)
        }
    }
}</pre>

demo

No responses yet