Javascript 从转换字符串中提取不同的css转换？

下面是一个CSS转换字符串示例：

rotate(-10 50 100)
translate(-36 45.5)
skewX(40)
scale(1 0.5)

从这个字符串我想

• 为每个转换获取一个字符串
• 获取具有我可以访问的属性的对象

我该怎么做

我的最佳想法是使用正则表达式，但我还没有找到一个有效的正则表达式解决方案：

[a-z]+?\([\-a-z0-9\s]*?\)

---

也欢迎您对不使用RegEx的解决方案有不同的想法。

基于Teemu的评论：

const text=`rotate（-10 50 100）
翻译（-36 45.5）
skewX（40）
比例（10.5）`；
常量行=text.split（'\n'）；
常量转换=行。减少（（acc，cur）=>{
常量key=cur.substring（0，cur.indexOf（'（'））；
常量值=cur.replace（键“”）.replace（'（'，''）.replace（'），''）；
acc[键]=值；
返回acc
}, {});
console.log（转换）；

使用正则表达式并将结果缩减为对象的快速示例：

function parseTransform(transform) {
    return Array.from(transform.matchAll(/(\w+)\((.+?)\)/gm))
        .reduce((agg, [, fn, val]) => ({
            ...agg,
            [fn]: val
        })
        , {});
}

const res = parseTransform(`rotate(-10 50 100)
translate(-36 45.5)
skewX(40)
scale(1 0.5)`);

这个的输出是

{rotate: "-10 50 100", translate: "-36 45.5", skewX: "40", scale: "1 0.5"}

---

在这个版本中，如果函数的值出现两次，我们将覆盖它。如果某些属性可以出现多次，您可以将它们合并在一起。

按

\n

拆分，然后使用RegExp获取函数名和参数值。@Teemu:还不够。只有使用换行符的示例字符串。我认为spec for css转换也允许使用不同的空格。此外，您的解决方案也会在每个参数之间中断。@user1283776如何获取css转换字符串（在您的示例中）？您能展示一个示例片段吗？@Richard:本页最上面的示例是CSS转换字符串的示例：。我只是使用querySelector（element）.getAttribute（“transform”）以字符串的形式获取转换字符串。我不知道还有什么比这更聪明的方法可以使用。在我的头脑中，我使用了

\w+\（.\）

根据您的示例，这似乎很好。谢谢！但它没有为这个合理的字符串给出正确的答案：“translate（200）skewX（40）”。如果您稍微修改一下它，也许可以？（\w+）（（.+？）”@user1283776是的，很好！谢谢。我已更新了我的答案以反映此更改。