使用 Tween.js 在 for 循环中存储实例引用

【问题标题】：Store instance reference in a for loop with Tween.js使用 Tween.js 在 for 循环中存储实例引用
【发布时间】：2026-02-07 05:45:02
【问题描述】：

我正在循环遍历 THREE.JS 中的 CSS3DObjects 数组，并希望在 Tween.js onComplete() 的上下文中将它们从 DOM 中删除。但是如何引用 dom 实例，以便每个 Tween 实例可以告诉 dom 元素删除自己？

for ( var i = 0; i < _tier1Objects.length; i ++ ) {
    new TWEEN.Tween( _tier1Objects[i].position )
        .to( {z: -50}, 1000 )
        .easing( TWEEN.Easing.Quadratic.Out)
        .onComplete( function() {
            scene.remove( [CSS3DObject instance] ); // REMOVE THE THREE JS OBJ INSTANCE
            $([dom element]).remove(); // REMOVE THE HTML DOM ELEMENT VIA JQUERY
            })
        .start();
}

也许这里有一个我不知道的最佳做法。请指教。

【问题讨论】：

标签： javascript jquery three.js tween.js

【解决方案1】：

我找到了这个例子，它让我可以访问对象实例：

function closeTier1Items() {
    for ( var i = 0; i < _tier1Objects.length; i ++ ) {
        new TWEEN.Tween( _tier1Objects[i].position )
            .to( {z: -50}, 1000 )
            .easing( TWEEN.Easing.Quadratic.Out)
            .onComplete(
                function(obj){
                    return function(){
                        scene.remove(obj);
                    }
                }( _tier1Objects[i] )
            )
            .start();
    }
}

但是哎哟，这有点令人费解！也许有更简单的方法来存储对象实例？？

【讨论】：