Web 技术研究所

我一直坚信着,Web 将会成为未来应用程序的主流

动态参数绑定的设计

  很早以前 jQuery 就搞了 Proxy 这么个东西,原生 function 对象上也有 bind 方法。它们的设计初衷本来是解决函数调用的 this 指向问题,但实现之后也为柯里化的概念拓宽了应用空间。最近设计 API 的时候也用上了类似的概念,加上 Promise 简直爽到爆!
  bind 方法通常是给一个函数绑定参数,这确实可以稍微提高易用性。但 bind 本身带来的便利和它自身的兼容性比起来还不值得以让我在一个项目中去引入一个 bind 的 polyfill。这是因为 bind 方法只能将静态的变量绑定到函数上作为参数,而这样的需求并不多。
  我的想法是绑定动态的变量,这样也许会更方便。将函数绑定到函数的参数上,每次调用时这些参数会调用函数并将返回值作为参数。甚至如果函数本身是异步的话可以通过 Promise 来实现异步参数绑定。
  比如现在有个函数 seach,它的功能是向服务器查询一个列表,参数是一个关键词,返回一个 promise 对象。如果这个函数在一个也没上被多处使用的话我们可能会做这样的包装。
// 定义
var searchKeywords=function(){
  return search(document.getElementById("keywords").value);
};

// 业务代码
searchKeywords().then(function(){
  console.log("TODO");
});
  现在如果我们可以使用上面说的方式,将一个函数绑定到这个函数上作为其参数源的话,也许可以像下面这样写 // 定义
var searchKeywords=dynamicBind(search,null,function(){
  return document.getElementById("keywords").value;
});

// 业务代码
searchKeywords().then(function(){
  console.log("TODO");
});
  其实以上两个写法的差别并不大,因为这个需求实在太简单了。假如由于某些原因,这个查询的接口需要传入一个 token,而这个 token 需要从另一个接口获取,那么传统的写法代码可能变成一坨。 // 定义
var searchKeywords=function(){
  var keywords=document.getElementById("keywords").value;
  return getToken().then(function(token){
    return search(keywords,token);
  });
};

// 业务代码
searchKeywords().then(function(){
  console.log("TODO");
});
  如果有 dynamicBind 这东西,每个参数单独绑定,逻辑就会很清晰。 // 定义
var searchKeywords=dynamicBind(search,null,function(){
  return document.getElementById("keywords").value; // 绑定查询关键字
},function(){
  return getToken(); // 绑定 token
});

// 业务代码
searchKeywords().then(function(){
  console.log("TODO");
});
  而且无论将来需求变得多复杂,代码结构也依然清晰,逻辑也不会变复杂。
网名:
3.80.32.*
电子邮箱:
仅用于接收通知
提交 悄悄的告诉你,Ctrl+Enter 可以提交哦
神奇海螺
[查看全部主题]
各类Web技术问题讨论区
发起新主题
本模块采用即时聊天邮件通知的模式
让钛合金F5成为历史吧!
次碳酸钴的技术博客,文章原创,转载请保留原文链接 ^_^