javascript - 理解 transit.js 中的代码

Question

我刚刚浏览了 transit.js 的源代码并遇到了以下功能::

  $.cssHooks['transit:transform'] = {
    // The getter returns a `Transform` object.
    get: function(elem) {
      return $(elem).data('transform') || new Transform();
    },

    // The setter accepts a `Transform` object or a string.
    set: function(elem, v) {
      var value = v;

      if (!(value instanceof Transform)) {
        value = new Transform(value);
      }

      // We've seen the 3D version of Scale() not work in Chrome when the
      // element being scaled extends outside of the viewport.  Thus, we're
      // forcing Chrome to not use the 3d transforms as well.  Not sure if
      // translate is affectede, but not risking it.  Detection code from
      // http://davidwalsh.name/detecting-google-chrome-javascript
      if (support.transform === 'WebkitTransform' && !isChrome) {
        elem.style[support.transform] = value.toString(true);
      } else {
        elem.style[support.transform] = value.toString();
      }

      $(elem).data('transform', value);
    }
  };

函数的后半部分我看懂了，但是函数的开头部分真的很难理解，这个函数在git上也能找到， HERE .

最初我看到这个，$.cssHooks['transit:transform'] 那一行到底在说什么？

之后我们有下面的代码行 I.E. getter 和 setter 方法，

set: function(elem, v) {

但是谁在函数内部传递了 elem 和 v，我没有看到任何东西被传递？

Answer 1

在 jQuery cssHooks 阅读有关 cssHooks 的信息

查看source code (搜索 hooks.get 和 hooks.set)

.cssHooks 是对象的数组，包含getter 和setter tha 将由 .css() 执行。就这些。

    $.cssHooks['transit:transform'] = {set: function(elem,value){}, get: function(elem){}}
     equal:
    $.cssHooks['transit:transform'] = {};
    $.cssHooks['transit:transform'].set = function(elem, value){};
    $.cssHooks['transit:transform'].get = function(elem){};

    $(element).css('transit:transform',value)
     comes to:
    $.cssHooks['transit:transform'].set(element,value)

    $(element).css('transit:transform')
     comes to:
    $.cssHooks['transit:transform'].get(element)

$.cssHooks['transit:transform'] = {set:function(){}, get: function(){}

{...} 是一个对象的创建。
get 和 set 此时没有执行。
他们创建了 {set:function(){}, get: function(){}

---

所以。简单地说:.css() 将执行 hook 属性的 set 和 get 函数。

---

如果您想了解 真正的 getter 和setter 是如何工作的: Object.defineProperty()