Cyclone77

JavaScript函数constructor的作用,意义

前几天写了一片 如何用正确的姿势编写jQuery插件 有朋友拍砖,指正。再此谢谢!

讨论:指定函数的constructor作用到底是什么?

我们一般写jQuery插件的时候是这样的:

//构造函数
function Person(options) {
    this.name = "";
    this.age = -1;
    $.extend(this, options);
}
Person.prototype = {
    getName: function () {
        return this.name;
    },
    getAge: function () {
        return this.age;
    }
}
//调用
var person1 = new Person({ name: "zhangsan", age: 18 });
console.log(person1.getName()); //zhangsan
console.log(person1.constructor); //Object

从上面可以看出,我们在添加实例person1的时候在构造函数里面合并了this和options,虽然person1可以构造函数Person()的方法,

但是person1.constructor(也就是person1的构造函数返回的是Object),而我们明明是用Person()创建的,这里就需要指定一下constructor;

Person.prototype = {
    constructor: Person,
    getName: function () {
        return this.name;
    },
    getAge: function () {
        return this.age;
    }
}

在群里讨论,我指定、不指定到底有什么用,我创建的实例都可以用我构造函数的方法? 到底有什么用处呢?如下:

var person2;
(function () {
    function Person(opt) {
        this.name = opt.name || "";
        this.age = opt.age || "";
    }
    //请注意这里这么写和上面是有区别的 Person.prototype ={} 是改了整个原型,这是只是新增方法
    Person.prototype.getName = function () {
        console.log(this.name);
    }
    person2 = new Person({ name: "wangwu", age: 17});
})()
person2.getName(); //wangwu
person2.constructor //Person()

假如我想给闭包里面的构造函数扩张一个方法怎么弄呢?从代码上看可以知道person2的构造函数是Person(),那么就可以有以下方法:

person2.constructor.prototype.getAge = function () {
    console.log(this.age);
}
person2.getAge(); //17

可以不用看,不用寻找闭包里面的功能,直接在实例的构造函数的原型上加就行。

注意:person2.constructor.prototype.getAge = function () {} 不是修改整个构造函数的原型,而是新增属性。

 

这里说明一下在编写jQuery插件的时候还是要避免:覆盖了原型prototype没有重新指向其构造函数;

那样用户就可以在实例里面找到构造函数而添加方法了。

欢迎继续拍砖指正,这样的记忆是最牢固深刻的!

posted @ 2016-01-25 17:31  Cyclone77  阅读(2622)  评论(0编辑  收藏  举报