【问题标题】:jQuery etc. InstantiationjQuery等实例化
【发布时间】:2011-02-23 02:35:06
【问题描述】:

OOP 通常需要像这样实例化(在使用之前创建类的实例):

var x = new String();

在 jQuery(和其他框架)中,我们可以在不实例化的情况下使用对象,例如(no 'new'):

$('#myid').click(function(){
//code
});

这是我的问题:框架作者是如何做到的?如何在没有“新”实例化的情况下使框架准备好使用?

提前致谢!!

【问题讨论】:

  • 我不知道你问的是'#myid' 字符串还是jQuery 对象。

标签: javascript jquery oop


【解决方案1】:

最简单、最复杂的答案(忽略了很多关于 JavaScript 与基于类的语言的不同之处)是 创建了一个新对象并从 jQuery 函数返回。 p>

您将在 jQuery 源代码中看到的第一件事:

var jQuery = function( selector, context ) {
    // The jQuery object is actually just the init constructor 'enhanced'
    return new jQuery.fn.init( selector, context, rootjQuery );
}

你可以在后面的源码中看到$只是jQuery的别名:

// Expose jQuery to the global object
return (window.jQuery = window.$ = jQuery);

【讨论】:

    【解决方案2】:

    javascript 是 prototype based language,没有继承 - 所有行为都是通过克隆对象和/或将新字段附加到现有对象来实现的。

    在你给出的例子中

    $('#myid').click(function(){
    //code
    });
    

    您实际上是在将一个匿名函数传递给 click 函数,该函数被定义为由 jQuery 库定义的对象的内部函数 - 它是通过全局参数化 $ 函数创建的(内部使用 new正如@lwburk 在他的回答中指出的那样)。函数是 javascript 中的一等公民——它们可以直接使用,也可以作为对象的一部分使用,这使得它们看起来就像是外部对象中的方法:

     [object returned by function]
     $            ('#myid')       .click(          function() {} );
     ^             ^               ^
     function      parameters      inner function  ^ parameter of type function
    

    【讨论】:

    • 你说的“通过克隆对象(原型)”是什么意思?如果您说为每个实例创建一个重复的原型对象,那是不正确的。
    • @patrick 看起来我也需要复习一下 javascript 原型,您之前的 SO answer 很有帮助
    【解决方案3】:

    您可以创建一个使用自调用函数包装的方法。

    (function() {
        var iAm = window.iAm || {};
    
        iAm = {
            Awesome: function()
            {
                alert('Yea you are!');
            },
    
            Lame: function()
            {
                alert('aww man.');
            }
        };
    
        window.iAm = iAm;
    
    })();
    
    iAm.Awesome(); // will alert "Yea you are!"
    iAm.Lame(); // will alert "aww man."
    

    【讨论】:

      【解决方案4】:

      JavaScript 是一种动态的、脚本化的、基于原型的语言。实例化和内存管理来自解释器。

      【讨论】:

      • 但是“新”呢?通常实例是用'new'创建的!
      • 在大多数情况下你不需要它。
      • @DrStrangeLove - 严格来说,Daniel 在 JavaScript 中不需要 new 的权利,但实际上 jQuery 确实使用 new 创建分配给 jQuery 的新对象和$ 对象。看我的回答。
      【解决方案5】:

      根据 Crockford 学派,要接受 JavaScript 的真正原型性质,您必须废除伪经典元素,例如 new 运算符或 .prototype 引用。

      虽然 lwburk 在 jQuery 中是正确的,但 $() 只是一个包装器,您实际上可以在没有 new 的情况下“实例化”一个对象。

      var myClass = function () {
        var privateVar,
      
        instance = {
          member: 'foo',
          method: function () {
            privateVar = 'bar';
          }
        };
      
        return instance;
      };
      
      var newInstance = myClass();
      

      【讨论】:

      • 你在这里写的东西在很多方面都是错误的。首先,要按您的预期工作,myClass 应该是一个函数而不是文字对象。即使您更正了这一点,您也会无意中创建一个全局变量实例。最后,重点不在于是否使用new:这只是调用函数的另一种方式(即new foo() 通常不等同于foo()。您应该废除 new 并继续使用构造函数。您可以做的是主要避免构造函数,仅将它们用于继承。此评论太短,无法在这一点上展开。
      • 对不起,我确实忘记了函数头。请指出一些在此方面进行扩展的资源。我很好奇。
      【解决方案6】:

      由于 JS 是原型、函数式和无类的,new 关键字与其他语言有点不同。

      两者的区别

      var D = new Dog();
      

      var D = Dog();
      

      是使用new 关键字将返回它正在调用的对象。

      考虑一下:

      function Dog() {
      
        // a property
        this.breed = "chocolate lab";
      
        // a method
        this.bark = function(){
          alert("woof");
        }
      }
      

      然后你可以调用方法并从对象中拉取属性。

      var D = new Dog();
      
          D.breed; // [string] 'chocolate lab'
          D.bark(); // alerts "woof"
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2016-01-07
        相关资源
        最近更新 更多