面试题：JavaScript属性访问表达式的作用域及动态访问

获取动态属性值：

使用方括号语法[]来访问动态属性。例如，假设有一个对象obj，属性名存储在变量propName中：

const obj = {
    "dynamic - prop1": "value1",
    "dynamic - prop2": "value2"
};
const propName = "dynamic - prop1";
const value = obj[propName];
console.log(value); // 输出 "value1"

设置动态属性值：

同样使用方括号语法。例如：

const obj = {};
const propName = "new - dynamic - prop";
const propValue = "new value";
obj[propName] = propValue;
console.log(obj); // 输出 {new - dynamic - prop: "new value"}

不同作用域下的问题及解决方案：
- 全局作用域：
  - 问题：在全局作用域下，使用动态属性名时可能会意外覆盖全局变量，因为全局对象（浏览器环境下是window，Node.js环境下是global）也是一个对象。例如，如果不小心将全局变量名作为动态属性名使用，可能会导致全局变量的值被修改。
  - 解决方案：尽量避免在全局作用域下创建大量动态属性。如果确实需要，在使用前检查属性名是否已经存在于全局对象中，避免覆盖重要变量。例如：
```
if (!window.hasOwnProperty('myDynamicProp')) {
    window['myDynamicProp'] = 'value';
}
```
- 函数作用域：
  - 问题：在函数内部，动态属性访问可能会因为作用域链查找规则导致访问到错误的对象。例如，如果函数内部有一个局部变量与要访问的动态属性名相同，可能会优先访问到局部变量而不是预期的对象属性。
```
function test() {
    const propName = 'name';
    const obj = {name: 'John'};
    // 这里如果不小心在访问obj[propName]前声明了propName变量，可能会导致问题
    const value = obj[propName];
    console.log(value);
}
```
  - 解决方案：确保变量命名的唯一性，尽量避免局部变量与对象属性名冲突。在访问对象动态属性时，明确指定对象，并且注意变量声明和赋值的顺序。
- 块级作用域（ES6+的let和const引入块级作用域）：
  - 问题：在块级作用域内，可能会出现暂时性死区问题。例如，在块级作用域内使用let或const声明变量前访问动态属性，如果动态属性名与声明的变量名相同，会导致语法错误。
```
{
    const obj = {name: 'Jane'};
    // 错误的做法，在声明变量前访问动态属性
    const value = obj[name];
    let name;
}
```
  - 解决方案：在块级作用域内，先声明变量，再进行动态属性访问操作，确保变量已经被声明，避免暂时性死区问题。
```
{
    const obj = {name: 'Jane'};
    let name;
    const value = obj[name];
}
```

星途面试题库

面试题：JavaScript属性访问表达式的作用域及动态访问

知识考点

面试题答案