Javacript OOP

最新推荐文章于 2024-05-03 11:08:18 发布

stefli

最新推荐文章于 2024-05-03 11:08:18 发布

阅读量1.3k

点赞数

分类专栏： Javascript 文章标签： oop function javascript prototype constructor variables

Javascript 专栏收录该内容

32 篇文章 0 订阅

订阅专栏

一、公有/私有的变量及方法

二、继承

三、附录

内容：

一、公有/私有的变量及方法

本部分使用例子 Person演示如何在 Javascript 类中创建属于类的变量及方法。

部分二阐述Javascript 中类的继承。

摘要
私有变量 使用关键字 ‘var’ 在对象内部定义，变量可访问范围为对象内部、内部私有函数，特有方法。

私有函数 为对象内部定义的函数，或使用 var functionName=function(){...} 定义的函数。

特有方法 使用 this.methodName=function(){...} 定义，可供对象外及内调用。

公有属性 使用 this.variableName 定义，在对象外部可读/写公有属性。

公有方法 使用 Classname.prototype.methodName = function(){...} 定义，可供外部调用。
公有属性 使用 Classname.prototype.propertyName = someValue 定义。静态属性 使用 Classname.propertyName = someValue 定义。

范例
在下面例子中，一个人的名字和种族依赖于创建实例时的设置。

当创建实例时，一个人的年龄是1岁和一个不可见的寿命岁数。

一个人有 “weight[体重]” 变量，可从“eating[吃东西]” 方法和 “exercising[运动]” 方法中更改.

每执行 eating 一次， weight 增加三倍即 weight*=3

每执行 exercising 一次， weight 减少两倍，即 weight/=2

每当人进行吃东西和运动时，他们的年龄增加一岁。

Person 对象有一个所有人可更改的公有属性 “clothing[着衣]”, 和另一个公有属性 ‘dirtFactor[污垢值].

每当人吃东西和运动时，dirtFactor 增加，当执行 “shower()[沐浴]” 方法时， dirtFactor 减少。

范例源码：

备注：
maxAge 是一个私有变量，且没提供特有方法的访问，因此外部无法访问。

race 是一个私有变量，只从对象参数进行定义。
变量从对象构造器传递可视为私有变量。

值为 “tinfoil” 的方法“beCool()” 仅供 gk 对象使用，主要为 Gavin老年时的着衣选择，并非提供给 Person 类。
其他 Person 实例依旧使用旧的 “beCool()” 方法，也就是着衣元素为 “khakis 和 black shirt”。

注意隐式调用，即 gk.toString() 方法，它使对象实例可以像字串那样拼加。
也就是说，当 alert(gk+' is so cool.') 时， gk 输出为 Gavin, 跟 alert(gk.toString()+' is so cool.') 的作用相同。
所有类型的所有对象默认都有 .toString() 方法，但你可以重定义之。

你不能把公有方法赋值给主对象，必须使用 prototype 属性，如同 beCool() 和 shower() 方法[注意：原作者说是在他印象中]。

就像我尝试使用 amputate() 函数，和显示 Person.prototype.legs 一样，prototype 属性是为所有“对象实例”所共享。访问 lk.legs 依旧是“2”。无论如何，尝试更改实例的 .legs 属性，可使用 gk.legs=1 或在 Person类中使用 this.lengs=1。这就是为什么，调用 gk.amputate() 方法只除去了 Gavin的一条腿，而不是 Lisa。要更改原型属性，你必须使用诸如 Person.prototype.legs=1 或 this.constructor.prototype.legs=1。

可以这样定义匿名函数 foo = function(p1,p2){ some code }
使用 new Function() ，如：foo = new Function('p1','p2','code');在全局中定义可防止函数访问内部变量。

就象在前面代码中注释的那样，给 gk.race 设置某值并非重写私有变量 race的值。
你可以有公有和私有变量名为相同的变量，也就是两个名字相同但并非一样的变量，如下面代码， foo 和 this.foo 并非一样。

function StupidClass()
{
var foo = "internal";
this.foo = "external";
this.yell =
  function()
  {
   alert("Internal foo is " + foo + "/nExternal foo is " + this.foo)
  }
}

私有函数和特有方法跟私有变量和公共属性其实差不多，他们都是在 new object[创建新实例]时产生。所以，每当 new Person时，都有一份 makeOlder(), toString(), getName(), eat(), exercise(), weigh(), getRace(), getAge(), 和 muchTimePasses() 的新拷贝。对比公有方法[beCool 和 shower只有一份拷贝]，公共方法可以节省内存和提高效率。

注意，使用公有替代私有的代价，私有成员外部无法访问，因此代码结构比较强壮，但增加了内存和效率的负担；公有成员外部可访问和更改，因此代码不够强壮，但节省了内存的开销和提高了效率。

例如，在上面例子中的 age 和 maxAge为私有变量; 在外部只能通过公有方法 getAge访问[只读] age，在外部无法访问 maxAge。当把它们更改为公有属性时，如 gk.maxAge=1; gk.age=200;那样的话在外部可以直接更改它们的值，但是 alive 变量将无法得到有效的控制。

二、继承
在前面部分，我们看到怎样创建JS 类，包括私有、特有、公有的属性和方法。
本部分阐述 Javascript 中的继承。

摘要
你将看到如何继承，如：
ChildClassName.prototype = new ParentClass();。

你应当记住，要重置构造器，如：
ChildClassName.prototype.constructor=ChildClassName.

你只要在子类中使用 Function.call() 方法，就可调用被继承类的方法，
Javascript 不支持受保护(protected)方法。

范例
下面的例子，演示两个类间的继承操作：

使用 .constructor 属性
看看上面代码中的末行。Cat 的子类应当是 Cat吧[例子中为 Mammal]？
当执行 haveABaby() 方法时，这个方法创建一个新的 Mammal。
虽然我们可为 Cat 类创建一个新的 haveABaby() 方法，但是更好的方法是在被继承类中修正 haveABaby() 方法。

所有 JS 的对象实例都有一个 constructor 属性，他指向该对象的类。
如：someAnimal.constructor==Mammmal 为真。有了这个知识，我们可以重写 haveABaby() 方法，如：

Mammal.prototype.haveABaby =
function()
{
  var newBaby = new this.constructor("Baby " + this.name);
  this.offspring.push(newBaby);
  return newBaby;
}

...
myPet.haveABaby();
// Same as before: calls the method inherited from Mammal
alert(myPet.offspring[0]);
// Now results in '[Cat "Baby Felix"]'

调用’super[基类关键字]’方法
现在，让我们扩展一下上面的例子，如：每当小猫出生时，它会”mew[喵]”的叫一下。
为了这个，我们写一个 Cat.prototype.haveABaby() 方法，并且该方法可以调用 Mammal.prototype.haveABaby() 方法，代码如下：

Cat.prototype.haveABaby =
function()
{
Mammal.prototype.haveABaby.call(this);
alert("mew!");
}

上面的代码看起来或许很奇怪，因为Javascript 对象中没有任何可访问父对象的关键字，但可使用函数的call() 方法替代之。
有关 Function.call() 方法的详细用法，请见 MSDN docs for call() 。

创建我们自己的“super”属性
虽然使用 Mammal.prototype.haveABaby.call(this) 访问父类是一个解决方法，但这并非最好的方法，下面是另一个解决方法：

Cat.prototype = new Mammal();
Cat.prototype.constructor = Cat;
Cat.prototype.parent = Mammal.prototype;
...
Cat.prototype.haveABaby =
function()
{
  var theKitten = this.parent.haveABaby.call(this);
  alert("mew!");
  return theKitten;
}

戏仿 抽象类
某些OOP语言有一个叫抽象类的概念，意为该对象不能自己创建实例，只能通过继承者创建实例。
比如，你有一个名为 LivingThing 的类，你不希望某人不经继承从 LivingThing 直接创建新实例，你可使用如下代码创建抽象类：

LivingThing =
{
beBorn :
  function()
  {
   this.alive = true;
  }
}
...
Mammal.prototype = LivingThing;
Mammal.prototype.parent = LivingThing;
//Note: not 'LivingThing.prototype'
Mammal.prototype.haveABaby =
function()
{
  this.parent.beBorn.call(this);
  var newBaby = new this.constructor("Baby " + this.name);
  this.offspring.push(newBaby);
  return newBaby;
}

在上面的代码中，使用诸如 var spirit = new LivingThing() 的语法将产生错误，因为 LivingThing() 没有构造器。

简化继承
相对于每次都写几行代码继承一个类，我们可直接从 Function 对象进行扩展，如：

受保护方法
某些 OOP 语言有一个叫 “protected” 方法的概念，意为声明为 protected的方法只供对象内部及子对象访问，外部不可访问。JS 不支持这个。如果你非常希望有这个功能，那你应当写一个你自己的框架，确保每个类都有一个 “parent” 属性，每次访问对象时，都遍历关系树检测权限。虽然有办法实现，但可能不很明智。

三、附录
1. 原文链接
1.1 OOP in JS, Part 1 : Public/Private Variables and Methods
http://phrogz.net/JS/Classes/OOPinJS.html

1.2 OOP in JS, Part 2 : Inheritance
http://phrogz.net/JS/Classes/OOPinJS2.html

2. 译者群组
http://groups.google.com/group/shawlqiu?hl=en

3. 编码参考
3.1 XContextMenu2
http://shawlqiu.googlegroups.com/web/XContextMenu2.7z

4. 本文相关附件
http://shawlqiu.googlegroups.com/web/OOPInJS.7z

5. 相关术语中英对照
pure virtual class = 抽象类
public 公有
private 私有
privileged 特有

Protected ＝受保护

6. 相关术语解释
super ＝访问父对象关键字

stefli

关注

0
点赞
踩
12

收藏

觉得还不错? 一键收藏
1
评论
Javacript OOP

目录：一、公有/私有的变量及方法二、继承三、附录内容：一、公有/私有的变量及方法本部分使用例子 Person演示如何在 Javascript 类中创建属于类的变量及方法。部分二阐述Javascript 中类的继承。摘要私有变量使用关键字 ‘var’ 在对象内部定义，变量可访问范围为对象内部、内部私有函数，特有方法。私有
复制链接

扫一扫