理解JavaScript中的设计模式

很多JavaScript库提供了一致的API，不论是处理单个DOM元素还是一个DOM元素的数组。我们可以添加selected 类给所有含.myList的选择器的元素。同样我们可以使用相同的方法处理相似的DOM元素#myItem，类似的，我们可以使用on()方法附上事件处理器在多个节点或单个节点上。

门面模式：

隐藏内部复杂结构，提供给用户简单接口使用。

门面模式几乎总是可以改善大部分软件的可用性。使用jQuery作为例子，一个最受欢迎的方法ready()：

$（document）.ready（function（） {

//all your code goes here...

}）;

ready()方法就实现的门面模式，如果你去查看源代码，你将发现：

ready： （function（） {

......

//Mozilla， Opera， and Webkit

if （document.addEventListener） {

document.addEventListener（“DOMContentLoaded”， idempotent_fn， false）;

....

}

//IE event model

else if （document.attachEvent） {

// ensure firing before onload; maybe late but safe also for iframes

document.attachEvent（“onreadystatechange”， idempotent_fn）;

// A fallback to window.onload， that will always work

window.attachEvent（“onload”， idempotent_fn）;

...

}

}）

ready()方法并不简单，jQuery规范游览器的一致性确保ready()在合适的时间被触发。然而，作为一名开发者，你应该用简单的接口展示出来。

总结：设计模式最让人鼓舞的是有人在过去已经成功实践了。很多开源代码实现了各种JavaScript中的是设计模式。作为程序员，我们需要意识到每种设计模式的应用场景。我希望这篇教程能帮助一步步回答这些问题。

英文原文：Tilo Mitra

文：伯乐在线

（编辑：PHP编程网 - 黄冈站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!