如何在Javascript中利用封装这个特性

对于熟悉C#和Java的兄弟们,面向对象的三大思想(封装,继承,多态)肯定是了解的,那么如何在Javascript中利用封装这个特性呢?

我们会把现实中的一些事物抽象成一个Class并且把事物的属性(名词)作为Class的Property把事物的动作(动词)作为Class的methods。在面向对象的语言中(C#等)都会有一些关键字来修饰类或者属性(Private,public,protect),这些关键词描述了访问的权限,不多做解释。泗阳县民用航空局

我们来看看Javascript的易变的特性(我们还用上一次的例子):

01 var Man = function (name, age) {
02           this.Name = name;
03           this.Age = age;
04     }
05    var Person = new Interface("Person", ["GetName""GetAge"]);
06          Man.prototype = { GetName: function () { return this.Name; },
07          GetAge: function () { return this.Age; }
08      }    
09    var Gonn = new Man("Gonn", 25);
10    alert(Gonn.GetAge());
11  Gonn.DisplayAll = function () { return "Name: "+this.GetName() + "; Age: " this.GetAge() }
12 alert(Gonn.DisplayAll());

先创建了一个Class(Javascript的匿名方法)拥有2个公共的(public)的字段(本篇blog会详细讲解,继续往下看)和2个public的方法,我们创建了一个Instance--Gonn,但是我可以为这个Instance动态的添加一个DisplayAll的方法,我想任何面向对象的语言是做不到这一点的,Javascript的灵活体现之一。

现在假设一个场景,如果有很多的程序员要用这段代码,由于Javascript的易变性,程序员就可以在实例化后改变Name的值,那初始化的动作就没有意义了:

1 var Gonn = new Man("Gonn", 25);
2 Gonn.Name = "Alice";
3 alert(Gonn.GetName());

所以我们不能让外部的人去任意的修改这个字段,在Java或C#中我们只需要个这个字段改为Private,就万事OK了,但是Javascript没有这个关键词,那我们需要这么做呢。我们可以想下在C#除了设置Private之外我们还可以怎么做?我们可以设置Setter和Getter方法。

我们来修改下上面的代码:我们称方法一:

01 var Person = new Interface("Person", ["SetName""SetAge""GetName","GetAge"]);
02        var Man = function (name, age) {
03            this.SetAge(age);
04            this.SetName(name);
05        }
06        Man.prototype = {
07            SetName: function (name) { this.Name = name; },
08            SetAge: function (age) { this.Age = age; },
09            GetName: function () { return this.Name; },
10            GetAge: function () { return this.Age; }
11        }
12       var Alan = new Man("Alan", 25);
13       Alan.Name = "Alice"//悲剧了,我alert的时候变成Alice了
14       Alan.SetAge(10);//悲剧,被别人把我的年龄给这么小
15       alert(Alan.GetName());
16       Alan.DisplayAll = function () { return "Name: "+this.GetName() + "; Age: " this.GetAge() }
17       alert(Alan.DisplayAll());

貌似样子很像C#中的Setter和Getter,但是还是可以被外部修改。但是从约束上来看,貌似比上面的code要好看些,通过方法来设置初始值。但是问题还是没有解决,我们来看看下面一种方法:闭包。解释一下,在Javascript中是通过This关键字来开发权限的(Public)。在讲闭包之前,我们需要了解下闭包的本质: 在Javascript中,只有方法是有作用域的,如果在方法中声明的变量在外部是无法访问的,那Private的概念就出来了。

01 var Person = new Interface("Person", ["SetName""SetAge""GetName","GetAge"]);
02        var Man = function (newname, newage) {
03                var name, age;
04                this.SetName = function (newname) { name = newname; }
05                this.SetAge = function (newage) { age = newage; }
06                this.GetName = function () { return name; }
07                this.GetAge = function () { return age; }
08                this.SetAge(newage);
09                this.SetName(newname);    
10        }
11        var Alan = new Man("Alan", 25);
12        Alan.name="Alice"//现在name是private了,我是无法去修改的
13        Alan.SetAge(10);
14       alert(Alan.GetAge());

现在私有的功能就实现了,我们只是用Var来代替了This而已。//我们把公共(Public)并且可以访问Private的方法称为特权方法,比如上面的this.SetName, this.SetAge.

如果我们的公共方法不涉及到访问Private的字段,那我们可以把他们放到Prototype中。//好处是多个实例的时候内存中也只有一分拷贝

1 Man.prototype.DisplayAll = function () { return "Name: " this.GetName() + "; Age: " this.GetAge() }

哈哈~我们来看下稍微有点难度的东西:静态变量和方法。

我们都是知道静态的东西属于类(Class),我们来修改下上面的代码:

01 var Person = new Interface("Person", ["SetName""SetAge""GetName","GetAge","GetCount"]);
02       var Man = (function () {
03           var count = 0;
04           return function (newname, newage) {
05               var name, age;
06               this.SetName = function (newname) { name = newname; }
07               this.SetAge = function (newage) { age = newage; }
08               this.GetName = function () { return name; }
09               this.GetAge = function () { return age; }
10               this.GetCount = function () { return count; }
11               this.SetAge(newage);
12               this.SetName(newname);
13               count++;
14           }
15       })();
16           Man.prototype.DisplayAll = function () { return "Name: " +this.GetName() + "; Age: " this.GetAge() }
17           var Alan1 = new Man("Alan", 25);
18           var Alan2 = new Man("Alan", 25);
19      alert("There are "+Alan2.GetCount()+" instances of Man" );

不管我们是通过Alan1或Alan2去GetCount,结果都一样都是2. 这里count就是一个私有的静态变量。

时间: 2024-10-23 20:01:33

如何在Javascript中利用封装这个特性的相关文章

深入理解JavaScript中的属性和特性

深入理解JavaScript中的属性和特性? JavaScript中属性和特性是完全不同的两个概念,这里我将根据自己所学,来深入理解JavaScript中的属性和特性. 主要内容如下: 理解JavaScript中理解对象的本质.理解对象与类的关系.对象与引用类型的关系 对象属性如何进行分类 属性中特性的理解 第一部分:理解JavaScript中理解对象的本质.理解对象与类的关系.对象与引用类型的关系 对象的本质:ECMA-262把对象定义为:无序属性的集合,其属性可以包含基本值.对象或者函数.即

如何在android中利用Theme设置application 的所有listview的style?~

今天看VLC的源代码,发现一个很神奇的东西 所有listview的点击效果背景色都是橘黄色 花了点时间找了一下看看怎么实现的. 首先,定义一个<selector> like this: <selector> <item android:state_pressed="true"> <shape android:shape="rectangle"> <solid android:color="@color/

JavaScript中利用Ajax 实现客户端与服务器端通信(九)

一:Ajax (Asynchronous JavaScript and XML)不是一个新的技术,事实上,它是一些旧有的成熟的技术以一种全新的更加强大的方式整合在一起 Ajax的关键技术: 1.使用XHTML(HTML)和CSS构建标准化的展示层 2.使用DOM进行动态显示和交互 3.使用XML和XSLT进行数据交换和操纵 4.使用XMLHttpRequest异步获取数据 5.使用JavaScript将所有元素绑定在一起 二:如何去写Ajax应用程序: 第一步:创建一个XMLHTTP对象 第二的

Altium原理图中利用封装管理器批量修改元器件封装

批量修改封装,或者别人拿来原理图让我们画板时,发现封装全不对.如果原理图中同样封装的器件很多时,那么批量修改封装将大大减少你的工作量.下面将我批量修改封装的方法共享给大家. 在原理图界面,打开封装管理器:快捷键T-G,如图,在Design Item ID下选择需要修改的元器件ID,这个ID在设计原理图就确定了,不可以随便改变.如果全局修改本类别的元器件选择这个选项.也可以根据需求选择其他选项.如图,选中需要更改的PC814,并全选. 在图的右下角有Add添加按钮,添加封装,如图: 这时在窗口可以

如何在JavaScript中正确引用某个方法(bind方法的应用)

在JavaScript中,方法往往涉及到上下文,也就是this,因此往往不能直接引用,就拿最常见的console.log("info…")来说,避免书写冗长的console,直接用log("info…")代替,不假思索的会想到如下语法: 1 var log = console.log; 2 log("info…"); 很遗憾,运行报错:TypeError: Illegal invocation. 为啥呢?对于console.log("i

javaScript中利用ActiveXObject来创建FileSystemObject操作文件

注:如果用javascript读本地文件,遇到安全问题. 需在浏览器中进行设置,如下:     工具—> Internet选项->安全->自定义级别->启用“没有标识为安全的ActiveX控件进行初始化和脚本运行” 一.功能实现核心:FileSystemObject 对象   要在javascript中实现文件操作功能,主要就是依靠FileSystemobject对象. 二.FileSystemObject编程 使用FileSystemObject 对象进行编程很简单,一般要经过如

如何在JavaScript中访问暂未存在的嵌套对象

JavaScript 是个很神奇的东西.但是 JavaScript中的一些东西确实很奇怪,让人摸不着头脑.其中之一就是当你试图访问嵌套对象时,会遇到这个错误:Cannot read property 'foo' of undefined 在大多数情况下,处理嵌套的对象,通常我们需要安全地访问最内层嵌套的值. 来个粟子: const user = { id: 101, email: '[email protected]', personalInfo: { name: 'Jack', address

如何在 JavaScript 中使用 C 程序

JavaScript 是个灵活的脚本语言,能方便的处理业务逻辑.当需要传输通信时,我们大多选择 JSON 或 XML 格式. 但在数据长度非常苛刻的情况下,文本协议的效率就非常低了,这时不得不使用二进制格式. 去年的今天,在折腾一个 前后端结合的 WAF 时,就遇到了这个麻烦. 因为前端脚本需要采集不少数据,而最终是隐写在某个 cookie 里的,因此可用的长度非常有限,只有几十个字节. 如果不假思索就用 JSON 的话,光一个标记字段 {"enableXX": true} 就占去了一

javascript中的封装、多态、和复制

1.封装 在许多面向对象的语言中,对象封装有语法解析来实现的,这些语言或许提供了private,public,protected等关键字来控制访问权限. 但javascript并没有提供这些关键字,只能通过闭包来改变变量的作用域来实现封装特性 //私有变量 .使用闭包来实现私有变量 var privateObj = (function(){ var __private = 'mico'; return { getName: function(){ return __private; } } })