加入收藏 | 设为首页 | 会员中心 | 我要投稿 辽源站长网 (https://www.0437zz.com/)- 云专线、云连接、智能数据、边缘计算、数据安全!
当前位置: 首页 > 运营中心 > 建站资源 > 优化 > 正文

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

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

(编辑:辽源站长网)

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

推荐文章
    热点阅读