簡體   English   中英

如何從 ChildClass 更改 parentClass 變量,並為所有孩子全局創建該變量,以便我可以從所有類訪問相同的數據?

[英]how to change a parentClass variable from ChildClass, and make that variable globally for all childs, so I can access the same data from all classes?

我有這個代碼:

 class ParentClass { constructor() { /* at the start is 0 because we didn't call it */ this.previusX = 0; this.previusY = 0; this.previusZ = 0; } // if we call a newChildClass() the previus values will not be 0 anymore, but the current x, y, z values. setLastPosition() { this.previusX = this.x; this.previusY = this.y; this.previusZ = this.z; } } class ChildClass extends ParentClass { constructor(_obj) { super(); // if there is no obj, then use the previus position (that is the last position) // this techically works because we use "??" this.x = _obj.x? ? this.previusX; this.y = _obj.y? ? this.previusY; this.z = _obj.z? ? this.previusZ; // if result is not set, then it will be a error, but we will change it (here is work fine, no problem in that) this.result = "ERROR"; } print() { this.result = `X${this.x} Y${this.y} Z${this.z}`; // ❌ this is not working properly, technically // if I console.log previusX, previusY, previusZ, it will print the current x, y, z values, // but in the next ChildClass it doesn't remember the previus values that are save in parentClass // I thinked that if I have for example 10 childrens, the parent be only one // and all that children can get the previus values from the parentClass. this.setLastPosition(); return this.result; } }
 <!-- see the next code snippet for the example of the problems -->

當我想從ChildClass更改parentClass變量時

parentClass不會保存更改的變量,但每次都會重置。

如何讓 ParentClass 在所有其他孩子上共享相同的變量?


  • 這個想法是 ParentClass 將只有少數(最好只有 1 個),但孩子可以超過 2 個(也可以是 10 個相似的)。

  • 每個孩子都有不同的 object 數據

  • 但是每個孩子在父類中都有相同的數據,
    所以如果我重新定義例如this.previusX所有的孩子現在都有新的價值,因為我們改變了 parentClass。

  • 如果childClassconstructor()中獲得 null 或 undefined 值,那么它將嘗試從parentClass獲取全局變量this.previus

  • 創建新的 ChildClass 后如何不重置 ParentClass 中 this.var 中的值? 或使其在全局范圍內重新定義,因此0將不再是返回值,而是this.x例如。

我唯一可能導致問題的想法是super(); 但不確定。
在 StackOverflow 上詢問之前,我搜索了很多但沒有找到任何東西(至少使用 javascript 語言,可能是 java 但我不熟悉它......)


現在這里是帶有錯誤示例的代碼和我想要的代碼,還有評論:

請運行代碼片段以了解問題,並閱讀 html 腳本標簽中的注釋

 class ParentClass { constructor() { /* at the start is 0 because we didn't call it */ this.previusX = 0; this.previusY = 0; this.previusZ = 0; } // if we call a newChildClass() the previus values will not be 0 anymore, but the current x, y, z values. setLastPosition() { this.previusX = this.x; this.previusY = this.y; this.previusZ = this.z; } } class ChildClass extends ParentClass { constructor(_obj) { super(); // if there is no obj, then use the previus position (that is the last position) // this techically works because we use "??" this.x = _obj.x?? this.previusX; this.y = _obj.y?? this.previusY; this.z = _obj.z?? this.previusZ; // if result is not set, then it will be a error, but we will change it (here is work fine, no problem in that) this.result = "ERROR"; } print() { this.result = `X${this.x} Y${this.y} Z${this.z}`; /* ❌ this is not working properly, technically if I console.log previusX, previusY, previusZ, it will print the current x, y, z values, but in the next ChildClass it doesn't remember the previus values that are save in parentClass I thinked that if I have for example 10 childrens, the parent be only one and all that children can get the previus values from the parentClass. */ this.setLastPosition(); return this.result; } } test(); function test() { // this is correct but in the next examples is not working because I wanted to that if _obj isn't defined it get the previus one. console.log(new ChildClass({ x: 1, y: 2, z: 3 }).print()); // here since z is not defined // ❌ it need to be 3, but I don't know why is 0. console.log(new ChildClass({ x: 4, y: 5 }).print()); // ❌ this need to be "x: 4, y: 5, z: 3" by getting the previus values with "??" console.log(new ChildClass({ x: 3 }).print()); // ❌ this need to be "x:3, y:5, z:18" console.log(new ChildClass({ z: 18 }).print()); // ✅ if there is all the values then is correct console.log(new ChildClass({ x: 8, y: 20, z: 30 }).print()); }
 <h1>hello world</h1>






獎金:(看不到這個,問題出在第一個代碼中,如果可以的話,這只是一個獎金,但如果有之前的答案,我也會接受你的答案)

還有一種方法可以編寫類似這樣的偽代碼嗎?

let one = new ParentClass();
let two = new ParentClass();

// now the child's class know their parentClass
one.childClass({x:10}).print();
one.childClass({y:30, z:10}).print();
one.childClass({ x: 15, z: 30 }).print();

// the previus values need to be different from the "one".
two.childClass({x:15}).print();
two.childClass({y:25}).print();
two.childClass({ z: 5, x: 30 }).print();

// the values are random, only to test and debugging purposes

上面的這段代碼不是正確的語法代碼,但也許我試圖讓你理解我想要的邏輯。
parentClass可以在所有ChildClass上共享相同的變量,但是每個ChildClass都有自己的無法更改的變量……但是ParentClass變量可以由ChildClass更改並影響所有其他孩子。

我試圖歸檔這個想法是什么? (但不工作)

在此處輸入圖像描述

我試圖 console.log the childClass ,我看到那里有Prototype的東西,它有ParentClass

所以我嘗試使用new ChildClass({}).Prototype.ParentClass而不是 output 任何東西以舊方式訪問 ParentClass

我很困惑,我不知道為什么不工作,如果你幫助我,謝謝。 在此處輸入圖像描述


所以

  1. 子 class 可以更改父 class 構造函數
  2. 如果創建了新的子 Class,則父 class 不需要重置,但需要記住最后更改的值。

TLDR:

ParentClass.myVariable = "something";

長答案:

我認為您的問題出在super()
我的意思是從技術上講,當你寫this.
您指的是ChildClass()而不是父級。

請記住,當您調用super();
parentClass從字面上復制父類並將所有內容放在childClass
因此,當您編寫this.previusX時,該值始終保留在ChildClass

如果您考慮一下,這很好,因為不要讓您產生一些副作用。


那么它的解決方案是什么?

你總是需要把那個super(); 或者this. 不管用。

但不是指this
嘗試參考父級的 class 名稱。

我知道你試圖使用prototype的東西,但不適合你,
但是現在使用CLASS關鍵字,使用這種syntax sugar變得容易多了

所以只要寫這樣的東西:

ParentClass.myVariable = "something";

像這張照片:

在此處輸入圖像描述 在此處輸入圖像描述

這里是控制台的結果:

在此處輸入圖像描述

你看效果很好,那里沒有0。

 class ParentClass { constructor() { this.previusX = 0; this.previusY = 0; this.previusZ = 0; } } class ChildClass extends ParentClass { constructor(_obj) { super(); this.x = _obj.x?? ParentClass.previusX; this.y = _obj.y?? ParentClass.previusY; this.z = _obj.z?? ParentClass.previusZ; this.result = "ERROR"; } print() { this.result = `X${this.x} Y${this.y} Z${this.z}`; this.setLastPosition(); return this.result; } setLastPosition() { ParentClass.previusX = this.x; ParentClass.previusY = this.y; ParentClass.previusZ = this.z; } } test(); function test() { // this is correct but in the next examples is not working because I wanted to that if _obj isn't defined it get the previus one. console.log(new ChildClass({ x: 1, y: 2, z: 3 }).print()); // here since z is not defined // ❌ it need to be 3, but I don't know why is 0. console.log(new ChildClass({ x: 4, y: 5 }).print()); // ❌ this need to be "x: 4, y: 5, z: 3" by getting the previus values with "??" console.log(new ChildClass({ x: 3 }).print()); // ❌ this need to be "x:3, y:5, z:18" console.log(new ChildClass({ z: 18 }).print()); // ✅ if there is all the values then is correct console.log(new ChildClass({ x: 8, y: 20, z: 30 }).print()); }


⚠️但是有一個額外的錯誤!

如果setLastPosition()方法在開始時沒有運行,
然后ParentClass以前的 var 它將是undefined的,
它不會得到 0 值。

那么為什么之前工作,對我來說似乎工作?

是的,在大多數情況下它會起作用,
但是如果在第一個ChildClass你沒有定義x, y, z那么這會發生

例如: new ChildClass({ x: 1, y: 2 }現在所有其他沒有定義z的下一個ChildClass es 將是undefined

 class ParentClass { constructor() { this.previusX = 0; this.previusY = 0; this.previusZ = 0; } } class ChildClass extends ParentClass { constructor(_obj) { super(); this.x = _obj.x?? ParentClass.previusX; this.y = _obj.y?? ParentClass.previusY; this.z = _obj.z?? ParentClass.previusZ; this.result = "ERROR"; } print() { this.result = `X${this.x} Y${this.y} Z${this.z}`; this.setLastPosition(); return this.result; } setLastPosition() { ParentClass.previusX = this.x; ParentClass.previusY = this.y; ParentClass.previusZ = this.z; } } test(); function test() { // this is correct but in the next examples is not working because I wanted to that if _obj isn't defined it get the previus one. console.log(new ChildClass({ x: 1, y: 2 }).print()); // here since z is not defined // ❌ it need to be 3, but I don't know why is 0. console.log(new ChildClass({ x: 4, y: 5 }).print()); // ❌ this need to be "x: 4, y: 5, z: 3" by getting the previus values with "??" console.log(new ChildClass({ x: 3 }).print()); // ❌ this need to be "x:3, y:5, z:18" console.log(new ChildClass({ z: 18 }).print()); // ✅ if there is all the values then is correct console.log(new ChildClass({ x: 8, y: 20, z: 30 }).print()); }

在此處輸入圖像描述

快速解決方案可以是:

使用另一個?? 檢查是null還是undefined
如果是這樣,那么把0也那個。

在此處輸入圖像描述

this.x = _obj.x ?? ParentClass.previusX ?? 0;
this.y = _obj.y ?? ParentClass.previusY ?? 0;
this.z = _obj.z ?? ParentClass.previusZ ?? 0;

現在不是告訴你undefined它會告訴你0

在此處輸入圖像描述

 class ParentClass { constructor() { this.previusX = 0; this.previusY = 0; this.previusZ = 0; } } class ChildClass extends ParentClass { constructor(_obj) { super(); this.x = _obj.x?? ParentClass.previusX?? 0; this.y = _obj.y?? ParentClass.previusY?? 0; this.z = _obj.z?? ParentClass.previusZ?? 0; this.result = "ERROR"; } print() { this.result = `X${this.x} Y${this.y} Z${this.z}`; this.setLastPosition(); return this.result; } setLastPosition() { ParentClass.previusX = this.x; ParentClass.previusY = this.y; ParentClass.previusZ = this.z; } } test(); function test() { // this is correct but in the next examples is not working because I wanted to that if _obj isn't defined it get the previus one. console.log(new ChildClass({ x: 1, y: 2 }).print()); // here since z is not defined // ❌ it need to be 3, but I don't know why is 0. console.log(new ChildClass({ x: 4, y: 5 }).print()); // ❌ this need to be "x: 4, y: 5, z: 3" by getting the previus values with "??" console.log(new ChildClass({ x: 3 }).print()); // ❌ this need to be "x:3, y:5, z:18" console.log(new ChildClass({ z: 18 }).print()); // ✅ if there is all the values then is correct console.log(new ChildClass({ x: 8, y: 20, z: 30 }).print()); }

現在我認為ParentClass()內部的構造函數不再需要了。

因為同樣它總是錯誤的(總是0 ),但我們可以手動創建它並通過parentClass.previusX訪問它

因為super(); 總是必要的,但它需要一個不必要的變量,這可能會給你帶來一些錯誤。 在此處輸入圖像描述


就是這樣,這是正確的代碼:

 class ParentClass { //not necessary for now. } class ChildClass extends ParentClass { constructor(_obj) { super(); this.x = _obj.x?? ParentClass.previusX?? 0; this.y = _obj.y?? ParentClass.previusY?? 0; this.z = _obj.z?? ParentClass.previusZ?? 0; this.result = "ERROR"; } print() { this.result = `X${this.x} Y${this.y} Z${this.z}`; this.setLastPosition(); return this.result; } setLastPosition() { ParentClass.previusX = this.x; ParentClass.previusY = this.y; ParentClass.previusZ = this.z; } } test(); function test() { console.log(new ChildClass({ x: 1, y: 2 }).print()); console.log(new ChildClass({ x: 4, y: 5 }).print()); console.log(new ChildClass({ x: 3 }).print()); console.log(new ChildClass({ z: 18 }).print()); console.log(new ChildClass({ x: 8, y: 20, z: 30 }).print()); }

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM