JS中的面向对象编程

一.面向对象编程
面向对象编程(OOP–Object Oriented Programming)是一种笼统体式格局建立模子的编程体式格局。继续,封装,多态是OOP的三大基本特征。许多主流编程言语都支撑OOP。比方Java,c++中经由过程new挪用‘类’来制造实例,然则进修了JS的同砚晓得JS中没有类的观点,那末JS怎样完成面向对象编程的呢?
JS完成OOP是经由过程原型链完成的,原型链的观点在这里不细致报告,人人记着一个例子即可:

function._proto_ ==== Function.prototype

JS也经由过程new来建立实例,然则背面挪用的不是类,而是组织函数。
下面我们经由过程封装继续一个‘类’的例子来细致论述。
二.ES5完成封装 继续一个类
1.封装
我们晓得宝马,奔驰,奥迪等都是汽车,汽车这个观点就是一个类,笼统出来代表了一样平常生涯中的许多详细事物。

//汽车 组织函数
function Car (name,color){
this.name = name;
this.color = color;
}

2.prototype形式
汽车的属性有许多,不仅仅是名字和色彩,假如悉数写在组织函数里,建立实例时再去一一地挪用太过于贫苦,因而JS划定了一个prototype形式,每一个组织函数都有一个prototype属性指向原型,“类”内里一些共有的属性能够放在原型内里。比方汽车类的车型,动能体式格局等属性都是共有属性能够放在原型里。

Car.prototype.type = 'car';

Car.prototype.getType = function () {
  return this.type;
};

Car.prototype.setType = function (newType) {
  this.type = newType;
  return newType;
};

Car.prototype.getName = function () {
  return this.name;
};

Car.prototype.setName = function (newName) {
  this.name = newName;
  return newName;
};

3.new关键字
JS中经由过程new关键字建立实例。

 var car1 = new Car('宝马','red');
console.log(car1.type) // 'car'

这里,我们思索一个题目:运用new建立实例,new究竟做了些什么呢?
运用new建立实例,实际上是协助我们减少了四行代码:
1.new建立了暂时对象,能够运用this接见到暂时对象
2.new也帮我们return了这个暂时对象
3.new指定了原型的名字–prototype
4.new建立实例,自动绑定原型。

car1._proto_ === Car.prototype

4.继续
我们完成一个‘子类’,继续‘汽车类’

function SUV ( price) {
 Car.call(this, 'suv');   // 将 Car 类的属性和要领赋值给 SUV
  this.price = price;
}
SUV.prototype = new Car('suv');// 继续汽车类的原型链


SUV.prototype.getPrice = function () {
  return this.price;
};
SUV.prototype.setPrice = function (newPrice) {
  this.price = newPrice;
  return newPrice;
};
//建立子类实例
var suv1 = new SUV(1000);
console.log(suv1.getPrice());//1000

以上是JS中的面向对象编程的简朴引见,若有毛病,迎接指出。
参考链接:
Javascript继续机制的设想头脑–阮一峰
JS中的new究竟是干什么的?—方应杭

    原文作者:tinawang
    原文地址: https://segmentfault.com/a/1190000013034189
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞