您现在的位置是:首页 > 文章详情文章详情

JavaScript 继承的介绍及封装

会飞的猪 2018-12-22 325人已围观

简介白码驿站是一个面向开发者的知识共享社区,专注于为开发者打造一个纯净的技术交流社区(源码下载,免费在线图片压缩,jquery插件,插件下载,JS/CSS在线压缩。)-白码驿站

        几乎每个开发人员都有面向对象语言(比如C#、Java)的开发经验。在面向对象的语言中,有两个非常重要的概念 - 类和实例。 类定义了一类事物公共的行为和方法;而实例则是类的一个具体实现。 我们还知道,面向对象编程有三个重要的概念 - 封装、继承和多态。但是在JavaScript的初学者世界中,所有的这一切特性似乎都不存在(在深入了解JavaScript之前, 我也是这么认为的.....),认为JavaScript只是获取元素, 给元素设置样式,特效以及其他的一些操作,殊不知还有继承一说。

我们先来看看在JavaScript中继承的写法,

                                        
//创建一个say()方法
var myBase = {
    say: function () {
        alert("我是" + this.name);
    }
};

var Person = function (n) {
    this.name = n;
};
//将say()方法复制给person对象的原型,
Person.prototype = myBase;  //这句话表示 Person对象继承了myBase对象
                                

        我们发现JavaScript继承, 其实就是讲要继承的对象赋值给派生类对象的prototype(原型),这样就实现了继承,但是我们发现, 这样的写法很零碎, 没有任何章法可言, 不像C#中用“:”实现继承, 接下来,我们来封装一个函数出来,让继承看起来像那么回事,

        我们都知道Function是所有函数的基类,当Function的原型(prototype)存储一个方法, 那么所有的函数也就都具有了这个方法, 我们利用这点就可以实现继承的封装, 我们来看一下, 如何实现

                                        
// 每一个构造方法都可以实现继承
// 通过Function为所有的构造函数添加方法,方法给当前函数的原型添加对象
Function.prototype.inherit = function(objBase) {
	// 传进来就是父类对象
	// 将objBase交给func的原型
	this.prototype = objBase;
};

//下面是调用的代码
var Base = {name:"白码驿站"};
var Person = function() {
	this.say = function() {
		alert("名字是" + this.name);   //这里会报错, 因为Person没有name属性
	};
};
                                

上面的代码会报错, 因为Person对象没有name属性,接下来我们让Person继承 Base对象, 

                                        
Person.inherit(Base);
                                

我们再次调用

                                        
var Person = function() {
	this.say = function() {
		alert("名字是" + this.name);
	};
};
                                

输出 “名字是白码驿站”

Tags: JavaScript/Jquery

很赞哦! (4)

文章评论

系统处理中...