js无new构建对象

/**
 * @Author   QG
 * @DateTime 2018-05-22
 * @desc     省市联动选择插件 
 * @version  [version]
 * @param    {[Object]}   forms    [select form对象]
 * @param    {[Object]}   JQuery   [jq]
 * @param    {[Object]}   areaData [市区数据]
 */
;(function(window,undefined){

    var AreaPicker = function(forms,JQuery,areaData) {
        this.form = forms,
        this.$    = JQuery,
        this.areaData = areaData;
        return AreaPicker.prototype.init(); //这里不加new   AreaPicker() === new AreaPicker()  永远返回的就是一个实例，b实例可以改变a实例中的值
       // return new AreaPicker.prototype.init();  这里加new   每次创建一个new   允许多次调用分隔作用域
    };

    AreaPicker.prototype  = {
      init: function() {
        this.onchange();
        return this;
      },
      onchange:function() {

        form.on('select(j_selchanges)', function(data){
            var preID = data.value;
            var areaOption = '';
            for(var key in areaData){
                var keys = key.substr(0,2);
                var param = {};
                if(keys == preID){
                    areaOption += '<option value="'+key+'">'+areaData[key]+'</option>'
                }
            }
            $('#j_area').html(areaOption);
            form.render()
        });
      },

      areaChange: function() {

      }
    };
    //内部指针  重新指向
    AreaPicker.prototype.init.prototype = AreaPicker.prototype;

    if(!window.AreaPicker){
        window.AreaPicker =  AreaPicker;
    }

})(window,undefined)

var ss = AreaPicker(form,$,city);

new AreaPicker.prototype.init()主要做了三件事：
创建一个空对象var obj = {};
obj对象属性_proto_指向函数AreaPicker.prototype.init的prototype;
将AreaPicker.prototype.init函数的this替换成obj对象，调用AreaPicker.prototype.init函数，AreaPicker.prototype.init.call(obj),并返回新对象
因为AreaPicker.prototype.init返回的对象的原型是AreaPicker.prototype.init.prototype，它和AreaPicker.prototype并没什么关系，为了使新返回的对象可以继承自AreaPicker.prototype，所以让AreaPicker.prototype.init.prototype指向AreaPicker.prototype，创建实例并划分作用域。

猜你喜欢