javascript - 查询对象属性适用于除 IE 10 之外的所有浏览器

Question

我正在尝试构建一个包含 Canvas 上下文对象的属性值的字符串。我使用的代码适用于我测试过的所有浏览器(IE 10 除外)。代码如下:

getCanvasInfo : function (canvas) {
    var props = [],
        prop,
        ctx = canvas.getContext('2d');
    for (prop in ctx) {
        if (ctx.hasOwnProperty(prop) &&
            prop !== "canvas" &&
            typeof ctx[prop] !== "function")
        {
            props.push(prop);
        }
    }
    return props.sort().map(function (p) {
        return p + ": " + ctx[p];
    }).join("\n");
}

在 IE 10(移动版和桌面版)中，if 测试似乎排除了所有属性，在循环退出时留下 props 为空数组。我已在调试器中验证，当进入 for..in 循环时，ctx 确实具有预期的(非功能)属性。这是怎么回事？

Answer 1

代码的问题在于，对于技术上位于 Canvas 对象本身而不是其原型(prototype)上的字段，ctx.hasOwnProperty(prop) 在 IE10 中返回 false ； (这对我来说似乎是一个错误。我不确定它是否仅适用于 Canvas ，或者是否也存在于其他元素。

我已更新您的代码，现在 IE10 和 Chrome 中会返回类似的结果。请参阅以下jsFiddle http://jsfiddle.net/T2yzm/1/

var getCanvasInfo = function (canvas) {
    var props = [],
        prop,
        ctx = canvas.getContext('2d');
    for (prop in ctx) {
        if ( prop !== "canvas" && typeof ctx[prop] !== "function") {
            props.push(prop);
        }
    }
    return props.sort().map(function (p) {
        return p + ": " + ctx[p];
    }).join("\n");
};

console.log( getCanvasInfo( $("canvas")[0] ) );