javascript - 了解发生了什么 obj 和两个 brack 值等于 {some object data}

标签 javascript arrays object square-bracket

有时,最有可能对所有人来说最基本的东西并没有被吸收。我遇到了一些我需要理解的 javascript 代码。我添加了一个调试器,这样我就可以逐步完成并希望更好地理解它,但仍然不清楚发生了什么。

var obj = {};
var myID = 999;

var productID = 1;

var myModelID = 100;
var myCatID = 200;
    var addMe = 1; 

if (typeof obj[myCatID] == 'undefined') {
    obj[myCatID] = {};
}

var locationObj = {
    state: 'roch',
    city: '3',
    street: '2nd',
    houseNum: '101'
};

var qty = 1;

obj[myCatID][myModelID]={
    'location': locationObj,
    'quantity': qty,
    'prodID': productID,
    'id': myID
};

这是怎么回事? obj[myCatID][myModelID] = .关于 obj 的括号表示法中的两个属性的东西?然后给它分配一个对象?只是不清楚我在看什么。

通过我的警报和调试器输出。 ! https://imgur.com/gEqonS7

! https://imgur.com/igZwgOw

最后,如果我添加一个额外的括号值将 obj[myCatID][myModelID] 更改为 obj[myCatID][myModelID][addMe] 会怎么样?为什么会出现调试错误,未捕获的类型错误:运行时无法设置未定义的属性“1”?我看不出 [myModelID] 有何不同以及它的声明方式。感谢您帮助我克服这个障碍。

最佳答案

您可以使用括号访问器访问和操作 JavaScript 对象。

var obj = {};  // create an empty object
obj['test'] = 'Hello World';  // add an object property 'test' with content 'Hello World'
console.info(object['test']);  // Hello World
console.info(object.test);  // Hello World

如您所见,对象属性访问可以表示为 obj['propertyName']obj.propertyName。如果您想向对象添加新属性,这同样适用:obj['newProperty'] = 42obj.newProperty = 42 相同。

现在,如果你想在外部对象中嵌套内部对象,你可以使用多个括号访问器或点来实现:obj['prop1']['prop2']['prop3'] = 42obj.prop1.prop2.prop3 = 42

但是:您必须先分别初始化每个内部对象,然后才能访问它!否则 JavaScript 会说“无法设置未定义的属性”,因为您尝试访问的实际对象之前从未初始化过。

var obj = {};
obj['prop1'] = {};  // creates an inner object 'prop1'
obj['prop1']['prop2']['prop3'] = 42;  // does not work because 'prop2' has never been created as an inner object

在您的示例中,您无法访问 obj[myCatID][myModelID][addMe],因为内部对象“myModelID”从未被初始化为对象。因此访问 obj[myCatID][myModelID] 将返回 undefined,因此您将尝试调用 undefined['prop3'] 结果一个错误。

简单的解决方案:检查每个内部对象是否已经初始化。这就是您的代码在 if (typeof obj[myCatID] == 'undefined') 处发生的情况。

关于javascript - 了解发生了什么 obj 和两个 brack 值等于 {some object data},我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57906799/

相关文章:

javascript - Eloquent JavaScript 4.4深度对比

javascript - 如何使用拓扑图处理 Cytoscape.js Canvas 上的鼠标滚动和按键事件

PHP $_SESSION 变量不会持续存在——为什么不呢?

arrays - 如何将 Bash 数组的元素连接到分隔字符串中?

Java打印列表和数组列表

javascript - 更改 javascript 对象内的范围

javascript - 将对象键连接/推送到数组

javascript - 用javascript模拟左右方向键事件

javascript - 嵌套的 v-tabs : Conditionally render the child tabs in order to show slider

javascript - Canvas 和物体