Question

晚上好，

我一直在试图解读下面这个由Chris Coyer编写的代码。

我理解这是一个名为'supports'的自调用函数，但我不明白的是'支持'如何传递一个参数（如下面的// Test部分所示）。请有人解释一下，或指出我正确的方向进一步阅读？

// Generic Testing Function
var supports = (function() {
   var div     = document.createElement('div'),
       vendors = 'Khtml Ms O Moz Webkit'.split(' '),
       len     = vendors.length;  

    return function(prop) {
      if ( prop in div.style ) return true;  

      prop = prop.replace(/^[a-z]/, function(val) {
         return val.toUpperCase();
      });  

      while(len--) {
         if ( vendors[len] + prop in div.style ) {
            return true;
         }
      }
      return false;
   };
})();  

// Test
if ( supports('flowInto') ) {
   $("html").addClass('cssregions');
} else {
   $("html").addClass('no-cssregions');
}

Answer 1

让我们看看supports是什么：

var supports = (function() {
    /* ... */
})();

好的，所以supports是当场调用的匿名函数的返回值。这个匿名函数返回什么？

    return function(prop) {
      if ( prop in div.style ) return true;  

      prop = prop.replace(/^[a-z]/, function(val) {
         return val.toUpperCase();
      });  

      while(len--) {
         if ( vendors[len] + prop in div.style ) {
            return true;
         }
      }
      return false;
   };

好吧，所以这个函数的返回值（正如我们上面所说的support所持有的）实际上是一个函数，它接受一个参数（prop）。

所以在这一点上应该清楚的是，完成测试部分所做的事情是完全合乎逻辑的，即调用该函数：

if ( supports('flowInto') ) /* .... */

当你知道从哪里开始时，这并不复杂。

Answer 2

自调用函数返回一个接受参数的函数。

因此，SIF被执行，返回

return function(prop) {
  if ( prop in div.style ) return true;  

  prop = prop.replace(/^[a-z]/, function(val) {
     return val.toUpperCase();
  });  

  while(len--) {
     if ( vendors[len] + prop in div.style ) {
        return true;
     }
  }
  return false;
};

这个家伙在这里。此函数引用存储在supports变量中。

Answer 3

supports是匿名自动调用函数（此函数）返回的函数：

function(prop) {
    if (prop in div.style) return true;
    prop = prop.replace(/^[a-z]/, function(val) {
        return val.toUpperCase();
    });
    while (len--) {
        if (vendors[len] + prop in div.style) {
            return true;
        }
    }
    return false;
};

因此，有争议的参数传递了prop参数。

Answer 4

这是一个自动调用函数，它返回一个函数。

supports被赋予自调用函数返回的函数。

Answer 5

变量'supports'正在接收一个新函数，可以在行

中看到

return function(prop) {

这个命名的自调用函数如何传递参数？

5 个答案: