JavaScript 对象:按名称作为字符串访问变量属性

IT技术 javascript object
2021-01-16 19:32:18

如果我有一个如下所示的 javascript 对象

var columns = {
  left: true,
  center : false,
  right : false
}

我有一个函数,它同时传递对象和属性名称,就像这样

//should return false
var side = read_prop(columns, 'right');

的身体read_prop(object, property)会是什么样子?

3个回答

您不需要它的函数 - 只需使用括号表示法

var side = columns['right'];

这与点表示法, 相同var side = columns.right;,但right在使用括号表示法时它也可能来自变量、函数返回值等。

如果你需要一个函数,这里是:

function read_prop(obj, prop) {
    return obj[prop];
}

要回答下面的一些与原始问题没有直接关系的评论,可以通过多个括号引用嵌套对象。如果你有一个像这样的嵌套对象:

var foo = { a: 1, b: 2, c: {x: 999, y:998, z: 997}};

您可以访问财产xc,如下所示:

var cx = foo['c']['x']

如果属性未定义,则尝试引用它会返回undefined(notnullfalse):

foo['c']['q'] === null
// returns false

foo['c']['q'] === false
// returns false

foo['c']['q'] === undefined
// returns true
恕我直言,这很明显......
2021-03-20 19:32:18
也许这是不言而喻的,但我认为可能值得明确指出propmust be of typestring和/或 resolve to type string
2021-03-22 19:32:18
那么嵌套对象呢?
2021-03-26 19:32:18
如果该属性不存在会怎样?它是否返回未定义?
2021-04-02 19:32:18
@BluE:测试不是更容易吗?;) 是的,访问未定义的属性会返回undefined.
2021-04-02 19:32:18

ThiefMaster 的回答是 100% 正确的,尽管我遇到了一个类似的问题,我需要从嵌套对象(对象内的对象)中获取一个属性,因此作为他回答的替代方案,您可以创建一个递归解决方案,让您定义一个命名法来获取任何属性,无论深度如何:

function fetchFromObject(obj, prop) {

    if(typeof obj === 'undefined') {
        return false;
    }

    var _index = prop.indexOf('.')
    if(_index > -1) {
        return fetchFromObject(obj[prop.substring(0, _index)], prop.substr(_index + 1));
    }

    return obj[prop];
}

您对给定属性的字符串引用类似于 property1.property2

JsFiddle 中的代码和注释

访问嵌套属性可以更简单,请查看stackoverflow.com/questions/4244896/...
2021-03-16 19:32:18
如果prop字符串将包含数组索引,这将不起作用
2021-03-19 19:32:18
2021-03-26 19:32:18

由于上面的答案对我的项目有所帮助(我问了一个重复的问题并在此处被引用),因此我在 var 中嵌套时提交了括号表示法的答案(我的测试代码):

<html>
<head>
  <script type="text/javascript">
    function displayFile(whatOption, whatColor) {
      var Test01 = {
        rectangle: {
          red: "RectangleRedFile",
          blue: "RectangleBlueFile"
        },
        square: {
          red: "SquareRedFile",
          blue: "SquareBlueFile"
        }
      };
      var filename = Test01[whatOption][whatColor];
      alert(filename);
    }
  </script>
</head>
<body>
  <p onclick="displayFile('rectangle', 'red')">[ Rec Red ]</p>
  <br/>
  <p onclick="displayFile('square', 'blue')">[ Sq Blue ]</p>
  <br/>
  <p onclick="displayFile('square', 'red')">[ Sq Red ]</p>
</body>
</html>