javascript面向对象5

类变量/类方法/实例变量/实例方法

在js中，所有的方法都有一个call方法和apply方法，这两个方法可以模拟对象调用方法。它的第一个参数是对象，后面的参数表示对象调用这个方法时的参数。比如，我们定义了一个方法f(),然后调用下面的语句：

f.call(0,1,2);

作用相当于：

o.m = f;

o.m(1,2);

delete o.m;

举个例子：

JS代码：(见附件test1.html)

//定义方法

function Person(name,age){

this.name = name;

this.age = age;

}

//空对象

var o = new Object();

//undefined_undefined

alert(o.name + "_" + o.age);

//相当于调用o.person("wangsy",31);

Person.call(o,"wangsy",31);

//wangsy_31

alert(o.name + "_" + o.age);

//apply方法作用同call,不同之处在于传递参数的形式是用数组来传递

Person.apply(o,["wangsy",31]);

//wangsy_31

alert(o.name + "_" + o.age);

实例变量和实例方法都是通过实例对象加”.”操作符然后跟上属性名或方法来访问的，但是我们也可以为类来设置方法或变量。这样就可以直接用类名加”.”操作符然后跟上属性名或方法来访问。定义类属性和类方法很简单。

JS代码：(见附件test2.html)

//定义类变量，创建的Person实例的个数

Person.counter = 0;

//定义方法

function Person(name,age){

this.name = name;

this.age = age;

//每创建一个实例，类变量加1

Person.counter++;

}

//类方法，判断谁的年龄较大

Person.whoIsOlder = function(p1,p2){

if (p1.age > p2.age)

{

return p1;

}else{

return p2;

}

var p1 = new Person("p1",18);

var p2 = new Person("p2",22);

//现在有2个人

alert("现在有" + Person.counter + "个人");

var p = Person.whoIsOlder(p1,p2);

alert(p.name + "的年龄较大");

prototype属性的应用：

假设定义了一个Circle类，有一个radisu属性和area方法，实现如下：

JS代码：(见附件test3.html)

function Circle(radius){

this.radius = radius;

this.area = function(){

return 3.14 * this.radius * this.radius;

}

var c = new Circle(1);

//3.14

alert(c.area());

假设我们定义了100个Circle类的实例对象，那么每个实例对象都有一个radius属性和area方法，实际上除了radius属性，每个Circle类的实例对象的area方法都是一样的，可以把area方法抽出来定义在Circle类的prototype属性中，这样所有的实例对象就可以调用这个方法，从而节省空间。

JS代码：(见附件test4.html)

function Circle(radius){

this.radius = radius;

}

Circle.prototype.area = function(){

return 3.14 * this.radius * this.radius;

}

var c = new Circle(1);

//3.14

alert(c.area());

现在，我们用prototype属性来模拟一下类的继承：首先定义一个Circle类作为父类，然后定义了子类PositionCircle：

JS代码：(见附件test5.html)

//定义父类Circle

function Circle(radius){

this.radius = radius;

}

Circle.prototype.area = function(){

//定义父类的方法area计算面积

return 3.14 * this.radius * this.radius;

}

//定义PositionCircle类

function PositionCircle(x,y,radius){

//属性横坐标

this.x = x;

//属性纵坐标

this.y = y;

//调用父类的方法，相当于调用this.Circle(radius)

//设置PositionCircle类的radius属性

Circle.call(this,radius);

}

//设置PositionCircle的父类为Circle类

PositionCircle.prototype = new Circle();

var pc = new PositionCircle(1,2,1);

//1

alert(pc.radius);

//Circle

alert(pc.constructor);

PositionCircle.prototype.constructor = PositionCircle;

//PositionCircle

alert(pc.constructor);

转载于:https://blog.51cto.com/jawsy/167226

javascript面向对象5相关推荐

JavaScript面向对象编程
自从有了Ajax这个概念,JavaScript作为Ajax的利器,其作用一路飙升.JavaScript最基本的使用,以及语法.浏览器对象等等东东在这里就不累赘了.把主要篇幅放在如何实现JavaScri ...
《JavaScript面向对象精要》读书笔记
JavaScript(ES5)的面向对象精要标签: JavaScript 面向对象读书笔记 2016年1月16日-17日两天看完了<JavaScript面向对象精要>(参加异步社区的活 ...
javascript面向对象系列第一篇——构造函数和原型对象
前面的话一般地,javascript使用构造函数和原型对象来进行面向对象编程,它们的表现与其他面向对象编程语言中的类相似又不同.本文将详细介绍如何用构造函数和原型对象来创建对象构造函数构造函数是 ...
用JSON和Javscript的prototype来构建完善的Javascript面向对象表示法
[原文地址:http://www.cnblogs.com/robinhood/archive/2006/11/16/515412.html] 上次发贴没能很好的总结Javascrip编写类的方法,这次 ...
《JavaScript面向对象精要》——1.8　原始封装类型
本节书摘来自异步社区<JavaScript面向对象精要>一书中的第1章,第1.8节,作者:[美]Nicholas C. Zakas 译者: 胡世杰更多章节内容可以访问云栖社区" ...
《JavaScript面向对象编程指南》——第1章引言1.1 回顾历史
本节书摘来自异步社区<JavaScript面向对象编程指南>一书中的第1章,第1.1节,作者: [加]Stoyan Stefanov 译者: 凌杰更多章节内容可以访问云栖社区" ...
《JavaScript面向对象编程指南》——1.3 分析现状
本节书摘来自异步社区<JavaScript面向对象编程指南>一书中的第1章,第1.3节,作者: [加]Stoyan Stefanov 译者: 凌杰更多章节内容可以访问云栖社区" ...
JavaScript面向对象及原型及setTimeout
JavaScript面向对象最笨的写法: function Foo(n) { this.name = n; this.sayName = function() { c ...
JavaScript面向对象的支持(7)
================================================================================ Qomolangma OpenProj ...
（二）Javascript面向对象编程：构造函数的继承
Javascript面向对象编程:构造函数的继承这个系列的第一部分,主要介绍了如何"封装"数据和方法,以及如何从原型对象生成实例. 今天要介绍的是,对象之间的"继承&q ...

javascript面向对象5

javascript面向对象5相关推荐

最新文章

热门文章