JS——面向对象基础

概念

只关注对象提供的功能，不关注内部细节。

JS的面向对象

特点：

抽象：捉住核心（获取需要的内容）封装：只考虑使用功能，不考虑原理继承：继承父类方法、属性，子类又有自己的特性    1）多重继承（多个父类）    2）多态

对象的组成

方法/函数：

方法：属于一个对象

函数：自由的，不属于任何人

过程、动态的

属性 / 变量：

属性：属于一个对象

变量：自由的，不属于任何人

状态、静态的

对象添加方法和属性

This

当前的方法属于谁，this就是谁。

注意事项

不能在系统内置对象中随意添加方法、属性，否则会覆盖已有方法、属性。

Object对象

Object对象，没有功能。

所以我们可以往它身上添加方法、属性。

实例：

function createInf( name, age){    //创建（原料）    var myObj = new Object();    //添加属性（加工）    myObj.name = name;    myObj.age  = age ;    //添加方法（加工）    myObj.showName = function(){        alert("我的名字是：" + this.name);    };    myObj.showAge = function(){        alert("我的年龄是：" + this.age);    };    //记得返回对象出去，才能使用（出厂）    return myObj;}//创建实例var obj1 = createInf("Tim Chen","22");//调用方法obj1.showName();obj1.showAge();

上面的createInf函数，它的作用是构建一个对象，这种函数就被称作构造函数。

工厂方式

上面构造函数的方式，叫做工厂方式。

它包含原料、加工、出厂这三个流程。

问题

1. 没有new

使用工厂方式的构造函数创建实例时，不能用new关键字创建。

2. 函数重复

每创建一个实例，该实例就会有构造函数设置的相应数量的方法。

浪费系统资源。

解决方法

1. 使用new关键字创建实例

我们需要把所有属性、方法的前缀都换成this，

原料、出厂部分不用写。

function createInf( name, age){    //系统偷偷帮我们创建一个对象    //var this = new Object();    //添加属性（加工）    this.name = name;    this.age  = age ;    //添加方法（加工）    this.showName = function(){        alert("我的名字是：" + this.name);    };    this.showAge = function(){        alert("我的年龄是：" + this.age);    };    //系统帮我们返回    //return this;}//创建实例var obj1 = new createInf("Tim Chen","22");//调用方法obj1.showName();obj1.showAge();

2. 函数重复

构造函数里写属（不一样的东西），原型上添加方法（一样的东西）。

类名首字母大写。

实例：

function CreateInf( name, age){    //系统偷偷帮我们创建一个对象    //var this = new Object();    //添加属性（加工）    this.name = name;    this.age  = age ;    //系统帮我们返回    //return this;}//往createInf原型上添加方法CreateInf.prototype.showName = function(){    alert("我的名字是：" + this.name);};CreateInf.prototypeshowAge = function(){        alert("我的年龄是：" + this.age);};//创建实例var obj1 = new CreateInf("Tim Chen","22");//调用方法obj1.showName();obj1.showAge();

原型（prototype）

可以理解为CSS里的class。

实例：

var arr1 = new Array(11,12,13,14,15);var arr2 = new Array(21,22,23,24,25);Array.prototype.sum = function(){    // class//arr1.sum = function(){             //行间样式    var result = 0;    for(var i = 0; i < this.length; i++){        result += this[i];    }    return result;};alert(arr1.sum());alert(arr2.sum());

如果只给arr1添加方法，很显然arr2没有sum方法，会报错。

如果arr1、arr2都想要sum方法，那就需要在原型上添加方法。

这就好比行间样式跟class。

类、对象

类: 模版

对象: 成品


例如：

var arr = new Array(1,2,3);Array  类arr    对象

我们只能arr.push( )，而不能Array.push( )。因为类是没有功能的。

而对象，也不能像模板那样new arr( )生成别的东西。