JavaScript重构(五):利用原型和闭包,完成组件方法

本文探讨了在JavaScript中实现组件方法的不同方式,从使用原型到利用闭包,最终实现了单例模式。通过具体示例展示了如何封装组件并确保全局只有一个实例。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

  终于要定义一个组件方法了,利用原型来实现。看看这样如何:
  function Player(name){
  Player.MIN_EXTENDED_TIME = 1;
  Player.MAX_EXTENDED_TIME = 3;
  this._name = name;
  };
  Player.prototype.setName = function(name){
  this._name = name;
  };
  Player.prototype.toString = function(){
  return "Player: " + this._name;
  };
  var player = new Player("WindowsMediaPlayer");
  alert(player.toString()); //输出WindowsMediaPlayer
  player.setName("RealPlayer");
  alert(player.toString()); //输出RealPlayer
  alert(Player.MAX_EXTENDED_TIME);
  恩,有封装、有常量、也有复写了Object的toString方法,至于继承之类的事情,咱们后面再说,初看看还不错。可是这样的组件方法定义不够优雅,也不够直观,方法都是放在独立的位置定义的,并没有和最开始的组件方法放置在一起,如果能像Java那样定义岂不更好?
  对了,可以用闭包来实现。试试看吧:
  function Player(name){
  Player.MIN_EXTENDED_TIME = 1;
  Player.MAX_EXTENDED_TIME = 3;
  this._name = name;
  this.setName = function(name){
  this._name = name;
  };
  this.toString = function(){
  return "Player: " + this._name;
  };
  };
  var player = new Player("WindowsMediaPlayer");
  alert(player.toString()); //输出WindowsMediaPlayer
  player.setName("RealPlayer");
  alert(player.toString()); //输出RealPlayer
  alert(Player.MAX_EXTENDED_TIME);
  不像Groovy里面,闭包做了很大程度上的强化,包括新的语法的支持;JavaScript的闭包是很简单的闭包,它没有特殊的需要额外学习的语法,任意一个function,里面只要包含未绑定变量,这些变量是在function所属的上下文环境中定义的,那么,这个function就是闭包。顺便罗嗦一句,和闭包相反的,不正是不包含任何未绑定变量的函数式代码吗?
  写是写好了,可是转念一想,Player应当只有一份,它是单例的,最好我也能像Java那样弄一个单例模式出来 :),可是事不遂愿,我没有办法在JavaScript做一个private的构造器,用这种思路去实现单例模式似乎不可行……
  怎么办?
  然而天无绝人之路,我控制不了你new一个Player的对象,我却可以控制你new出来的这个Player对象的属性和行为!当你需要使用你new出来的Player的对象的时候,你发现根本无法完成,或者它只是一个空壳!真正的东西还是要靠单例中经典的getInstance方法来获得:
  function Player(){
  throw new Error("Can not instantiate a Player object.");
  }; //这只是个空壳
  (function(){ //这才是货真价实的东西
  Player.MIN_EXTENDED_TIME = 1;
  Player.MAX_EXTENDED_TIME = 3;
  Player._player = false;
  Player.getInstance = function(){
  if(!Player._player){
  alert("Init...");
  Player._player = {
  _name : name,
  setName : function(name){
  this._name = name;
  },
  toString : function(name){
  return "Player: " + this._name;
  }
  };
  }
  return Player._player;
  };
  })();
  //var player = new Player(); //new Player()会抛出异常
  var player1 = Player.getInstance();
  var player2 = Player.getInstance();
  player2.setName("RealPlayer");
  alert(player2.toString()); //输出RealPlayer
  好,真不错,单例模式在JavaScript下也成功实施了
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值