Question

我对JavaScript很新...我基本上是在编写这个不同的形状绘图（在画布上）程序，当用户可以在单击所需的形状按钮后在画布上绘制形状...代码看起来像这样：

var rectangle = document.getElementById('rec');
rectangle.addEventListener('click', function (e) {
    x2 =  y2 = 0;
    globalOption = 'rec';
    var rec = new shape();
    e.preventDefault();
}, false)

之后在init函数中..在mousedown事件上：

else if(globalOption == 'rec')
    {           
        e.target.style.cursor = 'crosshair';
        rec.name = 'rec';
        started = 'true';
        x2 = y2 = 0;
        x = e.pageX - canvas.offsetLeft;
        y = e.pageY - canvas.offsetTop;
        rec.x = x;
        rec.y = y;
        //context.beginPath();
    }

我将关于此形状的所有信息存储在我之前在addEventListener代码“var rec = new shape（）;”中创建的形状对象中。我正在鼠标向上事件中的数组中推送此对象。现在的问题是，它只存储最后一个被推送对象的信息..即使数组长度正确..但它包含的所有对象都有一个相同的信息推送最后一个对象！为什么？？我尝试放置“var rec = new shape（）;”在不同的地方排队，但没有用！

Answer 1

您应该创建一个新对象并将数据从rec复制到它。然后将新对象推送到数组。否则它只会保留对'rec'变量的引用，这就是你总是得到最后一个元素的原因。

Answer 2

我是通过引用复制每个对象..它需要的是创建一个新对象，逐个复制每个值，然后推送那个新对象！

JavaScript：.push（）用推送的最后一个对象的值替换所有存储的值

2 个答案: