js面向对象编程-prototype

看到同事用Dean Edwards写的base.js来实现js的面向对象编程,因此在研究了一下。本文基本是代码测试的例子,来简单说明一下javascript面向对象编程的基本用法

/**
 * @author gongpb
 * 对一个对象添加实例方法和属性-使用prototype关键字进行赋值-的格式:
 * 对象名称.prototype = {
 * 属性一 : 属性值,
 * 属性二 : 属性值,
 * 方法一 : function(参数列表) {
 *    方法体;
 *    },
 * 方法二 : function(参数列表) {
 *    方法体;
 *    }
 * }
 * 这样通过new一个对象就可以通过实例名称.属性或方法来获取属性或执行方法了
 */
function HelloWorld()
{
    alert('hello world!');
}

function test(){
 var obj = new HelloWorld();
 obj.sayHello(); //先hello world! 后js(一个是构造方法中的alert,一个是sayHello方法中的alert)
}
//给HelloWorld添加属性name和方法sayHello
HelloWorld.prototype = {
 name:"js",
 sayHello:function(){
  alert(this.name);
 }
};

//test();

/**
 * 如何给一个对象赋一个私有成员变量呢?
 * 那我们就可能要改一下HelloWorld类的声明方式了,
 * 不使用prototype进行类的属性和方法声明,
 * 而是直接使用内嵌函数和属性进行声明,修改的HelloWorld如下:
 *
 * 直接在函数内部进行了函数嵌套申明,
 * 而且我们还设置了一个局部变量privateProp,即我们的私有成员变量,
 * 该变量只能被HelloWorld2内部的函数进行访问,外部访问是不允许的,
 * 这样我们就可以通过使用变量的作用域来巧妙的设置类的私有变量了
 */
function HelloWorld2(){
 var privateProp = "hello word 2!";
 this.myMethod = function(){
  alert(privateProp);
 };
}
function test2(){
 var obj = new HelloWorld2();
 alert(obj.myMethod()); //alert:hello word 2!
 alert(obj.privateProp); //alert:undefined
}
//test2();
/**
 * JS中如何为一个类定义静态类方法和类属性呢?
 * 我们可以直接为类添加静态属性和静态方法,
 * 比如为HelloWorld类添加一个age的静态属性和一个hello的静态方法,那么声明如下:
 */
function HelloWorld3(){
 alert("hello world3");
}
//定义的静态变量
HelloWorld3.age = 22;
//定义静态方法
HelloWorld3.hello = function(){
 alert(HelloWorld3.age);
};
HelloWorld3.prototype = {
  sayHello:function(){
   alert("sayHello");
  }
};
function test3(){
 var obj = new HelloWorld3(); //alert:hello world3
 obj.sayHello(); // 正确,实例方法,可以通过实例进行访问
 //obj.hello();  //错误,不能通过实例访问静态方法。会报JS错误!
 HelloWorld3.hello(); // 正确,静态方法,通过类名进行直接访问
}
test3();

var pro = {
  prop:"test",
  myMethod:function(){
   alert(this.prop);
  }
};
pro.myMethod();

//实现javascript的继承:

var A = function() {  

};   
A.prototype = {   
  sayHello: function() {  
   alert("sayHello A");  
 }   
};   
  
var B = function() {
 
};   
B.prototype = A.prototype;   
  
var b = new B();  
b.sayHello();

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值