傳遞給箭頭功能時執行的函數作爲一個參數 - ES6

Question

我正在使用3.js庫和我在實際渲染對象的舞臺/形狀的屏幕，這使得這樣的：

在tutorial我正在利用它有它旋轉立方體一些代碼的X和Y軸：

cube.rotation.x += 0.01; 
cube.rotation.y += 0.01; 

這工作，如果我把它添加到像這樣的渲染功能：

var render =() => { 
    requestAnimationFrame(render); 
    cube.rotation.x += 0.01; 
    cube.rotation.y += 0.01; 
    this.renderer.render(this.scene, this.camera); 
}; 

但我想靈活的動畫方法，並通過任何旋轉或任何作爲一個函數在渲染函數內執行。我試着這樣做：

var render = (animation) => { 
    requestAnimationFrame(render); 
    animation(); 
    this.renderer.render(this.scene, this.camera); 
}; 
render(this.animation(cube)); 

我可以看到這一點，該代碼被執行一次正確的功能，但以後每次它，那麼說的，這是不是一個函數。

我在這裏丟失了什麼以及如何確保這是每次都作爲函數執行的？

感謝

編輯

從工程師和sdgluck的答案，這是什麼，我認爲他們的意思，但它仍然沒有奏效：

var render = (animation) => { 
    requestAnimationFrame(render); 
    animation(); 
    this.renderer.render(this.scene, this.camera); 
}; 
render(() => this.animation(cube)); 

EDIT 2

這是創建多維數據集和試圖的服務中的所有代碼TS動畫吧：

export class ThreeService { 

    constructor() { 
     this.scene; 
     this.aspect; 
     this.camera; 
     this.renderer; 
    } 

    /* 
     Creates the scene, the camera and the renderer 
    */ 
    setup() { 
     this.createScene(); 
     this.createCamera(); 
     this.createRenderer(); 
    } 

    createScene() { 
     this.scene = new THREE.Scene(); 
    } 

    createCamera() { 
     // This is the viewpoint that the users are looking from 
     this.camera = new THREE.PerspectiveCamera(75,window.innerWidth/window.innerHeight, 1,10000); 
    } 

    createRenderer() { 
     this.renderer = new THREE.WebGLRenderer(); 
     this.renderer.setSize(window.innerWidth, window.innerHeight); 
     document.getElementById('model').appendChild(this.renderer.domElement); 
    } 

    createCube() { 
     // Creates the basic structure of the cube 
     var geometry = new THREE.BoxGeometry(700, 700, 700, 10, 10, 10); 

     // Adds colour to the cube using materials 
     var material = new THREE.MeshBasicMaterial({color: 0xfffff, wireframe: true}); 

     // Cubes needs a geometry and a material to be rendered 
     var cube = new THREE.Mesh(geometry, material); 
     this.addObjToScene(cube); 
     this.positionCamera(1000); 

     var render = (animation) => { 
      debugger 
      requestAnimationFrame(render); 
      animation(); 
      this.renderer.render(this.scene, this.camera); 
     }; 
     render(() => {this.animation(cube)}); 
    } 

    animation(obj) { 
     obj.rotation.x += 0.01; 
     obj.rotation.y += 0.01; 
    } 

    addObjToScene(obj) { 
     // They then needed added to the scene 
     if(!this.scene) 
      this.setup(); 
     // By default the add function adds the obj to the coordinates 0,0,0 
     this.scene.add(obj); 
    } 

    positionCamera(zPos) { 
     if(!this.camera) 
      this.setup(); 
     this.camera.position.z = zPos; 
    } 

    rotateObj(obj,x,y) { 
     obj.rotation.x += x; 
     obj.rotation.y += y; 
    } 

} 

這是出現的錯誤代碼：

EXCEPTION: TypeError: animation is not a function 
browser_adapter.js:84EXCEPTION: TypeError: animation is not a functionBrowserDomAdapter.logError @ browser_adapter.js:84 
browser_adapter.js:84STACKTRACE:BrowserDomAdapter.logError @ browser_adapter.js:84 
browser_adapter.js:84TypeError: animation is not a function 
    at render (three.service.js:49) 
    at ZoneDelegate.invokeTask (zone.js:356) 
    at Object.onInvokeTask (ng_zone_impl.js:44) 
    at ZoneDelegate.invokeTask (zone.js:355) 
    at Zone.runTask (zone.js:256) 
    at ZoneTask.invoke (zone.js:423) 
BrowserDomAdapter.logError @ browser_adapter.js:84 
Subscriber.js:229 
Uncaught TypeError: animation is not a function 

Answer 1

我猜this.animation(cube)沒有返回您期望調用（由animation();）內的渲染功能。可能的解決方法可能是：

render(() => { 
    this.animation(cube); 
}); 

Answer 2

@Engineer提供了一個解決方案，但並沒有解釋，當你希望你的共享例如不工作的原因是你在的地方調用this.animation，沒有提到過包裝它的函數或函數（如@工程師的答案）。