JavaScript 中不可变数据结构(Immutable structures)和克隆(clone)

对象克隆是一个棘手的问题,它有很多边缘情况。原因很简单。对象维持内部状态有很多技巧及衍生品,但是很容易被滥用。

克隆对象是你应用程序正在发展的指示器,并且你有一个复杂的对象,你想要作为一个不变的值,即在保持先前状态的同时进行操作。

如果这个对象在你的控制范围之内,那么你很幸运。如果要进行一些重构,可能会让你重新考虑对象的结构和行为来完全避免问题。 继续阅读

前端开发中的 正则表达式 及常用正则表达式大全

RegExp 是正则表达式(Regular expression)的缩写,就是用一个“字符串”来描述一个特征,然后去验证另一个“字符串”是否符合这个特征。比如 表达式“ab+” 描述的特征是“一个 ‘a’ 和 任意个 ‘b’ ”,那么 ‘ab’, ‘abb’, ‘abbbbbbbbbb’ 都符合这个特征。

正则表达式可以用来:

  1. 验证字符串是否符合指定特征,比如验证是否是合法的邮件地址。
  2. 用来查找字符串,从一个长的文本中查找符合指定特征的字符串,比查找固定字符串更加灵活方便。
  3. 用来替换,比普通的替换更强大。

创建一个正则表达式

你可以使用以下两种方法之一构建一个正则表达式: 继续阅读

JavaScript 中的递归和尾调用

如果你已经有一段时间的 JavaScript 开发经验,你很有可能会遇到递回这个定义,给定一个数字来阶乘,n! = n * (n - 1) * ... * 1 就是一个标准的递回例子。

function factorial(n) {
    if (n === 0) {
        return 1;
    }
    return n * factorial(n - 1);
}

上面所示的例子是阶乘函数最简单的实现。 继续阅读

[回归基础]JavaScript 等值比较 == ,=== 和 Object.is()

我们都知道 JavaScript 是松散类型,并且在某些情况下,当使用 == 来做等值比较时,会给你意想不到的结果。这是因为使用 == 做等值比较时,JavaScript 会对2个比较的值进行隐式强制转换。

0 == ' ' //true
null == undefined //true
[1] == true //true

所以 JavaScript 还为我们提供了三个等号运算符 === ,它更严格,不强制转换比较值,但实用 === 比较有些时候也不是最好的解决方案: 继续阅读

[回归基础] JavaScript 中循环迭代数组

在 JavaScript 中循环迭代数组的方法有很多种。抽时间简单的归纳一下,我们先从经典的方法开始,然后转向新标准提供的方法。

while 循序语句

while 语句只要指定的条件求值为 true ,就会一直执行它的语句块。 继续阅读

[JavaScript实用方法] 选取(picking)和反选(rejecting)对象的属性

有时候我们需要将一个对象的某些属性选取出来,比方说我们有一个用数组表示的数据库表,我们需要一些函数来 select(选取) 几个字段: 继续阅读

页面滚动时自动显示隐藏导航效果(jQuery)

介绍一个简单的导航效果,当用户向下滚动页面时自动隐藏导航,在用户向上滚动页面时自动显示导航。

支持IE9+,Chrome,Safari,FireFox…

自动显示隐藏导航这种交互出现已经有一段时间了,特别是在移动设备上。 这种UX模式背后的想法简单而有效:我们希望导航在我们需要的时候很方便的显示,当用户向下滚动页面时,导航会自动隐藏,为内容留出更多的空间。在用户向上滚动页面时,我们将他的行为理解为想要访问导航,所以我们把导航自动自动显示出来。 继续阅读

javaScript常用方法函数收集(二)

先看看,javascript常用方法函数收集(一)http://www.css88.com/archives/5180


获取当前元素样式:

function getStyle(oElm, strCssRule){
    var strValue = "";
    if(document.defaultView && document.defaultView.getComputedStyle){
        strValue = document.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule);
    }
    else if(oElm.currentStyle){
        strCssRule = strCssRule.replace(/\-(\w)/g, function (strMatch, p1){
            return p1.toUpperCase();
        });
        strValue = oElm.currentStyle[strCssRule];
    }
    return strValue;
}

如何使用:
例如css代码:

/* Element CSS*/
div#container{
    font: 2em/2.25em Verdana, Geneva, Arial, Helvetica, sans-serif;
}

JS代码:

var elementFontSize = getStyle(document.getElementById("container"), "font-size");

继续阅读