Javascript 如何设置html5画布'；json格式的上下文属性？

我们都知道如下设置画布的上下文属性：

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

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

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

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

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

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

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

如何根据上述数据设置ctx的属性

我可以这样做：

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

你有什么好办法吗

---

谢谢。

有更好的办法。您可以使用以下内容：

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

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

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

---

你应该在使用时添加..是的，我忘了。谢谢，谢谢。但是为什么“如果（！data.hasOwnProperty（p））继续；”？我使用“if（！ctx.hasOwnProperty（p））continue；”。那就不行了。谢谢。我知道“for in语句允许循环遍历对象的所有属性的名称，包括通过原型链继承的属性的名称”。