JavaScript代码片段

1，模版替换（跟Crockford学的）

var template = '<table border="{ border }">' +
'<tr><th>Last</th><td>{ last } </td></tr>' +
'<tr><th>First</th><td>{ first }</td></tr>' +
'</table>'

var data = {
first: 'Jerry',
last: 'Chou',
border: 2
}

mydiv.innerHTML = template.supplant(data);

//实现
if(typeof String.prototype.supplant !== 'function'){
String.prototype.supplant = function (o){
return this.replace(/{ ([^{}]) }/g,
function(a, b){
var r = o[b];
return typeof r === 'string' ? r : a;
}
}
}

 

2,模拟块作用域(Block Scope)

我们知道在JavaScript中没有作用域(block scope)，所有函数体内定义的变量都会被hoisting(即提到函数的顶部)。为了模拟类似C/Java/C#语言中的块作用域(block scope)，我们可以使用以下代码片段。这也是我们看别人写的类库比如JQuery时常见到的形式——定义后立即调用。

(function(){
//bla..bla
}());

比如下面的代码使用该技术模拟了一个块作用域：

function foo() {
var x = 1;
if (x) {
(function () {
var x = 2;
// some other code
}());
}
// x is still 1.
}

 

至于为什么定义了一个函数作用域就立即调用？因为函数的定义并不会执行函数体上的代码，当们在函数定义后加上()，进行调用时，才会执行函数体内的代码——更严谨的说法是：函数在调用时(加上”()”)才会创建执行环境(Execution Context)。

参考：[翻译]JavaScript Scoping and Hoisting