这篇文章主要介绍了 JS 实现简单路由器功能的方法, 基于 javascript 模拟简单路由编码的相关技巧, 需要的朋友可以参考下
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
本文实例讲述了 JS 实现简单路由器功能的方法。分享给大家供大家参考。具体实现方法如下:
- var wawa = {};
- wawa.Router = function() {
- function Router() {}
- Router.prototype.setup = function(routemap, defaultFunc) {
- var that = this,
- rule, func;
- this.routemap = [];
- this.defaultFunc = defaultFunc;
- for (var rule in routemap) {
- if (!routemap.hasOwnProperty(rule)) continue;
- that.routemap.push({
- rule: new RegExp(rule, 'i'),
- func: routemap[rule]
- });
- }
- };
- Router.prototype.start = function() {
- console.log(window.location.hash);
- var hash = location.hash,
- route, matchResult;
- for (var routeIndex in this.routemap) {
- route = this.routemap[routeIndex];
- matchResult = hash.match(route.rule);
- if (matchResult) {
- route.func.apply(window, matchResult.slice(1));
- return;
- }
- }
- this.defaultFunc();
- };
- return Router;
- } ();
- var router = new wawa.Router();
- router.setup({
- '#/list/(.*)/(.*)': function(cate, id) {
- console.log('list', cate, id);
- },
- '#/show/(.*)': function(id) {
- console.log('show', id);
- }
- },
- function() {
- console.log('default router');
- });
- router.start();
希望本文所述对大家的 javascript 程序设计有所帮助。
来源: