代码共享问题:
- 是否值得在两个环境中运行同一份代码; //看项目
- 依赖的API是否在两个环境中都有或有替代;
- 浏览器提供的标准API:XMLHttpRequest、WebSocket、DOM、canvas等;
- Node.js可加载的模块;
书写兼容的JS代码:
- 导出模块://浏览器本身环境没有module全局变量;例子:
- add.js: //在node和浏览器上都能运行;
(function (module) { module.exports = function (a, b) { return a + b; } if ('undefined' != typeof window) { window.add = module.exports; }})('undefined' == typeof module ? { module: { exports: {}}} : module);
- add.js: //在node和浏览器上都能运行;
- 模拟实现ECMA API://一些主流浏览器中的特性在其他浏览器和JS引擎中都没有
- 扩展原型:好处在添加填补之后几乎不用修改源代码;缺点在会破坏原型,影响其他使用者;
- 工具函数:定义简单的函数,接收原型对象作为参数如果该对象上的函数已经实现,直接使用;否则实现一次;优点是没有隐患,缺点是会代码冗长;
var keys = Object.keys || function(obj) { ..........}
- 模拟实现Node API: node社区书写了可以在所有环境中运行的Node API; 、
- 模拟实现浏览器端 API: 现在已经模拟实现了包括、、、在内的多种node.js模块;
用browserbuild集成: //将以Node风格书写的代码编译为浏览器可执行的版本;
- 例子:
- 安装:全局, npm install -g browserbuild;
- node.js代码:
//log.jsmodule.exports = function(str) { return console.log(str);}//main.jsvar log = require('./log');module.exports = function() { log('Executed my module');}//node执行:var mymodule = require('./log');mymodule();
- 编译:
browserbuild --main main --global mymodule main.js log.ja > out.js
- 浏览器端使用: