加入收藏 | 设为首页 | 会员中心 | 我要投稿 安阳站长网 (https://www.0372zz.cn/)- 高性能计算、分布式云、混合云存储、云计算、视频终端!
当前位置: 首页 > 运营中心 > 建站资源 > 优化 > 正文

能看懂这10个JavaScript难点的程序员运气不会太差…

发布时间:2019-08-09 17:03:10 所属栏目:优化 来源:子瑜说IT
导读:1. 立即执行函数 立即执行函数,即Immediately Invoked Function Expression (IIFE),正如它的名字,就是创建函数的同时立即执行。它没有绑定任何事件,也无需等待任何异步操作: (function(){ //代码 //... })(); function(){}是一个匿名函数,包围它的一

所谓函数重载(method overloading),就是函数名称一样,但是输入输出不一样。或者说,允许某个函数有各种不同输入,根据不同的输入,返回不同的结果。凭直觉,函数重载可以通过if…else或者switch实现,这就不去管它了。jQuery之父John Resig提出了一个非常巧(bian)妙(tai)的方法,利用了闭包。

从效果上来说,people对象的find方法允许3种不同的输入: 0个参数时,返回所有人名;1个参数时,根据firstName查找人名并返回;2个参数时,根据完整的名称查找人名并返回。

难点在于,people.find只能绑定一个函数,那它为何可以处理3种不同的输入呢?它不可能同时绑定3个函数find0,find1与find2啊!这里的关键在于old属性。

由addMethod函数的调用顺序可知,people.find最终绑定的是find2函数。然而,在绑定find2时,old为find1;同理,绑定find1时,old为find0。3个函数find0,find1与find2就这样通过闭包链接起来了。

根据addMethod的逻辑,当f.length与arguments.length不匹配时,就会去调用old,直到匹配为止。

  1. function addMethod(object, name, f) 
  2. { 
  3.  var old = object[name]; 
  4.  object[name] = function() 
  5.  { 
  6.  // f.length为函数定义时的参数个数 
  7.  // arguments.length为函数调用时的参数个数 
  8.  if (f.length === arguments.length) 
  9.  { 
  10.  return f.apply(this, arguments); 
  11.  } 
  12.  else if (typeof old === "function") 
  13.  { 
  14.  return old.apply(this, arguments); 
  15.  } 
  16.  }; 
  17. } 
  18. // 不传参数时,返回所有name 
  19. function find0() 
  20. { 
  21.  return this.names; 
  22. } 
  23. // 传一个参数时,返回firstName匹配的name 
  24. function find1(firstName) 
  25. { 
  26.  var result = []; 
  27.  for (var i = 0; i < this.names.length; i++) 
  28.  { 
  29.  if (this.names[i].indexOf(firstName) === 0) 
  30.  { 
  31.  result.push(this.names[i]); 
  32.  } 
  33.  } 
  34.  return result; 
  35. } 
  36. // 传两个参数时,返回firstName和lastName都匹配的name 
  37. function find2(firstName, lastName) 
  38. {  
  39.  var result = []; 
  40.  for (var i = 0; i < this.names.length; i++) 
  41.  { 
  42.  if (this.names[i] === (firstName + " " + lastName)) 
  43.  { 
  44.  result.push(this.names[i]); 
  45.  } 
  46.  } 
  47.  return result; 
  48. } 
  49. var people = { 
  50.  names: ["Dean Edwards", "Alex Russell", "Dean Tom"] 
  51. }; 
  52. addMethod(people, "find", find0); 
  53. addMethod(people, "find", find1); 
  54. addMethod(people, "find", find2); 
  55. console.log(people.find()); // 输出["Dean Edwards", "Alex Russell", "Dean Tom"] 
  56. console.log(people.find("Dean")); // 输出["Dean Edwards", "Dean Tom"] 
  57. console.log(people.find("Dean", "Edwards")); // 输出["Dean Edwards"] 

(编辑:安阳站长网)

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

热点阅读