• 机器人也能拥有“情商”?这个可以有 2019-07-19
  • 重庆“轮椅教师”高位截瘫仍坚守讲台 2019-07-07
  • 百度车联网携手宝马 合作伙伴全面升级为国际OEM厂商 2019-07-01
  • 全面从严治党永远在路上——辽宁代表团开放日侧记 2019-07-01
  • 【学习时刻】华侨大学黄日涵:“一带一路”盛会开启合作发展新篇章 2019-06-24
  • 秒变迷弟!吴建豪晒与甄子丹合影:偶像给我签名 2019-06-20
  • 军统头目戴笠留下哪些巨额遗产 令蒋介石身边人惊诧 2019-06-20
  • 初春喝藿香汤 解表化湿,散寒温经 2019-06-18
  • 新华时评:磋商,不等于反复折腾 2019-06-09
  • 天山特克斯峡谷 中国国家地理网 2019-06-08
  • 端午小长假珠海口岸将迎双向客流高峰 2019-06-08
  • 王朝崩塌!恒大半个月内双线出局 卡帅敲响下课警钟 2019-06-07
  • 一周人事:国务院发布任免刘伟当选北京市总工会主席 2019-06-07
  • 敞篷式设计 日产聆风Open Car官图发布 2019-06-06
  • 习近平为传统文化“代言” 2019-06-05
  • 香港赛马会十码大公开:JavaScript碎片—函数闭包(模拟面向对象)

    香港赛马会网站惠泽社绝杀八码 www.mwcrz.tw  更新时间:2019年03月13日 17:00:02   作者:钟离上河   我要评论

    这篇文章主要介绍了JavaScript函数闭包,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

    经过这几天的博客浏览,让我见识大涨,其中有一篇让我感触犹深,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函数闭包详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

    相关文章

    • Javascript学习笔记4 Eval函数

      Javascript学习笔记4 Eval函数

      在初学JS的时候就知道这个函数,却一直没有了解过他的用途,也一直都是睁一只眼闭一只眼,这次来深入地了解一下这个函数的作用。
      2010-01-01
    • javascript中call()、apply()的区别

      javascript中call()、apply()的区别

      这篇文章主要介绍了javascript中call()、apply()的区别,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
      2019-03-03
    • Javascript学习笔记之 函数篇(一) : 函数声明和函数表达式

      Javascript学习笔记之 函数篇(一) : 函数声明和函数表达式

      function 是 Javascript 中的第一类对象,这就意味着函数可以像其他值一样被传递。一个最常见的用法就是将一个匿名函数作为回调函数传递到另外一个异步函数中。
      2014-06-06
    • javascript实现的网页局布刷新效果

      javascript实现的网页局布刷新效果

      AJAX,近几年火热起来的一个词.什么是ajax本文就不介绍了,其实,AJAX也就是 javascript脚本的应用.全拼是:AsynchronousJavaScript+XML .现在我们就来看一个用javascript实现的局部刷新
      2008-12-12
    • Javascript 按位取反运算符 (~)

      Javascript 按位取反运算符 (~)

      Javascript 按位取反运算符 (~) ,对一个表达式执行位非(求非)运算。如 ~1 = -2 ; ~2 = -3 ; ~99 = -100
      2014-02-02
    • JavaScript的this关键字的理解

      JavaScript的this关键字的理解

      今天的教程来自天才的Cody Lindley的新书:《JavaScript启蒙教程 / JavaScript Enlightenment》。他讨论了令人迷惑的关键字this,以及确定和设置this的值的方法。
      2016-06-06
    • 优化RequireJS项目的相关技巧总结

      优化RequireJS项目的相关技巧总结

      这篇文章主要介绍了优化RequireJS项目的相关技巧总结,RequireJS是一个人气JavaScript库,需要的朋友可以参考下
      2015-07-07
    • 浅谈javascript回调函数

      浅谈javascript回调函数

      回调函数是从一个叫函数式编程的编程范式中衍生出来的概念。简单来说,函数式编程就是使用函数作为变量。函数式编程过去 - 甚至是现在,依旧没有被广泛使用 - 它过去常被看做是那些受过特许训练的,大师级别的程序员的秘传技巧。
      2014-12-12
    • javascript学习笔记(十) js对象 继承

      javascript学习笔记(十) js对象 继承

      javascript学习笔记之js对象 继承介绍,需要的朋友可以参考下
      2012-06-06
    • javascript中递归函数用法注意点

      javascript中递归函数用法注意点

      这篇文章主要针对javascript中递归函数用法注意点做介绍,有需要小伙伴可以来学习下
      2015-07-07

    最新评论

  • 机器人也能拥有“情商”?这个可以有 2019-07-19
  • 重庆“轮椅教师”高位截瘫仍坚守讲台 2019-07-07
  • 百度车联网携手宝马 合作伙伴全面升级为国际OEM厂商 2019-07-01
  • 全面从严治党永远在路上——辽宁代表团开放日侧记 2019-07-01
  • 【学习时刻】华侨大学黄日涵:“一带一路”盛会开启合作发展新篇章 2019-06-24
  • 秒变迷弟!吴建豪晒与甄子丹合影:偶像给我签名 2019-06-20
  • 军统头目戴笠留下哪些巨额遗产 令蒋介石身边人惊诧 2019-06-20
  • 初春喝藿香汤 解表化湿,散寒温经 2019-06-18
  • 新华时评:磋商,不等于反复折腾 2019-06-09
  • 天山特克斯峡谷 中国国家地理网 2019-06-08
  • 端午小长假珠海口岸将迎双向客流高峰 2019-06-08
  • 王朝崩塌!恒大半个月内双线出局 卡帅敲响下课警钟 2019-06-07
  • 一周人事:国务院发布任免刘伟当选北京市总工会主席 2019-06-07
  • 敞篷式设计 日产聆风Open Car官图发布 2019-06-06
  • 习近平为传统文化“代言” 2019-06-05
  • 江西麻将机遥控卡 神将传奇手游 阿兹特克宝藏电子游戏 四川金7乐开奖大小走势图 黑龙江麻将挂 水果大战僵尸下载 云达不莱梅门将 二分彩规律 篮球巨星豪华版电子 福建36选7现场开奖