如何通过json格式设置html5 canvas的context属性？

Question

我们都知道像这样设置canvas的context属性：

ctx.textBaseline = "top";
ctx.shadowColor = "#000";
ctx.shadowOffsetX = 10;
ctx.shadowOffsetY = 0;
ctx.shadowBlur = 10;

但如果我有这样的json格式数据：

{textBaseline: "top",
shadowColor: "#000",
shadowOffsetX: 10,
shadowOffsetY: 0,
shadowBlur: 10}

如何通过上述数据设置ctx的属性？

我可以这样做：

function setctxproperty(jsondata) {
    if (jsondata[textBaseline]) {
        ctx.textBaseline = jsondata[textBaseline]; 
    } else if (jsondata[shadowColor]) {
        ctx.shadowColor = jsondata[shadowColor]; 
    } else if (...) {
        ...
    }
}

你有什么好办法吗？

感谢。

Answer 1

有一种更好的方法。你可以使用这样的东西：

function setProps(data) {
   for (var p in data) {
     if (!data.hasOwnProperty(p)) continue;
     ctx[p] = data[p];
   }
}