首页 > 代码库 > javascript面向对象
javascript面向对象
我们知道，要创建一个对象我们可以用如下代码：
var user = new Object();
user.name = ‘编程浪子‘;
user.age = 22;
user.address = ‘四川成都‘;
用这样的方法创建对象比较简单直观，也是JavaScript种创建对象最基本的方法。但是这样就有一个问题，如果我们需要创建多个对象，那么我就得写很多重复的代码。比如我们想创建另一个对象user1，我们就得重新将上面的代码重新写一遍，这在实际开发过程中是不合适的，这样如果对象过多，代码量将大大增加。
为了解决这样的问题，我们可以使用一种叫做**工厂模式**的方法，这种方法 就是为了解决实例化对象产生大量重复代码的问题。
工厂模式
function create(name, age) {
var obj = new Object();
obj.name = name;
obj.age = age;
obj.show = function () {
return this.name +‘ ‘+ this.age;
};
return obj;
}
var obj1= create(‘bclz‘, 30); //第一个实例
var obj2= create(‘bcxb‘, 20); //第二个实例
alert(obj1.show()); alert(obj2.show());
构造函数(构造方法)
function User(name, age) {//构造函数模式
this.name = name;
this.age = age;
this.show = function () {
return this.name + ‘ ‘+this.age;
};
}
创建对象的时候用new运算符就可以了：
var user1 = new User(‘bclz‘, 30); //第一个实例
var user2 = new User(‘bcxb‘, 20); //第二个实例
**使用new运算符**
var user = new Object(); //使用new运算符创建一个对象
user.name = ‘编程浪子‘; //给对象添加属性
user.age = 22; user.address = ‘四川成都‘;
**简单方式(传统赋值方式)**
var user = {};
user.name = ‘编程浪子‘; //给对象添加属性
user.age = 22;
user.address = ‘四川成都‘; **属性的调用**
对于对象属性的调用有两种方式： 调用方法如下：
alert(user.name + " " +user.age);//返回 ‘编程浪子 四川成都‘
另一种方法： alert(user[‘name‘] + " " +user[‘age‘]);//返回 ‘编程浪子 四川成都‘
**添加方法**
var user = {
name:‘编程浪子‘, //给对象添加属性
age:22,
address:‘四川成都‘,
showInfo:function(){//添加一个方法
alert(this.name+" "+this.age+" "+this.address);
},
showHello:showHello//将对象外部的方法添加到对象
};
function showHello(){
alert("Hello!");
}
user.showInfo();//调用方法 user.showHello();
function Cat(name,color){
this.name = name;
this.color = color;
this.type = "猫科动物";
this.eat = function(){alert("吃老鼠");};
} 生成实例:
var cat1 = new Cat("大毛","黄色");
var cat2 = new Cat ("二毛","黑色");
alert(cat1.type); // 猫科动物 cat1.eat(); // 吃老鼠
表面上好像没什么问题，但是实际上这样做，有一个很大的弊端。 那就是对于每一个实例对象，type属性和eat()方法都是一模一样的内容， 每一次生成一个实例，都必须为重复的内容，多占用一些内存。 这样既不环保，也缺乏效率。
alert(cat1.eat == cat2.eat); //false
**javascript高级程序设计**
书中对与原型的描述和说明
function Person(){ } //创建Person构造函数
Person.prototype.name = "Nicholas";//创建共享属性name
Person.prototype.age = 29; //创建共享属性age
Person.prototype.job = "Software Engineer"; //创建共享属性job
Person.prototype.sayName = function(){
//创建共享函数sayName alert(this.name);
};
//分别创建了person1和person2,里面都有sayName函数，并且弹出的值都是一样
var person1 = new Person();
person1.sayName(); //"Nicholas"
var person2 = new Person();
person2.sayName(); //"Nicholas"
alert(person1.sayName == person2.sayName); //true ·
alert(Person.prototype.isPrototypeOf(person1)); //true
alert(Person.prototype.isPrototypeOf(person2)); //true
function User(){};
var person3 = new User();
alert(Person.prototype.isPrototypeOf(person3)); //false
alert(User.prototype.isPrototypeOf(person3)); //true
### 基本原型 ###
function Person(){ }
Person.prototype.name = "Nicholas";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){
alert(this.name);
};
### 更简单的方式 ###
function Person(){ }
Person.prototype = {
name : "Nicholas", age : 29, job: "Software Engineer",
sayName : function () {
alert(this.name);
}
};
function Person(){ }
Person.prototype = {
constructor: Person,
name : "Nicholas",
age : 29,
job : "Software Engineer",
friends : ["Shelby", "Court"],
sayName : function () {
alert(this.name);
}
};
var person1 = new Person();
var person2 = new Person();
person1.friends.push("Van");
alert(person1.friends); //"Shelby,Court,Van" alert(person2.friends); //"Shelby,Court,Van"
alert(person1.friends === person2.friends); //true
上面的列子很容易看出，讲属性写在原型中的问题,列子中的friends是个数组，引用数据类型在person1中修改了friends,添加了一个条数据之后，可以看到person1和person2对象的friends都发生了改变，这其实很好理解，因为prototype对象本身就是共享的，数组又是属于引用类型，改变了一个，其他的都会发生改变。
### 构造函数与原型结合的方式 ###
function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
this.friends = ["Shelby", "Court"];
}
Person.prototype = {
constructor : Person,
sayName : function(){
alert(this.name);
}
}
var person1 = new Person("Nicholas", 29, "Software Engineer");
var person2 = new Person("Greg", 27, "Doctor");
person1.friends.push("Van");
alert(person1.friends); //"Shelby,Count,Van" alert(person2.friends); //"Shelby,Count"
alert(person1.friends === person2.friends); //false alert(person1.sayName === person2.sayName); //true
### 动态原型模式 ###
function Person(name, age, job){
//属性 this.name = name;
this.age = age;
this.job = job;
//方法 if (typeof this.sayName != "function"){
Person.prototype.sayName = function(){
alert(this.name);
};
}
}
var friend = new Person("Nicholas", 29, "Software Engineer"); friend.sayName();
javascript面向对象