スコープの壁(JavaScript)
こういう場合、子インスタンス(ChildB)から親(Parent)が持っている値(holyVal)をいじることはできない
code:js
class Parent {
constructor() {
this.holyVal = 334
this.childA = new ChildB()
}
}
class ChildB {
constructor() {
this.init()
}
init() {
// ここでholyValをいじることはできない
}
}
こういう時、参照渡しが出来ないのが非常にだるく感じる
コールバック関数で無理やりいじれるようにしてみる
code:js
class Parent {
constructor() {
this.holyVal = 334
this.childA = new ChildB(
() => {
return this.holyVal
},
(newVal) => {
this.holyVal = newVal
},
)
console.log(this.holyVal) // 668
}
}
class ChildB {
constructor(getHoly, setHoly) {
this.getHoly = getHoly
this.setHoly = setHoly
this.init()
}
init() {
const h = this.getHoly()
console.log(h) // 334
this.setHoly(h*2)
console.log(this.getHoly()) // 668
}
}
コードが無駄にクソ長い
holyValをグローバル化してみる
code:js
let holyVal
class Parent {
constructor() {
holyVal = 334
this.childA = new ChildB()
}
}
class ChildB {
constructor() {
this.init()
}
init() {
// 変更できる
holyVal *= 2
}
}
この方法だと、関係ない場所からのアクセスもできてしまう
holyValを触って良い場所と駄目な場所がわかりにくくなる
親classを渡してしまうのはどうでしょう？
code:class1.js
class Parent {
constructor() {
this.holyVal = 334
this.childA = new ChildB(this);
console.log(this.holyVal) // 668
}
}
class ChildB {
constructor(parent) {
this.parent = parent
this.init()
}
init() {
console.log(this.parent.holyVal) // 334
this.parent.holyVal *= 2
console.log(this.parent.holyVal) // 668
}
}
new Parent()
その手があったかああああああMijinko_SD.icon
ESModuleでこの2クラスだけ一つのファイルに閉じこめれば、global変数をカプセル化できるのでそんなに問題にはならないと思います/villagepump/takker.icon
たしかにMijinko_SD.icon
色々アドバイス助かりますMijinko_SD.icon