Fatal编程技术网
  • javascript/
  • 在另一个对象中创建复杂/嵌套JavaScript对象的正确方法

在另一个对象中创建复杂/嵌套JavaScript对象的正确方法

javascript oop

在另一个对象中创建复杂/嵌套JavaScript对象的正确方法,javascript,oop,objectinstantiation,Javascript,Oop,Objectinstantiation,下面的代码是可重用对象的简单构造的简短示例。这是一个非常简单的一层深度对象，放置尽可能多的道具和方法，然后分配它们 function someDesiredReusableType(optionally, pass, ctor, pars, here) { //core obj to return var DesiredTypeCrtor = { propSkiingLocation: "canada", OrderTickets

下面的代码是可重用对象的简单构造的简短示例。这是一个非常简单的一层深度对象，放置尽可能多的道具和方法，然后分配它们

function someDesiredReusableType(optionally, pass, ctor, pars, here) {
   //core obj to return
  var DesiredTypeCrtor = {
              propSkiingLocation: "canada",
              OrderTickets: function(optionally){
                             var tryRoomWView = optionaly;
                             print(
                                  "Dear " + ctor +", your request for " +
                                  propSkiingLocation + " is now being processed: an " +
                                  tryRoomWView  + " request was notified, we understand you have " + pars + " for cross country transportation, confirmation email will be sent " + here + " as soon as we process your order. }
              } 
      };
 return DesiredTypeCrtor 
}
以下是此用途的一个示例：

 var DesrVacSkC = someDesiredReusableType("could really help!",null, "mr. Bean", "my mini", "Fun@bbc.co.uk") 

//oh..almost forgot
DesrVacSkC.OrderTickets();
由于这个富有想象力的对象，实际上并不像我在代码中使用的那样简单，它的工作原理是一样的（没有尝试这个实际的对象，因为它只是一个示例。）

但是下一个同样使用相同方法的设置有点错误

这是一个我已经成功实现的对象的示例，并且在一眨眼之间，使用与buggy对象完全相同的方法实现为一个嵌套对象，我不理解为什么他们在浏览器中应用了与buggy对象不同的方法

//this is an important one, a smart property / value holder I came up with and does work perfectly, as a nested member.

function Rprp(parVal) {
    var cretdprp = {

        propVal: parVal,
        propValAsint: parseInt(parVal)

    };
    return cretdprp;

}
但是下面的下一个没有，因为它缺少初始化
ownedFefCollCore

未捕获类型错误：无法读取未定义的属性“HElmTColl”

//这是一个很重要的问题，是作为一个非常好的问题开始的，将它添加到下面的对象中，直到我添加了
ownedfcollcore
成员

function CreateFileEditForm_Manager() {
//as i do usually base/inner/creator and a return obj
var Repo = {
    CsDataLocals:
               {

                GetCurLastfileId:Rprp($("#HLocModelData_LastFileId").val())

                 },
    FormFldNames:
                        { JRdrData_FileName: "JRdrData_FileName" },

    //this is my bugg ! with and without new keyword & as function or Object!!
    ownedFefCollCore: new FefCollCore(),

   //and this is the line that chrome get's is anger on --> all day long 
    FeFDivWFldsColl: this.ownedFefCollCore.HElmTColl,
    FeFDivWFlds_IdColl: this.ownedFefCollCore.HElmT_IdColl,
    FeFDivWFldsCollAdd: function (parId, parFefDivWrpDivflds) {
        this.ownedFefCollCore.CollAdd(parId, parFefDivWrpDivflds);
    },
       / ........

     //some more code was removed trying to keep it as short as possible
  }

 //fefa stands for fileRecord Edit Form , core just says nothing, is there to imply the 'thing' is to be shared between variation of instances from the base object
在我的研究中，我发现以下方法适用于不太容易出错的结构，但即使是这种方法也不能纠正错误。它是在其他一些东西中发现的，比如这个

var FefCore=JClassProto({
初始化：函数（）{
this.HElmTColl=new Array（）；//最初是[]。。。
//我之所以改变，是因为我想消除任何疑问，这是我的代码…未定义的地方的原因之一，现在我知道了（很确定它们可能有点不同，但两者都可以。）不是这样的。
this.HElmT_IdColl=新数组（）；
this.CollAdd=函数（parId，parHElmT）{
这个.HElmTColl.push（parHElmT）；
这是赫尔姆特-伊德科尔推（parId）；
}
this.Coll_Remove=函数（parHElmT）{
这个.HElmTColl.pop（parHElmT）；
}
//这是第一步，如果要创建新对象（数组中的元素），
//调用此函数以确保我创建的对象不存在
this.ElmObjCanCreate=函数（parId）{
返回此值。getIndexOfValuindivFldSColl（parId）<0；
}
this.HElmTColl_FindById=函数（parId）{
var collindexofCurFileReadyDivWrpFlds=this.getindexofvaluindivfldscoll（parId）；
返回此.HElmTColl[collindexofCurFileReadyDivWrpFlds]；
}
this.getIndexOfValuInHElmTColl=函数（parId）{
返回$.inArray（parId，this.HElmT_IdColl）；
}
}
});
最后但并非最不重要的是，我的原始代码（就在尝试将其创建为基本/共享对象之后）

函数FefCollCore（）{ 此.Cr={ HElmTColl:新阵列（）， HElmT_IdColl:新数组（）， CollAdd：函数（parId，parHElmT）{ 这个.HElmTColl.push（parHElmT）； 这是赫尔姆特-伊德科尔推（parId）； }, Coll_Remove：函数（parHElmT）{ 这个.HElmTColl.pop（parHElmT）； }, CollNeedCreate:函数（parId）{ 返回此值。getIndexOfValuindivFldSColl（parId）<0； }, HElmTColl_FindById：功能（parId）{ var collindexofCurFileReadyDivWrpFlds=this.getindexofvaluindivfldscoll（parId）； 返回此.HElmTColl[collindexofCurFileReadyDivWrpFlds]； }, getIndexOfValuInHElmTColl:函数（parId）{ 返回$.inArray（parId，this.HElmT_IdColl）； } }; 返回此.Cr； } 如果正确解释问题，您可以尝试将
FeFDivWFldsColl
设置为返回
this.ownedFefCollCore.HElmTColl

var FefCore=function（）{
this.e=新数组（）；
这就是推（2）；
}
函数CreateFileEditForm_管理器（）{
var回购={
答:0,，
b:1，
c:新的FefCore（），
//将'FeFDivWFldsColl'值设置为函数
d:函数（）{
//`this.c`:`new FefCore（）`，`this.c.e`:`new Array（）
把这个还给我
}
};
回购回报
}
var Fef=新建CreateFileEditForm_管理器（）；
console.log（Fef.d（））
var cont=“…参见控制台”；
var DivEmptyhtml=document.createElement（'div'）；
var elmst=document.createElement（'style'）；
函数stringcss（）{
return“.cssEmptyhtml{\r\n\t边缘：自动；上边缘：10px；下边缘：20px；”+
“文本对齐：居中；顶部：10px；”+
“宽度：40%；填充：5px；高度：100px；”+
“背景色：rgb（96116243）；”+
“颜色：#B5fee8；”+
“背景图像：”+
“线性梯度（至右下，#2983bC 24%，#284a4b 77%）+
“长方体阴影：8px 10px 50px 20px rgb（55,55,55）；”+
“-webkit边框半径：10px；边框半径：10px；}”；
}
//elmst.innerHTML=stringcss（）；
DivEmptyhtml.innerHTML=cont；
DivEmptyhtml.className=“cssEmptyhtml”；
DivEmptyhtml.attributes[“id”]=“DivEmptyhtml”；
$（“标题”）。追加（elmst）；
$（“正文”）.append（DivEmptyhtml）；
$（elmst）.attr（“id”，“elmst”）；
//$（“.cssEmptyhtml”）.attr（“样式”，stringcss（））；
$（elmst）.text（stringcss（））；
var-strS、strF、消息；
var indx=123；
var计数=135；
indx=++计数-1；
var init=true；
//现在我
var程序步骤=0；
var start=“start”；
console.log（启动）；
函数日志（strLine）{
var d=新日期，
DS=d.getSeconds（），
Dms=d.getmillizes（）.toString（）；
console.log（“[step#”+（++programmasteps）+”]“+DS++”+Dms.substring（0,2）+“>”+strLine）；
}
//…请参阅控制台
功能LogObj（p_类型）{
函数Fnl_t_t（）{
this.obj=“\r\n\t\t”；
}
函数Fnl_5xt（）{
this.obj=“\r\n\t\t\t”；
}
var obj={
doNewLineBold:函数（boolPrint、value、value2、value3、value4）{
var nlttcopy=this.backnl_t_t.obj；
这个。_nl_t_t=lnobj1.bac

var FefCore = JClassProto({
    initialize: function () {
        this.HElmTColl = new Array();//was originally [] ...             
    //i changed because i wanted to eliminate any doubt that it's one of the reasons my code is ... Somewhere undefined , now i know (pretty sure they might be little different but both are ok.) it's not it.
        this.HElmT_IdColl = new Array();
        this.CollAdd = function (parId, parHElmT) {
            this.HElmTColl.push(parHElmT);
            this.HElmT_IdColl.push(parId);
        }
        this.Coll_Remove = function (parHElmT) {
            this.HElmTColl.pop(parHElmT);
        }
        // this is the first move, if a new object(which is an element in the array) about to be created,
        // call this to make sure not exist for i create do
        this.ElmObjCanCreate = function (parId) {
            return this.getIndexOfValuInDivWFldsColl(parId) < 0;
        }
        this.HElmTColl_FindById = function (parId) {
            var collindexofCurFileReadyDivWrpFlds = this.getIndexOfValuInDivWFldsColl(parId);
            return this.HElmTColl[collindexofCurFileReadyDivWrpFlds];
        }

        this.getIndexOfValuInHElmTColl = function (parId) {
            return $.inArray(parId, this.HElmT_IdColl);
        }
    }
});



function FefCollCore() {
    this.Cr = {
        HElmTColl: new Array(),
        HElmT_IdColl: new Array(),
        CollAdd: function (parId, parHElmT) {
            this.HElmTColl.push(parHElmT);
            this.HElmT_IdColl.push(parId);
        },
        Coll_Remove: function (parHElmT) {
            this.HElmTColl.pop(parHElmT);
        },
        CollNeedCreate: function (parId) {
            return this.getIndexOfValuInDivWFldsColl(parId) < 0;
        },
        HElmTColl_FindById: function (parId) {
            var collindexofCurFileReadyDivWrpFlds = this.getIndexOfValuInDivWFldsColl(parId);
            return this.HElmTColl[collindexofCurFileReadyDivWrpFlds];
        },

        getIndexOfValuInHElmTColl: function (parId) {
            return $.inArray(parId, this.HElmT_IdColl);
        }
    };
    return this.Cr;

}



   //and this is the line that chrome get's is anger on --> all day long 
    FeFDivWFldsColl: this.ownedFefCollCore.HElmTColl,