为什么在内部函数中出现ReferenceError？

Question

首先，我认为下面的大部分代码与问题无关，我只是认为它会更多，呃..准确地放置整个代码的一部分。
所以只要看看我首先标记的线：

window.onload = function() {

var WebGLSupported = isWebGLSupported();
var renderer = WebGLSupported ? new THREE.WebGLRenderer() : new THREE.CanvasRenderer();
renderer.setSize( window.innerWidth, 600 );
document.body.appendChild( renderer.domElement );
var scene = new THREE.Scene();
var camera = new THREE.Camera(35,window.innerWidth/600,.1,10000);
camera.position.set( -5, 5, 25 );
var light = new THREE.PointLight( 0xffffff, .4 );
light.position.set( 10, 10, 10 );
scene.addLight( light );
var ambientLight = new THREE.AmbientLight( 0xbbbbbb );
scene.addLight( ambientLight );
var materialClass = WebGLSupported ? THREE.MeshLambertMaterial : THREE.MeshBasicMaterial;
var materialWall = new materialClass( { color: 0xffffff, map: THREE.ImageUtils.loadTexture( 'posts/wholewall.png' ) } );
var i;
var planeWalls=new Array();
for (i=1;i<=10;i++){
    planeWalls[i]=new THREE.Mesh(new THREE.PlaneGeometry(18,11,1,1), materialWall);
    planeWalls[i].position.z=i*(-5);
    scene.addChild(planeWalls[i]);
}
camera.lookAt(planeWalls[1].position);


animate();
function animate() {
    renderer.render( scene, camera ); <<-------BREAK AT HERE
    requestAnimFrame( animate );
}   

}

当我在那条线处中断时， 并添加 i 的监视，然后调试器显示：

异常：ReferenceError：i 未定义

然后我添加了上面数组的监视，planeWalls，并且还得到了ReferenceError，

但是我还添加了“场景”的监视，并且调试器显示了它的值正确，

所以我想知道为什么，

我的意思是，内部函数显然可以使用 i 的变量，对吧？

然后，我

alert(i);

在内部函数的开头添加，

然后调试器正确显示 i 。

那么，这方面有什么提示吗？

Answer 1

很可能是调试器问题，如果alert() 显示它，则意味着它是可访问的。