`
yyangbb
  • 浏览: 36557 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

javascript面向对象技术基础(五)(转载)

阅读更多

原文:javascript面向对象技术基础(五)

类变量/类方法/实例变量/实例方法
先补充一下以前写过的方法:
在javascript中,所有的方法都有一个call方法和apply方法.这两个方法可以模拟对象调用方法.它的第一个参数是对象,后面的
参数表示对象调用这个方法时的参数(ECMAScript specifies two methods that are defined for all functions, call()
and apply(). These methods allow you to invoke a function as if it were a method of some other object. The first
argument to both call() and apply() is the object on which the function is to be invoked; this argument becomes
the value of the this keyword within the body of the function. Any remaining arguments to call() are the values
that are passed to the function that is invoked).比如我们定义了一个方法f(),然后调用下面的语句:
f.call(o, 1, 2);
作用就相当于
o.m = f;
o.m(1,2);
delete o.m;
举个例子:

Js代码
  1. function  Person(name,age) {   //定义方法   
  2.     this .name = name;  
  3.     this .age = age;  
  4. }  
  5. var  o =  new  Object();    //空对象   
  6. alert(o.name + "_"  + o.age);  //undefined_undefined   
  7.   
  8. Person.call(o,"sdcyst" ,18);  //相当于调用:o.Person("sdcyst",18)   
  9. alert(o.name + "_"  + o.age);  //sdcyst_18   
  10.   
  11. Person.apply(o,["name" ,89]); //apply方法作用同call,不同之处在于传递参数的形式是用数组来传递   
  12. alert(o.name + "_"  + o.age);  //name_89   
function Person(name,age) {  //定义方法
    this.name = name;
    this.age = age;
}
var o = new Object();   //空对象
alert(o.name + "_" + o.age); //undefined_undefined

Person.call(o,"sdcyst",18); //相当于调用:o.Person("sdcyst",18)
alert(o.name + "_" + o.age); //sdcyst_18

Person.apply(o,["name",89]);//apply方法作用同call,不同之处在于传递参数的形式是用数组来传递
alert(o.name + "_" + o.age); //name_89

 ---------------------------------

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

Js代码
  1. Person.counter = 0;    //定义类变量,创建的Person实例的个数   
  2. function  Person(name,age) {  
  3.     this .name = name;  
  4.     this .age = age;  
  5.     Person.counter++; //没创建一个实例,类变量counter加1   
  6. };  
  7.   
  8. Person.whoIsOlder = function (p1,p2) {  //类方法,判断谁的年龄较大   
  9.     if (p1.age > p2.age) {  
  10.         return  p1;  
  11.     } else  {  
  12.         return  p2;  
  13.     }  
  14. }  
  15.   
  16. var  p1 =  new  Person( "p1" ,18);  
  17. var  p2 =  new  Person( "p2" ,22);  
  18.   
  19. alert("现在有 "  + Person.counter +  "个人" );   //现在有2个人   
  20. var  p = Person.whoIsOlder(p1,p2);  
  21. alert(p.name + "的年龄较大" );    //p2的年龄较大   
Person.counter = 0;   //定义类变量,创建的Person实例的个数
function Person(name,age) {
    this.name = name;
    this.age = age;
    Person.counter++; //没创建一个实例,类变量counter加1
};

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);

alert("现在有 " + Person.counter + "个人");  //现在有2个人
var p = Person.whoIsOlder(p1,p2);
alert(p.name + "的年龄较大");   //p2的年龄较大

 

prototype属性的应用:
下面这个例子是根据原书改过来的.
假设我们定义了一个Circle类,有一个radius属性和area方法,实现如下:

Js代码
  1. function  Circle(radius) {  
  2.     this .radius = radius;  
  3.     this .area =  function () {  
  4.         return  3.14 *  this .radius *  this .radius;  
  5.     }  
  6. }  
  7. var  c =  new  Circle(1);  
  8. alert(c.area());  //3.14   
function Circle(radius) {
    this.radius = radius;
    this.area = function() {
        return 3.14 * this.radius * this.radius;
    }
}
var c = new Circle(1);
alert(c.area());  //3.14

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

Js代码
  1. function  Circle(radius) {  
  2.     this .radius = radius;  
  3. }  
  4. Circle.prototype.area = function () {  
  5.         return  3.14 *  this .radius *  this .radius;  
  6.     }  
  7. var  c =  new  Circle(1);  
  8. alert(c.area());  //3.14   
function Circle(radius) {
    this.radius = radius;
}
Circle.prototype.area = function() {
        return 3.14 * this.radius * this.radius;
    }
var c = new Circle(1);
alert(c.area());  //3.14

 

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

Js代码
  1. function  Circle(radius) {   //定义父类Circle   
  2.     this .radius = radius;  
  3. }  
  4. Circle.prototype.area = function () {  //定义父类的方法area计算面积   
  5.     return   this .radius *  this .radius * 3.14;  
  6. }  
  7.   
  8. function  PositionCircle(x,y,radius) {  //定义类PositionCircle   
  9.     this .x = x;                     //属性横坐标   
  10.     this .y = y;                     //属性纵坐标   
  11.     Circle.call(this ,radius);       //调用父类的方法,相当于调用this.Circle(radius),设置PositionCircle类的   
  12.                                    //radius属性   
  13. }  
  14. PositionCircle.prototype = new  Circle();  //设置PositionCircle的父类为Circle类   
  15.   
  16. var  pc =  new  PositionCircle(1,2,1);  
  17. alert(pc.area());  //3.14   
  18.                    //PositionCircle类的area方法继承自Circle类,而Circle类的   
  19.                    //area方法又继承自它的prototype属性对应的prototype对象   
  20. alert(pc.radius); //1  PositionCircle类的radius属性继承自Circle类   
  21.   
  22. /*  
  23. 注意:在前面我们设置PositionCircle类的prototype属性指向了一个Circle对象,  
  24. 因此pc的prototype属性继承了Circle对象的prototype属性,而Circle对象的constructor属  
  25. 性(即Circle对象对应的prototype对象的constructor属性)是指向Circle的,所以此处弹出  
  26. 的是Circ.  
  27. */   
  28. alert(pc.constructor); //Circle       
  29.   
  30. /*为此,我们在设计好了类的继承关系后,还要设置子类的constructor属性,否则它会指向父类  
  31. 的constructor属性  
  32. */   
  33. PositionCircle.prototype.constructor = PositionCircle  
  34. alert(pc.constructor);  //PositionCircle  
分享到:
评论

相关推荐

    华为面试试题,很经典,转载

    【Java】在Java部分,面试可能涵盖基础语法、面向对象编程、集合框架、多线程、异常处理、IO流、JVM内存模型以及设计模式等方面。例如,可能会问到如何优化代码性能,如何处理并发问题,或者对Java 8的新特性如...

    项目综合案例采用两年所学的内容

    学的课程有java初级 Java高级 java的面向对象 java的面向过程 java的封装 继承 多态 jdbc JavaScript初级内容 Html Css 这个学期开始前端的第二部分 jquery的基础操作 jquery的选择器 事件 效果 Css3 Html5新的属性 ...

    java J2EE成长之路

    它不仅包含了Java的基础知识,如面向对象编程的概念(如重载和覆盖、运行时类型与面向对象的关系),还涉及到了J2EE的关键技术,如EJB(Enterprise JavaBeans)和JSP(JavaServer Pages)。 1. **Java基础**:在...

    转载 - 26本 Ruby/Rails 相关英文图书简评

    Ruby 是一种面向对象的、动态类型的编程语言,以其简洁、优雅的语法和强大的元编程能力而闻名。Rails,全称为 Ruby on Rails,是基于 Ruby 语言的一个开源 Web 应用框架,它遵循“约定优于配置”(Convention over ...

    JAVA文章精选542个(txt) 免费分享

    阐述了Java中的方法重载(Overloading)和方法覆盖(Overriding)概念,以及运行时类型识别(多态性)在面向对象编程中的作用。 10. **SSL與數位認證.txt**: SSL(Secure Sockets Layer)和数字认证是网络安全的...

    httpSniffer源代码

    3. **C#编程基础**:熟悉C#的语法、类库和面向对象编程概念。 4. **数据解析技术**:掌握正则表达式、XML、JSON等解析技术,用于提取网页中的关键信息。 5. **视频流格式**:了解常见的视频编码格式(如H.264、VP9)...

    The Ruby Programming Language PDF

    Ruby是一种流行的开源、动态的面向对象脚本语言,由松本行弘(Yukihiro "Matz" Matsumoto)设计。它以简洁易读的语法和强大的开发效率而闻名,广泛用于Web开发、系统管理自动化、以及各种应用程序的原型设计和开发。...

    j2ee在线购物网实例源码

    【描述】"j2ee在线购物网实例源码,转载供大家共同学习"表明这是一个共享的学习资源,旨在促进开发者之间的知识交流和技能提升。通过分析和研究这个源码,开发者可以深入理解如何在实际项目中运用J2EE技术栈,包括...

Global site tag (gtag.js) - Google Analytics