JavaScript引用错误找不到变量加闭包蓝调

时间:2011-07-02 06:32:08

标签: javascript variables closures box2d

总的来说,我遇到了一些错误。 主要的是在safari中,android浏览器得到错误

  

JavaScript引用错误无法找到变量

有问题的变量是b2AABB

以下是代码var worldAABB = new b2AABB();
我正在使用 box2d JavaScript(像素实验室版本)进行谷歌关闭。此外,如果你可以给我的闭包依赖,并需要一次好,我会很感激。

<html>
<title>Tune Tunnels Alpha</title>
<head>
<!--=============================-->
<!-- Copy this part to your app. -->
<!-- START       -->
<!--=============================-->

<!-- libs -->
<!--[if IE]><script type="text/javascript" src="lib/excanvas.js"></script><![endif]-->
<script src="prototype.js"></script>
<!-- <script src="raphael.js"></script> -->
<script src="closure-library/closure/goog/base.js"></script>

<!-- box2djs -->
<script>
goog.addDependency('../common/b2Settings.js', ['box2d.Settings'], []);
goog.addDependency('../common/math/b2Vec2.js', ['box2d.Vec2'], []);
goog.addDependency('../common/math/b2Mat22.js', ['box2d.Mat22'], []);
goog.addDependency('../collision/b2Proxy.js', ['box2d.Proxy'], []);
goog.addDependency('../collision/ClipVertex.js', ['box2d.ClipVertex'], []);
goog.addDependency('../common/math/b2Math.js', ['box2d.Math'], []);
goog.addDependency('../collision/b2AABB.js', ['box2d.AABB'], []);
goog.addDependency('../collision/b2Bound.js', ['box2d.Bound'], []);
goog.addDependency('../collision/shapes/b2ShapeDef.js', ['box2d.ShapeDef'], []);
goog.addDependency('../collision/b2BoundValues.js', ['box2d.BoundValues'], []);
goog.addDependency('../collision/b2Pair.js', ['box2d.Pair'], []);
goog.addDependency('../collision/b2PairCallback.js', ['box2d.Callback'], []);
goog.addDependency('../collision/b2BufferedPair.js', ['box2d.BufferedPair'], []);
goog.addDependency('../collision/b2PairManager.js', ['box2d.PairManager'], []);
goog.addDependency('../collision/b2BroadPhase.js', ['box2d.BroadPhase'], []);
goog.addDependency('../collision/b2Collision.js', ['box2d.Collision'], []);
goog.addDependency('../collision/Features.js', ['box2d.Features'], []);
goog.addDependency('../collision/b2ContactID.js', ['box2d.ContactID'], []);
goog.addDependency('../collision/b2ContactPoint.js', ['box2d.ContactPoint'], []);
goog.addDependency('../collision/b2Distance.js', ['box2d.Distance'], []);
goog.addDependency('../collision/b2Manifold.js', ['box2d.Manifold'], []);
goog.addDependency('../collision/b2OBB.js', ['box2d.OBB'], []);
goog.addDependency('../collision/shapes/b2Shape.js', ['box2d.Shape'], []);
goog.addDependency('../collision/shapes/b2BoxDef.js', ['box2d.BoxDef'], []);
goog.addDependency('../collision/shapes/b2CircleDef.js', ['box2d.CircleDef'], []);
goog.addDependency('../collision/shapes/b2CircleShape.js', ['box2d.CircleShape'], []);
goog.addDependency('../collision/shapes/b2MassData.js', ['box2d.MassData'], []);
goog.addDependency('../collision/shapes/b2PolyDef.js', ['box2d.PolyDef'], []);
goog.addDependency('../collision/shapes/b2PolyShape.js', ['box2d.PolyShape'], []);
goog.addDependency('../dynamics/b2Body.js', ['box2d.Body'], []);
goog.addDependency('../dynamics/b2BodyDef.js', ['box2d.BodyDef'], []);
goog.addDependency('../dynamics/b2CollisionFilter.js', ['box2d.CollisionFilter'], []);
goog.addDependency('../dynamics/b2Island.js', ['box2d.Island'], []);
goog.addDependency('../dynamics/b2TimeStep.js', ['box2d.TimeStep'], []);
goog.addDependency('../dynamics/contacts/b2ContactNode.js', ['box2d.ContactNode'], []);
goog.addDependency('../dynamics/contacts/b2Contact.js', ['box2d.Contact'], []);
goog.addDependency('../dynamics/contacts/b2ContactConstraint.js', ['box2d.ContactConstraint'], []);
goog.addDependency('../dynamics/contacts/b2ContactConstraintPoint.js', ['box2d.ContactConstraintPoint'], []);
goog.addDependency('../dynamics/contacts/b2ContactRegister.js', ['box2d.ContactRegister'], []);
goog.addDependency('../dynamics/contacts/b2ContactSolver.js', ['box2d.ContactSolver'], []);
goog.addDependency('../dynamics/contacts/b2CircleContact.js', ['box2d.CircleContact'], []);
goog.addDependency('../dynamics/contacts/b2Conservative.js', ['box2d.Conservative'], []);
goog.addDependency('../dynamics/contacts/b2NullContact.js', ['box2d.NullContact'], []);
goog.addDependency('../dynamics/contacts/b2PolyAndCircleContact.js', ['box2d.PolyAndCircleContact'], []);
goog.addDependency('../dynamics/contacts/b2PolyContact.js', ['box2d.PolyContact'], []);
goog.addDependency('../dynamics/b2ContactManager.js', ['box2d.ContactManager'], []);
goog.addDependency('../dynamics/b2World.js', ['box2d.World'], []);
goog.addDependency('../dynamics/b2WorldListener.js', ['box2d.WorldListener'], []);
goog.addDependency('../dynamics/joints/b2JointNode.js', ['box2d.JointNode'], []);
goog.addDependency('../dynamics/joints/b2Joint.js', ['box2d.Joint'], []);
goog.addDependency('../dynamics/joints/b2JointDef.js', ['box2d.JointDef'], []);
goog.addDependency('../dynamics/joints/b2DistanceJoint.js', ['box2d.DistanceJoint'], []);
goog.addDependency('../dynamics/joints/b2DistanceJointDef.js', ['box2d.DistanceJointDef'], []);
goog.addDependency('../dynamics/joints/b2Jacobian.js', ['box2d.Jacobian'], []);
goog.addDependency('../dynamics/joints/b2GearJoint.js', ['box2d.GearJoint'], []);
goog.addDependency('../dynamics/joints/b2GearJointDef.js', ['box2d.GearJointDef'], []);
goog.addDependency('../dynamics/joints/b2MouseJoint.js', ['box2d.MouseJoint'], []);
goog.addDependency('../dynamics/joints/b2MouseJointDef.js', ['box2d.MouseJointDef'], []);
goog.addDependency('../dynamics/joints/b2PrismaticJoint.js', ['box2d.PrismaticJoint'], []);
goog.addDependency('../dynamics/joints/b2PrismaticJointDef.js', ['box2d.PrismaticJointDef'], []);
goog.addDependency('../dynamics/joints/b2PulleyJoint.js', ['box2d.PulleyJoint'], []);
goog.addDependency('../dynamics/joints/b2PulleyJointDef.js', ['box2d.PulleyJointDef'], []);
goog.addDependency('../dynamics/joints/b2RevoluteJoint.js', ['box2d.RevoluteJoint'], []);
goog.addDependency('../dynamics/joints/b2RevoluteJointDef.js', ['box2d.RevoluteJointDef'], []);
goog.require('goog.dom');
goog.require('box2d.Settings');
goog.require('box2d.Vec2');
goog.require('box2d.Mat22');
goog.require('box2d.Proxy');
goog.require('box2d.ClipVertex');
goog.require('box2d.Math');
goog.require('box2d.AABB');
goog.require('box2d.Bound');
goog.require('box2d.ShapeDef');
goog.require('box2d.RevoluteJoint');
goog.require('box2d.World')
goog.require('box2d.BoundValues');
goog.require('box2d.Pair');
goog.require('box2d.Callback');
goog.require('box2d.BufferedPair');
goog.require('box2d.PairManager');
goog.require('box2d.BroadPhase');
goog.require('box2d.Collision');
goog.require('box2d.Features');
goog.require('box2d.ContactID');
goog.require('box2d.ContactPoint');
goog.require('box2d.Distance');
goog.require('box2d.Manifold');
goog.require('box2d.OBB');
goog.require('box2d.Shape');
goog.require('box2d.BoxDef');
goog.require('box2d.CircleDef');
goog.require('box2d.CircleShape');
goog.require('box2d.MassData');
goog.require('box2d.PolyDef');
goog.require('box2d.PolyShape');
goog.require('box2d.Body');
goog.require('box2d.BodyDef');
goog.require('box2d.CollisionFilter')
goog.require('box2d.Island')
goog.require('box2d.TimeStep');
goog.require('box2d.ContactNode');
goog.require('box2d.Contact');
goog.require('box2d.ContactConstraint');
goog.require('box2d.ContactConstraintPoint');
goog.require('box2d.ContactRegister');
goog.require('box2d.ContactSolver');
goog.require('box2d.CircleContact');
goog.require('box2d.Conservative');
goog.require('box2d.NullContact');
goog.require('box2d.PolyAndCircleContact');
goog.require('box2d.PolyContact');
goog.require('box2d.ContactManager');
goog.require('box2d.WorldListener');
goog.require('box2d.JointNode');
goog.require('box2d.Joint');
goog.require('box2d.JointDef');
goog.require('box2d.DistanceJoint');
goog.require('box2d.DistanceJointDef');
goog.require('box2d.Jacobian');
goog.require('box2d.GearJoint');
goog.require('box2d.GearJointDef');
goog.require('box2d.MouseJoint');
goog.require('box2d.MouseJointDef');
goog.require('box2d.PrismaticJoint');
goog.require('box2d.PrismaticJointDef');
goog.require('box2d.PulleyJoint');
goog.require('box2d.PulleyJointDef');
goog.require('box2d.RevoluteJointDef');
</script>
        <!--=============================-->
        <!-- Copy this part to your app. -->
        <!-- END     -->
        <!--=============================-->
<link href="style/box2d.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script>
document.observe("dom:loaded", function() {
    var worldAABB = new b2AABB();
    worldAABB.minVertex.Set(-1000, -1000);
    worldAABB.maxVertex.Set(1000, 1000);
    var gravity = new b2Vec2(0, 300);
    var doSleep = true;
    var world = new b2World(worldAABB, gravity, doSleep); 
    var circleSd = new b2CircleDef();
    circleSd.density = 1.0;
    circleSd.radius = 20;
    circleSd.restitution = 1.0;
    circleSd.friction = 0;
    var circleBd = new b2BodyDef();
    circleBd.AddShape(circleSd);
    circleBd.position.Set(x,y);
    var circleBody = world.CreateBody(circleBd);

    var jointDef = new b2RevoluteJointDef();
    jointDef.anchorPoint.Set(250, 200);
    jointDef.body1 = world.GetGroundBody();
    jointDef.body2 = circleBody;
    world.CreateJoint(jointDef);
    var timeStep = 1.0/60;
    var iteration = 1;
    world.Step(timeStep, iteration);
    var ctx;
    var canvasWidth; 
    var canvasHeight; 
    function step(cnt) { 
        world.Step(1.0/60, 1);
        ctx.clearRect(0, 0, canvasWidth, canvasHeight);
        drawWorld(world, ctx); // see demos/draw_world.js
        setTimeout('step(' + (cnt || 0) + ')', 10);
    }
    Event.observe(window, 'load', function() {
        setupWorld(world); // as you like
        ctx = $('canvas').getContext('2d');
        var canvasElm = $('canvas');
        canvasWidth = parseInt(canvasElm.width);
        canvasHeight = parseInt(canvasElm.height);
        step();
    });
});
</script>
<canvas> </canvas>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

我不知道你的闭包/原型环境,但是因为看起来你的JS文件可能是异步加载的,所以在dom:loaded事件触发之前你的所有JS文件都没有被加载:

document.observe("dom:loaded", function() {
    var worldAABB = new b2AABB();

错误发生在此函数的第一行,这是非常可疑的。是否有一个事件在JS文件全部加载时触发?

所以,我认为你需要弄清楚这是否是脚本加载的时间问题,或者它是否是一个依赖性问题,并且永远不会加载所需的脚本。您可以通过临时替换整个document.observe("dom:loaded", function() {来执行此操作,该函数仅在长时间超时后测试是否存在b2AABB:

document.observe("dom:loaded", function() {
  setTimeout(function() {
    if (b2AABB) {
      alert("Found it");
    } else {
      alert("Still not there");
    }
  }, 60 * 1000);  // wait 60 seconds
}

如果它在60秒后仍然不存在,那么它可能永远不可用,并且您可能存在依赖性问题。如果它在60秒后出现,那么你可能有时间问题。