OPP面向对象的介绍及使用

概述


 

 

面向过程与面向对象
面向过程:专注于如何去解决一个问题的过程,编程特点是用一个个函数去实现过程操作,没有类与对象的概念
面向对象:专注于有哪一个对象实体去解决这个问题,编程特点是:出现了一个个的类,由类去生成对象。
面向对象的三大特征:继承,封装,多态

对象和类的概念


 

类是抽象的,对象是具体的(类是对象的抽象化,对象是类的具体化)
通俗的来讲:类是一个抽象的概念,表示具有相同属性和行为的集合,但是类仅仅表明这类群体具有相同的属性,但是没有具体的属性值,而对象是对类的属性进行具体赋值后得到的具体的个体

虽然JavaScript是一门面向对象编程语言,但它没有提供class的语法支持。
在JavaScript中,一切都是基于对象的,即使后面要讲的“原型”也都是对象,JavaScript的继承和重用也都是通过原型来实现的。
但是结合构造函数和原型对象可以实现JavaScript的“类”。

构造函数


 

之前我们使用new Array()创建一个数组,使用new Object()创建一个对象,Array()和Object()是JavaScript内置的两个构造函数,尽管JavaScript没有提供类,但我们可以将Array和Object理解为“类”的概念。
需要注意的是,JavaScript的“类”是由构造函数实现的。

        //定义一个类(构造函数)
        function Person(name,age,sex){
            //类的属性
            this.name = name;
            this.age = age;
            this.sex = sex;
            
           
        }

使用构造函数

JavaScript使用类的方式和C#一样,new关键字后面跟着构造函数。

var zhangsan = new Person("张三",18,"");
        zhangsan.say();

 

定义属性和方法


 

现在我们已经定义好了Person类,可以为Person类添加一些属性和方法。

定义属性

在讲JavaScript对象时,我们讲了对象的属性设置和访问。
这段代码展示了定义对象属性的两种方式:

 

function Person(){
 //类的方法
            this.say = function(){
                alert("我叫"+this.name+",今年"+this.age+"岁,是一个"+this.sex+"生。")
            }
}

使用this定义属性

JavaScript类的属性定义方式则有些不同,在构造函数中使用this关键字定义属性:

function Person(name){
    this.name = name;
}
  • 第一行代码,定义了Person类,并定义了构造函数。
  • 第二行代码,定义了name属性。

创建并使用对象

wangwu.say();
console.log(zhangsan.age)

 

constructor属性

当创建一个对象时,一个特殊的属性被JavaScript自动地分配给对象了,这个属性就是constructor属性。
在chrome控制台输入p1.constructor,可以看到p1对象的constructor属性指向一个函数。

image

image

原型对象


 

在JavaScript中,定义一个函数时,函数就会拥有prototype属性,构造函数也不例外。
下图说明了Person()构造函数的prototype属性是一个对象,它是属于函数的,我们称这个属性为原型对象。
从Person类的角度出发,我们也可理解为prototype属性是属于Person类的。

 

 

设置prototype

既然prototype是一个对象,那就可以为它添加属性和方法。

在函数的protpotype属性上定义属性和方法,与设置普通对象的属性和方法没什么区别。
下面的代码为Person.prototype定义了属性和方法。

Person.prototype.name4 = "name4";//原型属性

自有属性 和 prototype的属性

首先,我们可以将Person类中的属性和方法理解为“实例属性”。
由于prototype是共享的,我们可以将prototype中的属性和方法理解为“共享属性”。

“实例属性”和“共享属性”的差别主要体现在性能上。
每创建一个Person的实例,就会产生一个name属性和sayHello()方法的副本,而height属性和run()方法则是所有实例共享一个副本。

既然如此,这意味着sayHello()方法可以提到prototype中。
另外,不同的Person实例height可能会不一样,应将它放到Person类中更合理。

function Person(name,height){
    this.name = name;
    this.height = height;
}

Person.prototype.say = function(){
    return '我是' + this.name + ',我的身高是' + this.height;
}
Person.prototype.run = function(){
    return '我是' + this.name + ',我在走路!';
}

var p1 = new Person('张三',183);
var p2 = new Person('李四',160);

类的实现总结


 

  1. JavaScript没有类,但构造函数可以实现“类”。
  2. 按照JavaScript编程规范,构造函数的首字母应该大写。
  3. “类”的属性和方法是用this.property方式定义在构造函数中的。
  4. 在对象创建时JavaScript分配了constructor属性给对象,constructor属性是对象构造函数的一个引用。
  5. 函数在定义时就已经有了prototype属性,prototype属性也是一个对象。
  6. prototype是共享的,定义在prototype上的属性和方法可以被“类”的实例使用。
  7. 如果属性或方法能够定义在prototype上,就不要定义在构造函数上,使用prototype可以减少内存开销。

 

posted @ 2017-05-14 13:07  Linoa  阅读(1659)  评论(0编辑  收藏  举报