为什么要避免使用 setInterval

说到setInterval,就不得不提到setTimeout,二者都是用于定时执行某函数,区别在于setTimeout 只执行一次,而setInterval可以一直连续不断执行下去,典型用法如下:

function do_sth() { console.log('Hello...'); }

setTimeout(do_sth, 2500);   // 2.5 秒后,执行 do_sth 函数(只执行一次)
setInterval(do_sth, 3500);  // 3.5 秒后,执行 do_sth 函数(每隔 3.5 秒执行一次,一直执行下去)
Posted on 2013-01-14

JavaScript 中的 Hoisting 机制

JavaScript 中的 Hoisting 一般称之为变量声明提升机制。就是说,JavaScript 引擎在执行的时候,会把所有变量的声明都会被提升到当前作用域的最前面,注意,这里被提升的仅仅是声明。怎么理解呢,看下面例子:

Posted on 2012-12-24

命令行模式下备份、还原 MySQL 数据库

为了安全起见,需要经常对数据库作备份,或者还原。对于 MySQL 而言,最方便的方法可能就是用 phpMyAdmin 的导出、导入功能了,但如果你的数据库体积比较大,作为 Web 应用的 phpMyAdmin 可能会遭遇“超时”而操作失败。所以,学会在命令行模式下备份、还原数据库,还是很有必要的。

Posted on 2012-07-30

JavaScript 跨浏览器事件处理

如果项目中没有使用诸如 jQuery 之类的库,如何方便地为元素绑定事件,并兼容各种浏览器呢?下面这个简单的 Utility 应该可以考虑。

var eventUtility = {
    addEvent : function(el, type, fn) {
        if(typeof addEventListener !== "undefined") {
            el.addEventListener(type, fn, false);
        } else if(typeof attachEvent !== "undefined") {
            el.attachEvent("on" + type, fn);
        } else {
            el["on" + type] = fn;
        }
    },

    removeEvent : function(el, type, fn) {
        if(typeof removeEventListener !== "undefined") {
            el.removeEventListener(type, fn, false);
        } else if(typeof detachEvent !== "undefined") {
            el.detachEvent("on" + type, fn);
        } else {
            el["on" + type] = null;
        }
    },

    getTarget : function(event) {
        if(typeof event.target !== "undefined") {
            return event.target;
        } else {
            return event.srcElement;
        }
    },

    preventDefault : function(event) {
        if(typeof event.preventDefault !== "undefined") {
            event.preventDefault();
        } else {
            event.returnValue = false;
        }
    }
};

使用方法示例:

var eventHandler = function(evt) {
    var target = eventUtility.getTarget(evt),
        tagName = target.tagName;

    if(evt.type === "click") {
        if(tagName === "A" || tagName === "BUTTON") {
            alert("You clicked on an A element, and the innerHTML is " + target.innerHTML + "!");
            eventUtility.preventDefault(evt);
        }
    } else if(evt.type === "mouseover" && tagName === "A") {
        alert("mouseovered " + target.innerHTML);
    }

};

eventUtility.addEvent(document, "click", eventHandler);
eventUtility.addEvent(document, "mouseover", eventHandler);

eventUtility.removeEvent(document, "mouseover", eventHandler);
Posted on 2012-06-29

函数声明 VS 函数表达式

JavaScript 中需要创建函数的话,有两种方法:函数声明、函数表达式,各自写法如下:

// 方法一:函数声明
function foo() {}

// 方法二:函数表达式
var foo = function () {};

另外还有一种自执行函数表达式,主要用于创建一个新的作用域,在此作用域内声明的变量不会和其它作用域内的变量冲突或混淆,大多是以匿名函数方式存在,且立即自动执行:

Posted on 2012-06-25