使用动态属性键获取javascript对象的属性值

Question

我目前正在研究一个有很多SVG动画的项目。当用户滚动到SVG时，需要触发这些动画。

我决定为每个Snap.SVG动画制作功能，并将它们存储在使用SVG的ID作为像这样的关键对象的数组：

//Example Object 

var item = { 
    aboutUsSVG: function(){ 
     //aboutUsSVG animation code to go here 
    } 
} 

我创建了一个Codepen的到目前为止我的代码在这里：

http://codepen.io/decodedcreative/pen/mEpZbx

我设法创造微小物体的阵列。我有第二个功能，当SVG在屏幕上播放动画。我无法使用动态键访问存储在数组中的动画功能。

如果我知道的SVG的像这样的名字我可以访问功能：

var playAnimation = animations.animationsArray[0].ourCompanies; 

playAnimation(); 

但我希望编写可用于网站上的所有动画的解决方案，从而希望查询的DOM对于SVG ID，然后查找相应的动画。

所以：

var animationID = $(this).find(".svg-animation svg").attr('id'); 
var playAnimation = svgAnimations.animationsArray[0].animationID; 
playAnimation(); 

但在上述animationID代码被逐字而不是使用由所述关于我们函数代替。

我认为这是一个相当常见的JS问题。谁能帮忙？

Answer 1

要使用需要使用括号符号的可变访问数组的一个属性：

var animationID = $(this).find(".svg-animation svg").prop('id'); 
svgAnimations.animationsArray[0][animationID](); 

Answer 2

可以使用括号记号具有动态可变

检查访问下面的代码对象属性

var animationID = $(this).find(".svg-animation svg").attr('id'); 
var playAnimation = svgAnimations.animationsArray[0][animationID]; 
playAnimation();