javascript中的对象与继承

  看过java之后再来看javascript，发现其中有太多相似之处，实际看去明明相似却又个性鲜明。现在就来总结下javascript中的对象与继承关系。

一、javascript对象

       在javascript中没有类这一概念，只有对象，所有的对象都是从Object对象继承过来的。在javascript中对象的属性可以动态添加 ，也可以动态删除，它不想java中的类，定义好的属性就不会改变。

var obj = new Object();
// 两种方式定义obj属性name
// obj["name"] = "zhangsan";
obj.name = "zhangsan";
console.log(obj.name);
// 删除obj对象中的name属性
delete obj.name;
console.log(obj.name);

     javascript定义对象的几种方式：

    a. 直接创建对象（最常见的方式）    

var obj = {name:"zhangsan",sex:"male"};
console.log(obj.name+","obj.sex);

   b. 基于已有对象扩充其属性和方法

var obj = new Object();
obj.name = "zhangsan";
obj.sayName = function(name){
    this.name = name;
    console.log(this.name);
}
obj.sayName("lisi");

   c. 基于工厂模式创建对象  

function createObj(username,password){
    var obj = new Object();
    obj.username = username;
    obj.password = password;
    obj.get = function(){
        alert(this.username + "  "+this.password);
    }
    return obj;
}
// 每创建一个对象就会创建一个get函数，占内存
var obj1 = createObj("zhangsan","123");

// 多个对象调用一个函数，将函数单独写出来，将对象的引用指向它
function get(){
    alert(this.username + " "+ this.password);
}

function createObj(username,password){
    var obj = new Object();
    obj.username = username;
    obj.password = password;
    obj.get = get;
}

   d. 构造函数方式创建对象  

function Person(username,password){
    // 在执行第一行代码，js引擎就会为我们创建一个对象
    this.username = username;
    this.password = password;
    this.getInfo = fucntion(){
        console.log(this.username+ ", " +this.password);
    }
    // 此处隐藏一个return语句，用于将之前生成的对象返回
}
var p1 = new Person("zhangsan",123);
p1.getInfo();

   e. 原型方式创建对象

      单纯使用原型方式定义对象无法在构造函数中为属性赋值，只能在 对象生成后再去改变属性值。

function Person(){}

Person.prototype.username = "zhangsan";
Person.prototype.password = "123";
Person.prototype.getInfo = fucntion(){
    alert(this.username +", " this.password);
}

//如果使用原型方式对象，那么生成的所有对象会共享原型中的属性，
这样一个对象改变了该属性也会反应到其他对象当中。

   f. 使用构造函数+原型方式创建对象

     使用这种方式创建对象会保证多个对象之间共享拥有的方法，但其属性互不干扰

function Person(username,password){
    this.username = username;
    this.password = password;
}

Person.prototype.getInfo = function(){
    alert(this.name+", " +this.password);
}

var p1 = new Person("zhangsan",123);
var p2 = new Person("lisi",456);
p1.getInfo();
p2.getInfo();

   还有一种方法可以实现多个对象共享拥有的方法，就是采用动态原型创建对象，当共享的方法被创建一次后就不会创建第二次。

function Person(name,password){
    this.name = name;
    this.password = password;
    if(typeof Person.flag == "undefined"){
        Person.prototype.getInfo = function(){
            alert(this.name + "," this.password);
        }
        Person.flag = true;
    }
    
}

二、 javascript对象间的继承

    a. 采用对象冒充的方式进行继承

function Parent(username){
    this.username = username;
    this.sayHello = function(){
        console.log(this.username);
    }
}

function Child(username,password){
    // 下面三行为关键代码
    this.method = Parent;
    this.method(username);
    delete this.method;

    this.password = password;
    this.sayWorld = function(){
        console.log(this.password);
    }
}

var p = new Parent("zhangsan");
var c = new Child("lisi",123);
p.sayHello();
c.sayHello();
c.sayWorld();

   b. 采用call方法方式实现继承

   call 方法是 Function 对象中的方法，因此我们定义的每个函数都拥有该方法。可以通过函数名来调用 call 方法，call 方法的第一个参数会被传递给函数中的 this，从第 2 个参数开始，逐一赋值给函数中的参数。

function Parent(username){
    this.username = username;
    this.sayHello = function(){
        console.log(this.username);
    }
}
function Child(username,password){
    Parent.call(this,username);
    this.password = password;
    this.sayHello = function(){
        console.log(this.password);
    }
}
var p = new Parent("zhangsan");
var c = new Child("lisi",123);
p.sayHello();
c.sayHello();
c.sayWorld(); 

   c. 采用apply方法方式实现继承

   apply方法是 Function 对象中的方法，因此我们定义的每个函数都拥有该方法。可以通过函数名来调用 apply 法，apply 方法的第一个参数会被传递给函数中的 this，与call方法不同的是，apply方法是将参数作为一个数组传给函数。

function Parent(username){
    this.username = username;
    this.sayHello = function(){
        console.log(this.username);
    }
}
function Child(username,password){
    Parent.apply(this,new Array(username));
    this.password = password;
    this.sayHello = function(){
        console.log(this.password);
    }
}

   d. 使用原型链方式实现继承

     使用这种方式的缺点是无法传参。

function Parent(){}

Parent.prototype.hello = hello;
Parent.prototype.sayHello = function(){
    console.log(this.hello);
}

function Child(){}
Child.prototype = new Parent();
Child.prototype.world = world;
Child.prototype.sayWorld = function(){
    console.log(this.world);
}

var c = new Child();
c.sayHello();
c.sayWorld();

   e. 使用构造函数+原型链的混合方式实现继承(推荐使用)

function Parent(username){
    this.username = username;
}
Parent.prototype.sayHello = function(){
    console.log(this.username);
}

function Child(username,password){
    // 属性继承
    Parent.call(this,username);
    this.password = password;
}
// 方法继承
Child.prototype = new Parent();
Child.prototype.sayWorld = function(){
    console.log(this.password);
}

var c = new Child("zhangsan",123);
c.sayHello();
c.sayWorld();

  以上就是javascript中的对象的建立及实现继承的方式，了解它们对于理解和正确书写javascript代码是非常有必要的。