Question

我创建了一个包含对象的2D数组，每个对象都有两个变量。

当我打印出那些对象时，我发现每个对象都具有相同的值。

如果我更改其中一个对象，其他对象也会更改。

class test{
    constructor(x, y){
        self.x = x;
        self.y = y;
    }
    print(){
        console.log(self.x, self.y);
    }
}

arr = new Array(3);

for(let i=0;i<3;i++){
    arr[i] = new Array(3);
}

for(let i=0;i<3;i++){
    for(let j=0;j<3;j++){
        arr[i][j] = new test(i, j);
    }
}

for(let i=0;i<3;i++){
    for(let j=0;j<3;j++){
        arr[i][j].print();
    }
}

它只打印9 2 2。我不知道发生了什么。

即使我尝试过：

arr[1][2] = new test(2, 3);

它打印9 2 3。

如果有人帮助我，我将不胜感激。

：P

Answer 1

JavaScript不是Python，请使用this，它将起作用。

class test{
    constructor(x, y){
        this.x = x;
        this.y = y;
    }
    print(){
        console.log(this.x, this.y);
    }
}

arr = new Array(3);

for(let i=0;i<3;i++){
    arr[i] = new Array(3);
}

for(let i=0;i<3;i++){
    for(let j=0;j<3;j++){
        arr[i][j] = new test(i, j);
    }
}

for(let i=0;i<3;i++){
    for(let j=0;j<3;j++){
        arr[i][j].print();
    }
}

（幸运的/不幸的是，您到处都使用Window.self）

Answer 2

在构造函数中将x和y分配给self是您的问题，将self更改为this以指向该对象的当前实例。类对象。

class test{
    constructor(x, y){
        this.x = x;
        this.y = y;
    }
    print(){
        console.log(this.x, this.y);
    }
}

arr = new Array(3);

for(let i=0;i<3;i++){
    arr[i] = new Array(3);
}

for(let i=0;i<3;i++){
    for(let j=0;j<3;j++){
        arr[i][j] = new test(i, j);
    }
}

for(let i=0;i<3;i++){
    for(let j=0;j<3;j++){
        arr[i][j].print();
    }
}

从MDN docs：

Window.self只读属性返回窗口本身，作为 WindowProxy。它可以与窗口对象上的点符号（是window.self）还是独立（ self ）

因此，在您的情况下，当您将x和y分配给self.x和self.y时，self的两个新属性被创建，并且您一直覆盖它们在循环中导致将迭代的最后一个值（2,2）分配给x的{{1}}和y属性

Answer 3

您使用的变量self是actually the window object，因此self.x = x仅将x属性附加到window并设置值。调用console.log(self.x, self.y);时，这会从x获取y和window属性，由于只有一个实例，您将获得最后分配的值。

class test{
    constructor(x, y){
        self.x = x;
        self.y = y;
    }
    print(){
        console.log(self.x, self.y);
    }
}

new test(4, 2);

console.log(window.x);
console.log(window.y);

您要使用this来引用当前对象实例

class test{
    constructor(x, y){
        this.x = x;
        this.y = y;
    }
    print(){
        console.log(this.x, this.y);
    }
}

arr = new Array(3);

for(let i=0;i<3;i++){
    arr[i] = new Array(3);
}

for(let i=0;i<3;i++){
    for(let j=0;j<3;j++){
        arr[i][j] = new test(i, j);
    }
}

for(let i=0;i<3;i++){
    for(let j=0;j<3;j++){
        arr[i][j].print();
    }
}

Answer 4

self不引用class的实例。 self以window的另一个名称。查看代码段是什么self

根据MDN

Window.self只读属性返回窗口本身

class test{
    constructor(x, y){
        console.log(self === window) //true
        console.log(self) //widnow object       
    }
}
let x = new test(1,2);

因此，每次创建test self.x的新实例时，self.y都会更改。 self.y和self.x等同于window.x和window.y

使用this代替self将解决此问题。

class test{
    constructor(x, y){
        this.x = x;
        this.y = y;
    }
    print(){
        console.log(this.x, this.y);
    }
}

arr = new Array(3);

for(let i=0;i<3;i++){
    arr[i] = new Array(3);
}

for(let i=0;i<3;i++){
    for(let j=0;j<3;j++){
        arr[i][j] = new test(i, j);
    }
}

for(let i=0;i<3;i++){
    for(let j=0;j<3;j++){
        arr[i][j].print();
    }
}

Javascript：具有相同值的对象数组的每个元素

4 个答案: