在构建javascript框架时,如何实现库不可知论?

这是一个 非常 广泛的问题,但如果我是你,我会使用jQuery作为基础。这是一个非常容易扩展和添加功能的库。

我建议您抓取一份ExtJS的副本,看看它们是如何为替换产品的底层核心提供支持的。您可以使用其更高级别的库,如网格、树等,但可以选择使用YUI或prototype来代替其Ext核心。

这应该给你一个好的起点。

编辑以回答评论:

下载ExtJS后,请查看“适配器”文件夹。在这里,您将看到使ExtJS与其他库一起工作的各种适配器。您将很快看到它们是如何定义函数的,这些函数反过来又使用了适当的底层库。

隔离您的代码:

尽可能充分地使用外部库,在它们各自的代码部分中。

坦率地说,如果您将一个库与您的代码集成在一起,并尝试使它足够通用,以便您可以轻松地将它与其他东西交换,那么您可能会将库中性化,以至于您可能根本没有包含它。

我建议您选择一个通用库,或者根本不选择库,这取决于您计划编写的框架的要求。在没有更多信息的情况下,很难提出任何类型的建议,例如您的框架的目标是什么、谁将使用它以及在什么样的环境中。

如果您正在考虑编写一个相当复杂的脚本,那么我建议您自己学习相关的“低级”DOM操作技术。这并不像一些著名的通用图书馆的爱好者让你相信的那样困难。

使用某种接口链接到库。

$("blah").something();

做

something("blah")

function something(id){
  $(id).something();
}

由于可以调用something()20次,因此如果库的实际使用仅在1个位置,则更新会更简单。

我不认为这可以轻而易举地实现。如果您真的想要这种行为,我认为您必须手动映射所有要包含支持的库所涵盖的功能。

yourLibrary.coreFramework = 'prototype';
yourLibrary.doStuff();

function doStuff() {
   var elem = getElement('id');
   // do stuff with 'elem';
}

function getElement(id) {
   switch(this.coreFramework) {
       case 'prototype': return $(id);
       case 'jquery': return $('#'+id);
       /* etc */
   }
}

查看 jQuery 或 prototype 框架。