js 实现面向对象

  • 时间:2018-06-17 21:02 作者:学习编程 来源:学习编程 阅读:120
  • 扫一扫,手机访问
摘要:js是一个,嗯...能说半面向对象的语言吧,没有直接的支持,但能实现先来一个简单点的function Person(name){this.name = name;this.getName = function(){return this.name;};}这样就实现定义一个Person类,能直接new

js是一个,嗯...能说半面向对象的语言吧,没有直接的支持,但能实现

先来一个简单点的

function Person(name){

this.name = name;

this.getName = function(){

return this.name;

};

}

这样就实现定义一个Person类,能直接new:

var p = new Person('lls'); // 创立对象

p.getName(); // 调使用对象的方法

但是这样写,有一个问题,那就是每次创立对象,都会分配内存保存其中所有的属性,包括方法, 其中的变量的确需要每一个对象都创立一个新的,但是方法所有的都相同,这样做就有点白费内存了, 那么有什么好点的办法可以够处理一下呢?

下面引入一个新的概念, 原型: 在js中,每个类都有一个原型, 而原型只有一份,所有创立的对象共享一份原型

prototype: 每个类的这个属性为类的原型

Array.prototype.sum = function(){};

执行了以上的代码后, 所有的数组都会有 sum 方法


有了以上前提,即可以处理类方法的问题了,如下所示

function Person(name){

this.name = name;

}

Person.prototype.getName = function(){

return this.name;

};

这样,一个对象就定义成功了


但是, 面对对象得有继承吧,不可以只可以定义类而不可以实现继承,那么在js中又如何实现继承呢

思路如下:

  • 在构造函数中调使用父类的构造方法, 这样父类的属性就已经拿到了
  • 获取父类的原型, 拿到父类的方法
  • 定义自己的属性和方法

思路有了,下面使用代码实现

function Worker(name, job){

Person.call(this, name); // 调使用父类构造方法, 其中this是Worker对象

this.job = job; // 定义自己的属性

}

Worker.prototype = Person.prototype; // 获取父类的原型

Worker.prototype.getJob = function(){ // 定义自己的方法

return this.job;

};

但是这样,又有一个问题,那就是 Worker 的原型一变, 父类的原型也变了, 由于直接赋值拿到的是原型的引使用,即指针,那么就要讲原型整体复制过来才行, 用for循环实现:

for(var i in Person.prototype){

Worker.prototype[i] = Person.prototype[i];

}


同时能用 数组等实现对方法的分类管理, 如下:

var a={};

a.abc = {// 定义方法

aa: function(){},

bb: function(){}

};

a.bcd={

aa: function(){};

bb: function(){};

};

a.abc.aa(); // 调使用方法

a.bcd.aa();

如此,基本实现继承功可以,更多功可以还有待我学习

  • 全部评论(0)
最新发布的资讯信息
【网页前端|JS】五年Java程序员该掌握的技术点,这些都不懂,还想拿高薪吗?(2019-04-24 22:19)
【系统环境|】2019蚂蚁金服面试总结(Java方向)(2019-04-18 16:19)
【系统环境|】notepad++ 三位数字正则替换规则(2019-04-12 23:02)
【系统环境|服务器应用】网络工程师跨交换机的Vlan配置与管理知识(2019-03-26 02:14)
【系统环境|服务器应用】最小化的定制版linux系统:CoreOS(2019-03-26 02:14)
【系统环境|服务器应用】分布式系统面试题:分布式事务处理方案?(2019-03-26 02:13)
【系统环境|服务器应用】带着网关去旅行(系列二):防止vps上ssh端口被恶意扫描(2019-03-26 02:13)
【系统环境|服务器应用】美团iOS面试总结(2019-03-26 02:13)
【系统环境|服务器应用】百度iOS面试总结(2019-03-26 02:13)
【系统环境|服务器应用】Java大佬之学习历程(三)(2019-03-26 02:13)
手机二维码手机访问领取大礼包
返回顶部