如何为构造函数扩展 THREE.Mesh class

Question

我正在研究 Three.js 并制作一个（简单！）太阳系模型。我正在尝试创建一个构造函数来构建行星和卫星，这是我到目前为止一直在尝试的，但我收到一条错误消息：

setShadow() is not a function:

var body = function(size, color) {
  this.sphere = new THREE.Mesh(new THREE.SphereGeometry(size, 32, 32), 
                               new THREE.MeshLambertMaterial({color:color}))
  return this.sphere
}

body.prototype = Object.create(THREE.Mesh.prototype);
body.prototype.constructor = body;

body.prototype.setShadow = function() {
  this.sphere.castShadow = true
  this.sphere.receiveShadow = true
}

或者，我尝试使用 THREE.MESH.call(this, geometry, material)，其中 THREE.SphereGeometry = geometry 和 THREE.MeshLambertMaterial = material 是在构造函数之外定义的。这是我需要特别担心 Three.js 还是我只是错误地处理这个问题？

编辑：替代尝试 ->

var body = function() {
      THREE.Mesh.call(this)
      return this
    }

    body.prototype.setShadow = function() {
      this.castShadow = true
      this.receiveShadow = true
      return this
    }
    body.prototype = Object.create(THREE.Mesh.prototype);
    body.prototype.constructor = body;

    var example = new body(new THREE.SphereGeometry(70, 32, 32), new THREE.MeshLambertMaterial({color:this.getRandColor()}))

似乎一切都正确继承，但我很困惑为什么 setShadow 函数不能正常工作？

编辑 2：在尝试 .call(this) 时实际上遇到了这个错误：

this.updateMorphTargets is not a function

Answer 1

您在扩展 THREE.Mesh class.

时在构造函数中犯了一个错误

这样试试：

var Body = function(size, color) {
    THREE.Mesh.call(
        this, 
        new THREE.SphereGeometry(size, 32, 32), 
        new THREE.MeshLambertMaterial({color:color})
    );
}

Body.prototype = Object.create(THREE.Mesh.prototype);
Body.prototype.constructor = Body;

构造函数中不需要 return 任何东西，因为创建的对象将自动 returned。

并且在您的 setShadow 方法中，您应该简单地指向 this，因为属性 castShadow and receiveShadow 是您新创建的 Body class 的直接属性（从 THREE.Object3D 继承到 THREE.Mesh).

Body.prototype.setShadow = function() {
    this.castShadow = true;
    this.receiveShadow = true;
}

使用大写字母作为构造函数的第一个字符也是一种很好的做法，因此在我的代码中，我将 body 更改为 Body。确保相应地重命名所有其他引用。

Here a demonstration in a fiddle

如何为构造函数扩展 THREE.Mesh class

How to extend THREE.Mesh class for constructor function

javascript

extend

three.js