Javascript Java脚本显示模块模式创建多个对象

我需要关于以显示模块模式的方式编写更好的代码的建议。我遵循了这个教程，它帮助我理解了这个模式的基础知识。我正在尝试创建基本的图像滑块。请检查JSIDLE链接

这会导致错误类型错误：滑块不是函数

3） 这是保持全局和私有功能的正确方法吗

4） 建议（如有）

---

感谢您花时间阅读：）

如果您想创建多个实例，我建议您在模块中返回一个构造函数：

var Slider = (function($){

    function slider(id){  // <- 'foo' is an example of a constructor argument 
                          // (1 and 12 below when the instances are created)

        this.id = id; // <- something specific for each instance
        // this.$reelWrap = ...
    }

    slider.prototype = {

        init: function(){
            this.pageLoad();
        },

        pageLoad: function(){
             console.log('pageLoad called from instance with id', this.id);
        },

        getId: function(){
            return this.id; // <- 'this' refers to the current instance
        }
    };

    return slider;

})(jQuery);

var slider1 = new Slider(1);
var slider2 = new Slider(12);

console.log(slider1.getId());

2） 您没有暴露滑块

var Slider = (function($){

  return function() {
    var $reelWrap = $('.fnSlider'),
    .........
  }
}(jQuery))

3） 一般来说，你的范围很好。。你没有暴露出比你必须暴露的更多的东西

4） 你错过了问题4

---

5） 如果有机会，你通常应该低买高卖

@Johan谢谢你的回复和详细的代码片段：）更进一步，我做了这个ex-1-这是正确的还是可以做得更好？此外，我还尝试了ex-2，它帮助我扩展和覆盖方法。使用ex-1，我无法覆盖slider1.nextSlide方法suggestions@PravinVaichal简言之，你似乎已经掌握了窍门。如果您想扩展和覆盖方法，我建议您创建一个“基本”滑块，并让其他类型继承它。如果你想举个例子，请告诉我。@Johan首先感谢你为此投入的宝贵时间。举个例子就好了：）根据我的编码知识，这项功能可以通过展示模块模式、面向对象（使用原型创建实例及其灵活的，jQuery插件如果你有时间，你能解释一下吗？对于任何js功能，你如何决定哪种方法是有益的（如果有具体原因，请说明）：@Pravincahal没问题。我刚从酒吧回到家，所以在这里请容忍我。不确定这是否是最好的例子，但是嘿。。。如果你有任何问题，请告诉我。我没有完全理解您所要求的所有内容，但请不要将其与jQuery插件混淆。插件在某种程度上是有用的，但我更喜欢这样做。您可以始终将元素集传递给构造函数，而不必执行

$（'.whatever'）.plugin（）

。换言之，我会坚持你选择@Johan的模式——例如，非常感谢你的帮助，并为迟来的回复道歉。我浏览了这个例子，并试图实现——我也遇到了——揭示了原型模式（您的第一个答案），我对它进行了更多的探索——我想这对多个实例、扩展原型链、名称空间等最有帮助。您是否有twitter/电子邮件可以遵循？OOJS现在对我来说更清楚了@ilan berci感谢您的时间和评论问题编号已更正请您详细说明5）我没有完全理解

var Slider = (function($){

    function slider(id){  // <- 'foo' is an example of a constructor argument 
                          // (1 and 12 below when the instances are created)

        this.id = id; // <- something specific for each instance
        // this.$reelWrap = ...
    }

    slider.prototype = {

        init: function(){
            this.pageLoad();
        },

        pageLoad: function(){
             console.log('pageLoad called from instance with id', this.id);
        },

        getId: function(){
            return this.id; // <- 'this' refers to the current instance
        }
    };

    return slider;

})(jQuery);

var slider1 = new Slider(1);
var slider2 = new Slider(12);

console.log(slider1.getId());

var Vehicle = function(engine, speed){
    this.engine = engine;
    this.speed = speed || "786km/Hr";    
} 

Vehicle.prototype.engineInfo = function(){
    console.log("this vehicle has engine " + this.engine);
}

var Porsche = function(engine, speed, carName){                                       

    Vehicle.apply(this, arguments);   

// I stucked here and got answer 
// http://stackoverflow.com/questions/8605788/
// javascript-call-and-apply-functions-only-called-on-first-argument
// it means Vehicle functions arguments got copied here am I right :)

// J: The point is to call the 'base class' contructor with the arguments
// that you provide when you create a new Porsche as well.
// In other words, engine and speed will be set correctly in the 
// Vehicle constructor when you create a new Porsche()

    this.carName = carName;
}

Porsche.prototype = Object.create(Vehicle.prototype);
// Porsche.prototype = new Vehicle();
// http://stackoverflow.com/questions/4166616/
// understanding-the-difference-between-object-
// create-and-new-somefunction-in-j
// hmm need    more time to go into this :) 

// J: The difference is that if you just do Porsche.prototype = new Vehicle();
// The Vehicle constructor will be called even if you don't create an instance
// of Porsche

Porsche.prototype.constructor = Porsche;
// I stucked here and got http://stackoverflow.com/questions/9343193/
// why-set-prototypes-constructor-to-its-constructor-function

// J: I would say that it's good practice to do it, but I've personally never
// found any uses of that property.

Porsche.prototype.speedInfo = function(){
    console.log("this vehicle has speed " + this.speed);
}

var cayMan1 = new Porsche("Engine UV", "500km/hr", "CayMan");
var cayMan2 = new Porsche("Engine Ultra", "100km/hr", "911"); 

cayMan2.engineInfo();        
cayMan2.speedInfo();

var Slider = (function($){

  return function() {
    var $reelWrap = $('.fnSlider'),
    .........
  }
}(jQuery))