匿名函数的返回值

Question

I want to build a shim. I have the following shim, which excecutes only once and should give the returned value to other functions. It is a bit like that http://www.paulirish.com/2011/requestanimationframe-for-smart-animating/ .

// WAY 1
matches: function(){
        return Element.prototype.matchesSelector 
        || Element.prototype.webkitMatchesSelector 
        || Element.prototype.mozMatchesSelector 
        || Element.prototype.msMatchesSelector 
        || Element.prototype.oMatchesSelector 
        || Element.prototype.matches 
        || Element.prototype.webkitMatches
        || Element.prototype.mozMatches
        || Element.prototype.msMatches
        || Element.prototype.oMatches;
    }(),

Now I want to use the return value by other functions:

// Uncaught TypeError: Illegal invocation (anonymous function)
if(matches('ul')){
...
}

However I cannot retrieve the return value of matches, because it sa anonymous function.

It will only work, if I do not excecute the function at once:

// WAY 2
matches: function(){
    return Element.prototype.matchesSelector 
    || Element.prototype.webkitMatchesSelector 
    || Element.prototype.mozMatchesSelector 
    || Element.prototype.msMatchesSelector 
    || Element.prototype.oMatchesSelector 
    || Element.prototype.matches 
    || Element.prototype.webkitMatches
    || Element.prototype.mozMatches
    || Element.prototype.msMatches
    || Element.prototype.oMatches;
},

// Now it works, but the method is executed every time.
if(matches('ul')){
...
}

How can I make "WAY 1" work?

Answer 1

You make it too complex. Just do this :

matches: Element.prototype.matchesSelector 
    || Element.prototype.webkitMatchesSelector 
    || Element.prototype.mozMatchesSelector 
    || Element.prototype.msMatchesSelector 
    || Element.prototype.oMatchesSelector 
    || Element.prototype.matches 
    || Element.prototype.webkitMatches
    || Element.prototype.mozMatches
    || Element.prototype.msMatches
    || Element.prototype.oMatches;

Answer 2

as you have mentioned, you have a global object named DOM , using it you can do it like:

matches: (DOM._getMatches = function(){
    return Element.prototype.matchesSelector 
    || Element.prototype.webkitMatchesSelector 
    || Element.prototype.mozMatchesSelector 
    || Element.prototype.msMatchesSelector 
    || Element.prototype.oMatchesSelector 
    || Element.prototype.matches 
    || Element.prototype.webkitMatches
    || Element.prototype.mozMatches
    || Element.prototype.msMatches
    || Element.prototype.oMatches;
})(),

then call _getMatches whenever you want:

DOM._getMatches()

If you have any other global object in your code, you can use it instead of DOM .

Answer 3

The anonymous function is a function that returns another function.

In the first case, you call it and store the returned function on matches . Then you call that returned function later.

The problem is that the purpose of that function is to compare the HTML Element stored in this with a selector you pass as an argument.

When you call matches('ul') the value of this is window (or undefined in strict mode). That isn't an HTML Element.

You need something more like:

matches.apply(document.getElementById('something_that_might_be_a_list', 'ul');