Javascript lineTo（）方法不使用'；不接受数组元素

我试图根据点数组中的坐标绘制线，但调用此方法时，它显示了线中的以下错误。当我编写例如console.log（points[1][1]）时，它会显示元素。有人能指出我错过了什么吗

“未捕获的TypeError:无法读取未定义的属性“0”

这是我的密码：

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var points = [[50, 50], [50, 100], [25, 120],
             [100, 50], [70, 90], [100, 90], [70, 120]];

function drawPoints(array) {
    ctx.beginPath();
    ctx.moveTo(array[0][0], array[0][1]);
    for (var i = 1; i <= array.length; i++) {
        ctx.lineTo(array[i][0], array[i][1]);
    }
    ctx.stroke();
}

drawPoints(points);

var canvas=document.getElementById（“canvas”）；
var ctx=canvas.getContext（“2d”）；
var points=[[50,50]，[50,100]，[25,120]，
[100, 50], [70, 90], [100, 90], [70, 120]];
函数绘图点（数组）{
ctx.beginPath（）；
移动到（数组[0][0]，数组[0][1]）；
对于（var i=1；i尝试以下方法：

 <canvas id="myCanvas" width="200" height="100" style="border:1px solid #ccc;"></canvas>


    <script>
        var canvas = document.getElementById("myCanvas");
        var ctx = canvas.getContext("2d");
        var points = [[50, 50], [50, 100], [25, 120],
            [100, 50], [70, 90], [100, 90], [70, 120]];

        drawPoints(points);

        function drawPoints(array) {

            ctx.beginPath();
            ctx.moveTo(array[0][0], array[0][1]);
            for (var i = 1; i < array.length; i++) {
                console.log("Value", array[i][0]);
                ctx.lineTo(array[i][0], array[i][1]);
            }
            ctx.stroke();
        }

    </script>


var canvas=document.getElementById（“myCanvas”）；
var ctx=canvas.getContext（“2d”）；
var points=[[50,50]，[50,100]，[25,120]，
[100, 50], [70, 90], [100, 90], [70, 120]];
支取点（点）；
函数绘图点（数组）{
ctx.beginPath（）；
移动到（数组[0][0]，数组[0][1]）；
对于（变量i=1；i
请检查以下代码，我已更新此代码：

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var points = [[50, 50], [50, 100], [25, 120],
             [100, 50], [70, 90], [100, 90], [70, 120]];

function drawPoints(array) {
    ctx.beginPath();
    ctx.moveTo(array[0][0], array[0][1]);
    for (var i = 1; i < array.length; i++) {   // issue was here.
        ctx.lineTo(array[i][0], array[i][1]);
    }
    ctx.stroke();
}

drawPoints(points);

var canvas=document.getElementById（“canvas”）；
var ctx=canvas.getContext（“2d”）；
var points=[[50,50]，[50,100]，[25,120]，
[100, 50], [70, 90], [100, 90], [70, 120]];
函数绘图点（数组）{
ctx.beginPath（）；
移动到（数组[0][0]，数组[0][1]）；
对于（vari=1；i
在JavaScript中，数组索引是从零开始的。也就是说，第一个元素的索引是
0
，而最后一个元素的索引是
array.length-1

问题是for循环一直迭代到
array.length
，并在最后一次迭代中抛出错误

要解决此问题，请将循环更改为：

for (var i = 1; i < array.length; i++) { /*...*/ }

索引开始于<代码> 0代码>结束>代码1 >代码>您的循环从“代码> 1”/代码>到“代码> >长度及其超出界限.->代码> i>数组.长度谢谢！它实际上解决了这个问题.您可以回答您自己的问题（或者在像这样简单的键入的情况下，考虑删除它）上面的问题已经解决了。我应该写tern
.length-1
，而不是只写
.length
。但是无论如何，谢谢。是的。这超出了范围。谢谢。谢谢。我会检查这个。切片方法out@EagleCanFly实际上，
.slice
方法不是ES6…只是
for..of
和
..
.slice只需要因为
for..of
迭代整个数组。。。
for (const elem of array.slice(1)) {
    ctx.lineTo(...elem);
}