两个独立工作的javascript函数,但不能一起工作

Two javascript functions which work independently, but not together?

本文关键字:工作 函数 javascript 但不能 一起 两个 独立      更新时间:2023-09-26

Background

我正在尝试为可汗学院写一个练习。他们的代码都可以在这里找到:https://github.com/Khan/khan-exercises。 这是我第一次真正编程任何东西,我正在学习html和js,因为我基本上只是通过查看示例代码。

作为本练习的一部分,我需要绘制一个"随机函数",并找到它是零。 我写了一个零查找算法(反复将间隔切成两半以放大零。 我知道牛顿方法的某种变体可能更快,但我想确保收敛。 我的"随机函数"采用一组点值,并用多项式样条插入这些点。这些中的每一个都是独立工作的:我可以绘制我的"随机函数",我可以使用我的零查找算法来近似 2 的平方根(x^2 的零 - 区间 (1,2)上的 2)。 当我试图找到我的"随机函数"的零时,我遇到了麻烦:我的浏览器进入了无限循环或其他什么。我什至看不到开发人员工具中的错误。

所以我的问题基本上是:

  1. 我犯了什么错误,在这里消耗了这么多的计算能力?
  2. 这些功能如何独立工作,但不能协同工作?
  3. 如何修复我的代码?

由于我在整个 knhan 学院框架内工作,因此我的程序有太多内容无法发布所有相关代码(它使用 Raphael 来处理图像,具有预先编写的代码以使练习都具有相同的风格等)。 我可以给你我写的html代码和我写的函数的.js文件。

<!DOCTYPE html>
<html data-require="math graphie graphie-helpers steveMath8">
  <head>
      <title>Piecewise-defined function</title>
      <script src="../khan-exercise.js"></script>
  </head>
  <body>
      <div class="exercise">
          <div class="vars">

  <var id = "n">randRange(2,4)</var>
  <var id = "abscissas">makeXList()</var>
  <var id = "ordinates">makeYList(-8,8,abscissas.length)</var>
  <var id = "points">makeCoordinates(abscissas,ordinates)</var>
 <var id = "f">(function(x){return niceFunction(x,points)})</var>
 <!-- <var id = "f">(function(x){return x*x-n})</var>-->
 <var id = zeros>locateZeros(f,abscissas)</var>


          </div>
          <div class="problems">
              <div id="problem-type-or-description">
                  <p class="problem">You are going to have to answer 5</p>
                  <p class="question">Answer 5</p>
                  <div class="graphie" id="grid">
                graphInit({
                    range: 10,
                    scale: 20,
                    tickStep: 1,
                    axisArrows: "<->"
                });
            a =style({
                        stroke: "red",
                         strokeWidth: 2
                    }, function() {
                        plot( function( x ) { return niceFunction(x,points);
                        }, [ -10, 10 ] );
                    });;
            a.plot();
            </div>
                  <p class="solution">5</p>
              </div>

          </div>
          <div class="hints">
              <!-- Any hints to show to the student. -->
          </div>
      </div>
  </body>

$.extend(KhanUtil, {
//takes num and returns +1 if num>0 or -1 if num<0
steveSign: function(num){
    return num && num/Math.abs(num)
},
// Approximates a root of f on the interval (xmin,xmax) by successively halving the   interval.
steveRoot: function(f,xmin,xmax){
    var l = xmin
    var r = xmax
    var z = 0
    for (i=0;i<10;i++){
        z = (l + r)/2
        if (KhanUtil.steveSign(f(l)) == KhanUtil.steveSign(f(z))){ l = z}
        else{r = z}   
    }
    return z
},
//takes a function and a list of abscissas, and returns an array of zeros - one zero between each pair of abscissas that are of
//opposite sign
locateZeros: function(f,abscissas){
    var len = abscissas.length
    var list = []
    var z = 0
    for(i=0;i<len-1;i++){
       var x0 = abscissas[i]
       var x1 = abscissas[i+1]
       var y0 = f(x0)
       var y1 = f(y0)
       if (KhanUtil.steveSign(y0) !== KhanUtil.steveSign(y1)){
           z = KhanUtil.steveRoot(f,x0,x1)
           list.push(KhanUtil.steveSign(f(x0)))
       }
    }
    return list
},
    steveCubic: function(x){return -Math.pow(x,3)/2+3*x/2},
//niceFunction is a C^1 function which connects the points in "points".  It is designed to be used 
//in my "curveSketchingIntuition" exercise.  Every point in the "points" will have 0 slope, except the first and last point.
niceFunction: function(x,points){
    len = points.length
    var x1 = points[0][0]
    var x2 = points[1][0]
    var y1 = points[0][1]
    var y2 = points[1][1]
    var k = (y1 - y2)/Math.pow(x1-x2,2)
    if (x<x2){return k*Math.pow(x-x2,2)+y2}
    for (i=1;i<len-2;i++){
        var x1 = points[i][0]
        var x2 = points[i+1][0]
        var y1 = points[i][1]
        var y2 = points[i+1][1]
        xNew = (x-x1)*2/(x2-x1)-1
        yNew = (KhanUtil.steveCubic(xNew)+1)*(y2-y1)/2+y1
        if (x>=x1 && x<x2){return yNew}
        }

    var x1 = points[len-2][0]
    var x2 = points[len-1][0]
    var y1 = points[len-2][1]
    var y2 = points[len-1][1]
    var k = (y2 - y1)/Math.pow(x1-x2,2)
    if (x>=x1){return k*Math.pow(x-x1,2)+y1}
},
makeXList: function(){
array = [-10]
i=0
while(array[i]<10){
    x = array[i]+3*KhanUtil.randRange(1,3)
    if (x<10){array.push(x)}
    i=i+1
    }
array.push(10)
return array
},
makeYList:function(min,max,n){
    excluded = [0]
    array = [KhanUtil.randRangeExclude(min,max,excluded)]
    excluded.push(array[0])
    array.push[KhanUtil.randRangeExclude(min,max,excluded)]
    excluded = [0]
    for (i=1;i<n;i++){
        if (array[i-2]<array[i-1]){
            array.push(KhanUtil.randRangeExclude(min,array[i-1]-1,excluded))
            }
        else{array.push(KhanUtil.randRangeExclude(array[i-1]+1,max,excluded))}
        }
    return array
},
    makeCoordinates:  function(array1,array2){
    array = []
    for (i=0;i<array1.length;i++){
        array.push([array1[i],array2[i]])
    }
    return array
},
});
我认为

这与你的while循环有关:

makeXList: function(){
array = [-10]
i=0
while(array[i]<10){
    x = array[i]+3*KhanUtil.randRange(1,3)
    if (x<10){array.push(x)}
    i=i+1
    }
array.push(10)
return array
},

请注意,您总是递增i,但并不总是将新值推到数组上。如果x大于 10,您将递增i,但那里不会有元素,这可能是导致无限循环的原因。

我修复了我的代码。 问题似乎是在这两个函数中,我都有一个看起来像这样的 for 循环

for(i=0;i=10;i++)

我把它改成了

for(var i=0;i=10;i++)

显然我的程序将 i 视为全局变量,因此我的两个交互函数都递增了相同的 i。 这有意义吗? 在编程语言中,这似乎是一个非常糟糕的功能。 我在这里错过了什么吗?