In ThreeJS (and typescript) I am creating an instance of a custom object which extends Object3D, then attempting to clone it. However, the field (one required for new object creation) gets an undefined value during the process. Here's the code:
import {Object3D, Vector3} from "three";
export class CustomObject extends Object3D{
// a single property
prop: Vector3;
// assigns property value during creation
constructor(prop: Vector3) {
super();
this.prop = prop;
console.log("Prop: ", this.prop);
}
}
// creates an object
let co = new CustomObject(new Vector3(0, 1, 2));
// clones the object
let coc = co.clone();
console.log("Clone prop: ", coc.prop);
In the console, I see the following:
Prop: Vector3 {x: 0, y: 1, z: 2} <---- called during initial object creation.
Prop: undefined <---- called during clone operation.
Clone Prop: undefined <---- called at the end.
Why is prop undefined after the first instance?
Well, I feel a bit silly at this point but will post this as an answer for posterity:
Custom objects need custom clone methods:
clone(){
let clon = super.clone();
clon.prop = this.prop;
return clon
}