请检查以下对象结构:
var obj_parent = {
obj_child : {
obj_child_var : 15,
fnc : function() {
let self = this;
alert('Called : obj_parent>fnc() | obj_child_var : '+self.obj_child_var);
obj_parent.obj_fnc();
}
},
obj_fnc : function() {
alert('Called : obj_parent>obj_fnc();');
}
};
$(function() {
obj_parent.obj_child.fnc();
});
在Codepen测试代码,只需单击"单击此处"按钮即可进行测试。
在第 #7 行,obj_parent.obj_child.fnc(( 调用函数 obj_parent.obj_fnc((,该函数来自其父级的父级。
如果它不是父级的父级,我可以使用"this"来访问(例如在 #5,#6 行中访问了"obj_child_var"(。
这里的问题是,如果我必须重命名"obj_parent",我将不得不在其中的任何地方重命名它。
重构代码的最佳方法是什么,其中任何子级或其中的多个子级都可以从对象的顶部根访问任何其他子级,而无需使用其直接名称('obj_parent'(,而是更通用的方式。
比如:let self_root = 指向 'obj_parent' 的指针; 并使用此self_root而不是在每个关卡中,在"obj_parent"内的所有地方使用"obj_parent";
在这里,我想将整个代码保持紧凑:obj_parent = {..一切..}
并且不想将任何"obj_parent"代码放在它之外,例如使用:
obj_parent.原型.* * = * * * *;
对于仅在 obj_parent= {...} 内部重组代码来实现此目的的最佳方法,是否有任何建议?
简而言之,我正在obj_parent.obj_child.fnc((中寻找以下内容:
...
fnc : function() {
let root_obj_pointer = this.parent;// Points to 'obj_parent';
root_obj_pointer.obj_fnc();// Instead of obj_parent.obj_fnc();
}
...
这样我就不必重命名obj_parent.obj_fnc((中的"obj_parent";如果根"obj_parent"被重命名。
这里的问题是,如果我必须重命名"obj_parent",我将不得不在其中的任何地方重命名它。
我会改用 IIFE,这样您就可以在 IIFE 的作用域内为对象指定您想要的任何名称,并返回对象 - 然后,您可以将外部变量名称从obj_parent
重命名为您想要的任何名称,而不会出现问题:
const parentVariableName = (() => {
const obj_parent = {
obj_child : {
obj_child_var : 15,
fnc : function() {
let self = this;
alert('Called : obj_parent>fnc() | obj_child_var : '+self.obj_child_var);
obj_parent.obj_fnc();
}
},
obj_fnc : function() {
alert('Called : obj_parent>obj_fnc();');
}
};
return obj_parent;
})();
parentVariableName.obj_child.fnc();
根据您的使用情况,您可以将子函数重写为箭头函数,以便范围是外部上下文。
https://codepen.io/anon/pen/rZyPmz?editors=0010
var parent = {
child: {
x: 15,
fnc: () => {
let y = parent.child.x
alert('child.fnc(): ' + y)
parent.fnc(y)
}
},
fnc: function(y) {
alert('parent.fnc(): ' + y)
}
};
function btn_clicked() {
parent.child.fnc()
}