• 在庆祝海南建省办经济特区30周年大会上的讲话 2019-10-07
  • 俄罗斯世界杯F组:球迷风采 2019-09-24
  • 彭于晏廖凡曝姜文“精神洁癖” 2019-09-24
  • 苏州大学研究生支教团网上众筹资助留守儿童 2019-09-23
  • 湖北政务微信排行榜第187期出炉 交警类公号表现亮眼 2019-09-19
  • 【奋斗吧2018】风电检修工——荒原上的“听风者” 2019-08-31
  • 母亲节又送康乃馨?送这样的健康佳品才走心 2019-08-30
  • [酷]此文已经把马克思理论、边际理论、人类需求层次理论、生物学理论、心理学理论、社会管理学理论等理论在哲学层面完美融合了! 2019-08-26
  • 兰芝雪纱修颜气垫隔离霜 2019-07-27
  • “鹊桥”中继星顺利进入使命轨道运行 2019-07-27
  • 超越舆情管理的360度信息决策 2019-07-22
  • 视频陶然居变形记:从路边小饭馆到全国餐饮十强 2019-07-21
  • 防震减灾事业发展的重要理论成果 2019-07-20
  • 珠宝配美人!李冰冰大片衣着性感秀身段 2019-07-20
  • 机器人也能拥有“情商”?这个可以有 2019-07-19
  • 香港赛马会官方网免费料:JavaScript碎片—函数闭包(模拟面向对象)

     更新时间:2019年03月13日 17:00:02   作者:钟离上河   我要评论
    这篇文章主要介绍了JavaScript函数闭包,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

    香港赛马会网站惠泽社绝杀八码 www.mwcrz.tw 经过这几天的博客浏览,让我见识大涨,其中有一篇让我感触犹深,JavaScript语言本身是没有面向对象的,但是那些大神们却深深的模拟出来了面向对象,让我震撼不已。本篇博客就是在此基础上加上自己的认知,如有错误,还请见谅。

    具体来说实现模拟面向对象主要是利用JavaScript函数闭包这个概念。由于JavaScript中的每一个function都会形成一个作用域,而如果变量声明在这个域中,那么外部是无法直接去访问,要想访问必须new出一个实例来,相当于Java中class。首先让我们来了解一下prototype方法:

    1、不使用prototype属性定义的对象方法,是静态方法,只能直接用类名进行调用!另外,此静态方法中无法使用this变量来调用对象其他的属性!
    2、使用prototype属性定义的对象方法,是非静态方法,只有在实例化后才能使用!其方法内部可以this来引用对象自身中的其他属性!
    Tips :所有的变量,如果不加上var关键字,则默认的会添加到全局对象的属性上去!

    具体来说模拟类有以下5种常见写法:

    第一种写法:具体介绍见以下代码注释。

    function Circle(r) {
        this.r = r;
      }
    
      Circle.PI = 3.14159;/*Circle.PI属于全局变量 */
      Circle.prototype.area = function() {
        return Circle.PI * this.r * this.r;
      }/*Circle方法调用prototype属性从而能用this调用 Circle方法中的r属性*/
    
      var c = new Circle(1.0);/* 实例化 Circle*/
      alert(c.area());

    第二种写法:与Java类相似,推荐使用!

    var Circle = function() { 
        var obj = new Object(); /*先实例化Object方法,使之能调用 obj.PI属性及obj.area方法*/
        obj.PI = 3.14159; 
         
        obj.area= function( r ) { 
          return this.PI * r * r; 
        } 
        return obj; 
      } 
       
      var c = new Circle(); 
      alert( c.area( 1.0 ) );

    第三种写法:主要思想是自己先实例化出一个对象,在往这个对象里添加属性及方法

    var Circle = new Object(); 
    Circle.PI = 3.14159; 
    Circle.Area = function( r ) { 
        return this.PI * r * r; 
    } 
     
    alert( Circle.Area( 1.0 ) );

     第四种写法:该写法跳过new这一步骤,且电脑简单清晰明了,个人推荐这种写法??!

    var Circle={ 
          "PI":3.14159, 
         "area":function(r){ 
             return this.PI * r * r; 
            } 
        }; 
        alert( Circle.area(1.0) );

     第五种写法:此方法与前三种大同小异,不过听说这种写法很少人用,不建议推荐使用哦??!

    var Circle = new Function("this.PI = 3.14159;this.area = function( r ) {return r*r*this.PI;}"); 
     
    alert( (new Circle()).area(1.0) ); 

    想必各位朋友都在想既然是模拟面向对象,那是不是得有封装继承,getset方法???答案是肯定的,那让我们来看看如下代码:

     封装:在看看如下代码我们能清晰的了解到封装的使用,假若我们去掉 var name = "default"; 中的var,那么结果又是怎么样??答案是与先前一样的,由此可见无var定义的属性只是再其变量作用域中充当全局,只有属性在其作用域中是私有的,若要定义一个私有方法需要将其赋予一个变量充当属性?;褂斜纠衝ew 可加可不加,若不加可往其后添加()。

    var person = function(){  
      //变量作用域为函数内部,外部无法访问  
      var name = "default";    
        
      return {  
        getName : function(){  
          return name;  
        },  
        setName : function(newName){  
          name = newName;  
        }  
      }  
    }();  
       
    
    alert(person.name);//直接访问,结果为undefined 
    alert(person.getName());  
    person.setName("abruzzi");  
    alert(person.getName());

    实现类和继承:该例的主要思想是定义一个变量,将一个方法赋予它,在根据prototype方法将需要继承的类放入其中即可达到继承的效果。。

    function Person(){  
      var name = "default";    
        
      return {  
        getName : function(){  
          return name;  
        },  
        setName : function(newName){  
          name = newName;  
        }  
      }  
      }; /* 封装好的一个类Person */ var Jack = function(){};
      //继承自Person
      Jack.prototype = new Person();
      //添加私有方法
      Jack.prototype.Say = function(){
        alert("Hello,my name is Jack");
      };
      var j = new Jack();
      j.setName("Jack");
      j.Say();
      alert(j.getName());

    以上所述是小编给大家介绍的JavaScript函数闭包详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

    相关文章

    • HTML5实现留言和回复页面样式

      HTML5实现留言和回复页面样式

      这篇文章主要介绍了用HTML5如何实现留言和回复样式,需要的朋友可以参考下
      2015-07-07
    • JavaScript 学习初步 入门教程

      JavaScript 学习初步 入门教程

      看了《21天学习JavaScript》的视频教程,感觉就是语法好熟悉,和C++类似,和C#类似,和Java类似!幡然悔悟这些语言的语法都是类似的,数据类型,对象方法(或者称之为函数,由于我是个菜鸟所以也数不清楚到底是什么)。
      2010-03-03
    • Javascript实例教程(19) 使用HoTMetal(7)

      Javascript实例教程(19) 使用HoTMetal(7)

      Javascript实例教程(19) 使用HoTMetal(7)...
      2006-12-12
    • 脚本中出现 window.open() access is denied - 拒绝访问 情况一则及分析

      脚本中出现 window.open() access is denied - 拒绝访问 情况一则

      脚本中出现 window.open() access is denied - 拒绝访问 情况一则及分析...
      2007-01-01
    • 深入理解javascript的执行顺序

      深入理解javascript的执行顺序

      JavaScript是一种描述型脚本语言,它不同于java或C#等编译性语言,它不需要进行编译成中间语言,而是由浏览器进行动态地解析与执行
      2014-04-04
    • js函数调用常用方法详解

      js函数调用常用方法详解

      js的函数调用会免费奉送两个而外的参数就是 this 和 arguments,我们所知道的应该有4中调用方式吧,接下来将为您详细介绍,感兴趣的朋友可以参考下
      2012-12-12
    • 网页中CDATA标记的说明

      网页中CDATA标记的说明

      经常在网页html代码中看见这样的嵌入标签,但实际使用没有用过,特此在记录下。
      2010-09-09
    • Javascript入门学习第五篇 js函数

      Javascript入门学习第五篇 js函数

      上篇文章讲了js中对象和数组的一些方法。 这章我们先说说函数,然后来点实战。
      2008-07-07
    • 探寻Javascript执行效率问题

      探寻Javascript执行效率问题

      作为开发人员,Web页面加载或刷新的速度对其网站至关重要??⑷嗽痹诟髦咒榔髦械魇訨avaScript的方法要少得多。比如,在Mozilla Firefox中,可以使用Firebug调试JavaScript,但仍然不能调整很多性能问题,如浏览器呈现消耗时间。
      2014-11-11
    • 前端面试题及答案整理(二)

      前端面试题及答案整理(二)

      上一篇从常见数据结构算法、JavaScript两个方面从面试的角度进行了整理,本文将对其余内容进行补充
      2016-08-08

    最新评论

  • 在庆祝海南建省办经济特区30周年大会上的讲话 2019-10-07
  • 俄罗斯世界杯F组:球迷风采 2019-09-24
  • 彭于晏廖凡曝姜文“精神洁癖” 2019-09-24
  • 苏州大学研究生支教团网上众筹资助留守儿童 2019-09-23
  • 湖北政务微信排行榜第187期出炉 交警类公号表现亮眼 2019-09-19
  • 【奋斗吧2018】风电检修工——荒原上的“听风者” 2019-08-31
  • 母亲节又送康乃馨?送这样的健康佳品才走心 2019-08-30
  • [酷]此文已经把马克思理论、边际理论、人类需求层次理论、生物学理论、心理学理论、社会管理学理论等理论在哲学层面完美融合了! 2019-08-26
  • 兰芝雪纱修颜气垫隔离霜 2019-07-27
  • “鹊桥”中继星顺利进入使命轨道运行 2019-07-27
  • 超越舆情管理的360度信息决策 2019-07-22
  • 视频陶然居变形记:从路边小饭馆到全国餐饮十强 2019-07-21
  • 防震减灾事业发展的重要理论成果 2019-07-20
  • 珠宝配美人!李冰冰大片衣着性感秀身段 2019-07-20
  • 机器人也能拥有“情商”?这个可以有 2019-07-19
  • 极速pk10app开奖 必赢客幸运飞艇计划 郜林 对冲投注法 欢乐斗地主二人官方版 平特复试连怎么玩法 娱乐棋牌 北京pk拾预算 高准翼 时时彩平台源码出租