这些Javascript函数声明的差异

时间:2012-04-21 22:54:11

标签: javascript

今天我看到了两种不同类型的Javascript函数声明,我想对这两种声明有更深入的了解:

function Car( model, year, miles ){
   this.model = model;
   this.year    = year;
   this.miles  = miles;
}

/*
 Note here that we are using Object.prototype.newMethod rather than 
 Object.prototype so as to avoid redefining the prototype object
*/
Car.prototype.toString = function(){
    return this.model + " has done " + this.miles + " miles";
};

var civic = new Car( "Honda Civic", 2009, 20000);
var mondeo = new Car( "Ford Mondeo", 2010, 5000);

console.log(civic.toString());

并输入2:

function Car( model, year, miles ){
   this.model = model;
   this.year    = year;
   this.miles  = miles;
   this.toString = function(){
       return this.model + " has done " + this.miles + " miles";
   };
}


var civic = new Car( "Honda Civic", 2009, 20000);
var mondeo = new Car( "Ford Mondeo", 2010, 5000);

console.log(civic.toString());

特别是'prototype'和'this.toString'。

任何人都可以传授一些JS智慧的珍珠吗?

2 个答案:

答案 0 :(得分:6)

这里的主要区别在于,在方法2中,您将使用您创建的每个新Car实例重新定义方法,这在技术上效率较低。

然而,方法2提供的一个好处是你可以创建真正的私有实例变量,如:

function Person( _age ){
    var age = _age;
    this.canDrink = function(){
        return age >= 21;
    }
}

var p = new Person(25);
p.canDrink() // true
p.age // undefined, because age is not exposed directly

方法1的另一个优点(除了性能)之外,您现在可以更改on对象的所有实例的功能。例如:

function Person( _age ){
    this.age = _age;
}
Person.prototype.canDrink = function(){
    return this.age >= 21;
}

var a = new Person(15),
    b = new Person(25);
a.canDrink() // false
b.canDrink() // true

Person.prototype.canDrink = function(){ return true }
a.canDrink() // true
b.canDrink() // true

这对于方法2是不可能的(不为每个实例更改它)。然而,年龄现已曝光:

a.age // 15
b.age // 25

答案 1 :(得分:0)

this.toString必须在构造函数中定义,并且只能在Car类中找到,而不是从它继承的任何内容(除非特别包含在子类中)。

Car.prototype.toString可以在构造函数之外定义,并且可以在从Car类继承的任何类的原型上找到。