1

这与我之前发布的一个问题松散相关，尽管使用了不同的图像编辑库（CamanJS而不是 Pixastic）并且代码有所重构。

我正在尝试编写一个函数changify，将 HTML5 图像画布恢复为其原始状态，然后对其进行一些预设更改。此代码imageClipName从名为 的列表中加载正确的画布元素，其camanCache工作原理：

changify = (imageClipName) ->
    camanCache[imageClipName].revert ->
        camanCache[imageClipName]
            .brightness(10)
            .contrast(10)
            .noise(10)
            .render()
    console.log(camanCache[imageClipName])

但我想要的是从另一个名为的列表中找到保存的预设更改，imageValues并从该列表的键值对中动态创建图像函数更改字符串。这是我尝试做的，但失败了：

imageClipName = "image_1"
imageValues = {image_1:{brightness: 10, contrast: 10, noise: 10}, image_2:{...}...}

changify = (imageClipName) ->
    camanCache[imageClipName].revert ->
        camanCache[imageClipName]
            for o in imageValues when o.id == imageClipName
                for key, val of o
                    .#{key}(val)
            .render()

changify这给了我函数（ ）第三行的咖啡脚本语法错误Unexpected 'INDENT'，但我怀疑这.#{key}(val)不适用于将多个函数附加到camanCache[imageClipName]. 如何在coffeescript中动态字符串函数调用？

4

1 回答 1

2

我认为您正在尝试这样做：

changify = (imageClipName) ->
    camanCache[imageClipName].revert -> 
        clip = camanCache[imageClipName]
        for id, methods of imageValues when id == imageClipName
            for name, arg of methods
                clip = clip[name](arg)
            clip.render()

for ... of请注意，由于您正在迭代一个对象，所以在外循环中切换到的for ... in是 CoffeeScript 中的数组。

所以鉴于此：

{brightness: 10, contrast: 10, noise: 10}

在methods，这个循环：

clip = camanCache[imageClipName]
for name, arg of methods
    clip = clip[name](arg)
clip.render()

将具有与以下相同的效果：

camanCache[imageClipName].brightness(10).contrast(10).noise(10).render()

key, val迭代对象时对的顺序o未定义，因此无法保证brightness,contrast和noise调用的顺序。如果您按特定顺序需要它们，则必须使用数组methods：

imageValues = {image_1: [['brightness', 10], ['contrast', 10], ['noise', 10]], ... }

changify = (imageClipName) ->
    camanCache[imageClipName].revert -> 
        clip = camanCache[imageClipName]
        for id, methods of imageValues when id == imageClipName
            for method in methods
                clip = clip[method[0]](method[1])
            clip.render()

或者更好一点：

imageValues = {image_1: [ {name: 'brightness', arg: 10}, {name: 'contrast', arg: 10}, {name: 'noise', arg: 10}], ... }

changify = (imageClipName) ->
    camanCache[imageClipName].revert -> 
        clip = camanCache[imageClipName]
        for id, methods of imageValues when id == imageClipName
            for method in methods
                clip = clip[method.name](method.arg)
            clip.render()
于 2012-11-06T19:01:24.787 回答