eine Funktion als Parameter durchführen, wenn auf einen Pfeil Funktion übergeben - ES6

Question

Ich Nutzung der 3.js Bibliothek und bin in der Phase der tatsächlich machen das Objekt zu machen/Form auf dem Bildschirm, die wie dies macht:

im tutorial, dass ich Gebrauch davon zu machen hat einen Code zum Drehen des Würfels auf seine x- und y-Achse:

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

Dies funktioniert, wenn ich es in die Funktion macht hinzuzufügen wie so :

Aber ich möchte in der Animation Ansatz flexibel sein und alle Rotationen oder was auch immer als Funktion innerhalb der Render-Funktion ausgeführt werden. Ich habe versucht, dies zu tun:

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

Was ich das sehen kann, dass der Code einmal korrekt als eine Funktion ausgeführt wird, aber jede nachfolgende Zeit es dann sagen, dass es nicht eine Funktion ist.

Was fehlt mir hier und wie kann ich sicherstellen, dass dies jedes Mal als eine Funktion ausgeführt wird?

Dank

EDIT

Von Ingenieure und Antwort des sdgluck das ist, was ich denke, sie bedeuten aber es funktioniert immer noch nicht:

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

EDIT 2

Dies ist der gesamte Code im Service, der den Cube erstellt und versucht, ihn zu erstellen ts es animieren:

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; 
    } 

} 

Und dies ist der Fehlercode, der erscheint, wird:

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

Ich denke, this.animation(cube) keine Funktion zurück, die Sie erwarten, dass innerhalb von machen nennen (durch animation();). Mögliche Abhilfe könnte sein:

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

Answer 2

@Engineer eine Lösung bietet, aber nicht erklärt, dass der Grund, Ihre freigegebenen Beispiel nicht, wie Sie funktioniert erwarten ist, dass Sie this.animation anstelle fordern, nicht vorbei Bezug auf die Funktion oder eine Funktion, die sie umschließt (wie in @ Engineers Antwort).