Question

我有一个像这样的对象：

var BrowserDetect = {
    uniqueProps: [],
    browserUID: '',
    browserFonts: '',
    isIPhonePad: function() {
        return navigator.userAgent.match(/iPhone|iPod/i);
    },
    isDesktop: function() {
        return !navigator.userAgent.match(/iPhone|iPad|android/i);
    },
    isAndroid: function() {
        return navigator.userAgent.match(/android/i);
    },
    isFirefox: function() {
        return navigator.userAgent.match(/firefox/i);
    },
    isIOS7: function() {
        return navigator.userAgent.match(/.*CPU.*OS 7_\d/i);
    },
    isChromeCrios: function() {
        return navigator.userAgent.match(/chrome|crios/i);
    },
    isIPad: function() {
        return navigator.userAgent.match(/iPad/i);
    }
}

（仅供参考：对象内部有更多功能）

所以我想通过“BrowserDetect”并检查其中的哪些函数返回“true”并获取函数的名称。

实现这一目标的简单方法是什么？我试图使用jquery $ .each，但没有成功。

Answer 1

使用Object.keys()和Array#filter迭代对象并返回所有真实的函数名称：

Object.keys(BrowserDetect).filter(function(key) {
  var f = BrowserDetect[key];

  return typeof f === 'function' && f();
});

var BrowserDetect = {
    uniqueProps: [],
    browserUID: '',
    browserFonts: '',
    isIPhonePad: function() {
        return navigator.userAgent.match(/iPhone|iPod/i);
    },
    isDesktop: function() {
        return !navigator.userAgent.match(/iPhone|iPad|android/i);
    },
    isAndroid: function() {
        return navigator.userAgent.match(/android/i);
    },
    isFirefox: function() {
        return navigator.userAgent.match(/firefox/i);
    },
    isIOS7: function() {
        return navigator.userAgent.match(/.*CPU.*OS 7_\d/i);
    },
    isChromeCrios: function() {
        return navigator.userAgent.match(/chrome|crios/i);
    },
    isIPad: function() {
        return navigator.userAgent.match(/iPad/i);
    }
};

var result = Object.keys(BrowserDetect).filter(function(key) {
  var f = BrowserDetect[key];
  
  return typeof f === 'function' && f();
});

console.log(result);

Answer 2

我在纯js中实现了一个非功能性的解决方案。一旦你认为一个属性也可以成为一个函数，它就相当简单。在属性上使用call()方法后，它将运行基础函数。

var BrowserDetect = {
    uniqueProps: [],
    browserUID: '',
    browserFonts: '',
    isIPhonePad: function() {
        return navigator.userAgent.match(/iPhone|iPod/i);
    },
    isDesktop: function() {
        return !navigator.userAgent.match(/iPhone|iPad|android/i);
    },
    isAndroid: function() {
        return navigator.userAgent.match(/android/i);
    },
    isFirefox: function() {
        return navigator.userAgent.match(/firefox/i);
    },
    isIOS7: function() {
        return navigator.userAgent.match(/.*CPU.*OS 7_\d/i);
    },
    isChromeCrios: function() {
        return navigator.userAgent.match(/chrome|crios/i);
    },
    isIPad: function() {
        return navigator.userAgent.match(/iPad/i);
    }
}

var functions = [];
for(var prop in BrowserDetect){
    if(typeof(BrowserDetect[prop])=="function" && BrowserDetect[prop].call()){
        functions.push(prop);
       }
  }
console.log(functions);

Answer 3

你可以使用common for ... in循环

for (var functionName in BrowserDetect) {
  if (!BrowserDetect.hasOwnProperty(functionName)
    || typeof BrowserDetect[functionName] !== "function") continue
  if (BrowserDetect[functionName]())
    return functionName
}

或Object.keys

Object.keys(BrowserDetect).reduce(
  (current, fnName) => typeof BrowserDetect[fnName] === "function" && BrowserDetect[fnName]() ? fnName : current )

循环访问Object以检查返回true的函数

3 个答案: