初识JavaScript的面向对象编程

面向对象编程"/>

初识JavaScript的面向对象编程

　　　　学过面向对象编程语言（如C++, Java等）的同学应该都知道这些语言涉及到的概念不外乎是，“类” 、“对象” 、“对象属性” 、“对象方法” 等，然而这些面向对象的概念，在JavaScript目前版本中，没有较为鲜明的对应关系。不过，我们还是可以使用面向对象的方式来进行JavaScript编程滴~

　　　　首先，来说说JavaScript（后面使用JS代称）中的对象吧。在JS中，声明对象的方式有两种：　　　　　

var person = {};        
var person = new Object();     //  或 var obj = new Object;

　　　　对象声明了，接下来给对象添加属性跟方法，同样有两种表达方式：

　　　　方式1：

var person = {};        // 或者 var obj = new Object();
person.name = "张三";
person.showName = function() {console.log(this.name);          
};

　　　　方式2：（字面量表达）

var person = {name : "张三",showName : function() {console.log(this.name);     }  
};

　　　　对象有了，对象属性、方法也齐了。感觉还不错！可是，如果需要批量定义对象时，按照上面方式进行的话，那得一遍遍的重复上述代码呀！！oh no ~~~ 

　　　　让我们想想，是不是应该有办法可以来处理呢？是的，“抽象”，我们可以利用函数的方式来提供创建对象的模板。

function Person(name) {this.name = name;this.showName = function() {console.log(this.name);};        
}

　　　　通过上述代码，就创建了含有name属性和showName方法的对象模板了。可以通过如下方式进行创建对象：

var person1 = new Person("张三");
person1.showName();　　　　// "张三"
var person2 = new Person("李四");
person2.showName();　　　　// "李四"

console.log(person1.showName === person2.showName);  //false   showName不共享

　　　　这样就解决了批量创建对象需重复编码的问题啦~

　　　　可是，新的问题又来了。每次创建一个对象，都会产生一个name属性，一个showName方法，其中name属性是根据不同对象而不同的，但是showName方法对于每一个对象都是一样的呀~要是有办法让showName方法共享的话，那不就可以节省内存咯~

　　　　接下来，prototype该登场了，在此可以放实例对象需要共享的属性或者方法。怎么使用？看看下面代码就知道啦~

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

// 所有创建的对象共享showName方法
Person.prototype.showName = function() {console.log(this.name);
}var person1 = new Person("张三");
person1.showName();
var person2 = new Person("李四");
person2.showName();
console.log(person1.showName === person2.showName);   // true , 说明showName共享

　　　　至此，就完成了一个简单的、利用面向对象思想进行编码的JS对象及产生对象的构造函数了。这只是一个简单的入门例子，JS面向对象编程的路还很长，一步一脚印的走......

（本文是作者按照自己的思路写的，如文中描述或理解有误，欢迎指正，谢谢~）

转载于:.html