数组中的Javascript对象属性值

我做了一些搜索，但我总能找到如何访问数组之类的对象的值

我想要实现的是将值从数组传递到我的对象属性值

让我向您展示我的实际代码，以便更好地理解

//the array i want to use in my object
var grades = [3, 7, 6, 16, 8, 2, 12, 5, 19, 12, 8, 2, 15, 12, 17, 16, 4, 19, 9, 11, 18, 1, 15, 19, 8]

//My rectangle prototype. Some values are changed using the createRectangle() function.
var rectangle = {
        x: Parameters[2], // this is the center of the rectangle
        y: 0,
        dx: 0, // delta x and y are the movement per frame
        dy: 0,
        w: 70, // size
        h: 55,
        color: "yellow",
        text: null,
        textColor: "black",
        cutX: Parameters[2],  //X position of cut mark (same as rectangle)
        cutY: 700,
        dxCut: 0,
        dyCut: 0,
        cutWidth: 75,
        cutHeight: 30,
        cutColor: "#ffffcc",
        cutStroke: "purple",
        strokeHeight: 5,
        draw() { // function to draw this rectangle
            ctx.fillStyle = this.color;
            ctx.fillRect(this.x - this.w / 2, this.y - this.h / 2, this.w, this.h);
            ctx.fillStyle = this.textColor;
            ctx.fillText(this.text, this.x, this.y);
            ctx.fillStyle = this.cutColor;
            ctx.fillRect(this.cutX - this.cutWidth / 2, this.cutY - this.cutHeight / 2, this.cutWidth, this.cutHeight);
            ctx.fillStyle = this.cutStroke;
            ctx.fillRect(this.cutX - this.cutWidth / 2, this.cutY - 8 / 2, this.cutWidth, this.strokeHeight);
        },
        update() { // moves the rectangle
            this.x += this.dx; //x = x + dx  (do we need to update the position ? )
            this.y += this.dy;
            this.cutX += this.dxCut;
            this.cutY += this.dyCut;
        }
    };


//function to create rectangle object
function createRectangle(settings) {
            return Object.assign({}, rectangle, settings);
    }


// function to store rectangles in object array and then spawn rectangle
 function spawnRectangle() {
          if (spawnCountdown) {
              spawnCountdown -= 1;
          } else {
              rectangles.push(
                    createRectangle({
                        y: canvas.height / 1.5,
                        text: function findGrade() {
                                for (var i=0; i<grades.length; i++) {
                                    return this.grades[i];
                                }
                            }, 
                        dx: 2, 
                        dxCut: 2,
                        cutY: randPosition(),
                    })
                );
                spawnCountdown = spawnRate;
            }
    }

如果我解释一下，在我的整个代码中，我有一个函数，它通过数组循环来查看要创建多少个矩形。然后，每次使用函数spawnRectangle创建一个矩形，并将该矩形推送到一个对象数组中

我想做的是，从spawnRectangle函数创建的每个矩形都有其自己的文本属性值（来自my gradesarray）

请注意，我在这里打印了我的成绩数组，但在实际代码中，该数组是从服务器端代码生成的，所有这些值都由ajax更新。

您可以从createRectangle返回Object.assign并使用矩形数组.length引用成绩数组的索引

---

它曾经奏效过吗？什么是矩形或设置？createRectangle函数中的for循环是无用的，因为它从第一次迭代返回，后面的代码中也会返回另一个for循环。为什么从for循环返回？@NinaScholz是的，它工作了，但首先打印出了我的整个数组，然后只打印出索引0。我刚刚用矩形部分的代码编辑了我的问题。设置是createRectangle函数中的参数。它实际上是我在矩形中传递的属性值@易卜拉欣·赫里尔：好的，那么实现我想要的最简单的方法是什么？现在，在迭代或创建新的矩形对象时，我只是尝试将我的grades数组值传递给rectangle，但要使用下一个数组索引值。我太麻木了。。。太简单了。。。我现在明白了。谢谢

function createRectangle(settings) {
  return Object.assign({}, rectangle, settings);
}

rectangles.push(
  createRectangle({
    y: canvas.height / 1.5,
    text: grades[rectangles.length]
    dx: 2, 
    dxCut: 2,
    cutY: randPosition()      
  })
)