关于在类中使用self.variable动态切换地图变量的技术问询

你想要的通过传入动态变量来切换操作map或miniMap的需求，在JavaScript里完全能实现，核心就是利用对象属性的方括号访问语法——它允许你用字符串变量来动态指定要访问的属性，替代固定的点符号（.）调用。

具体实现步骤 #

首先，你可以在googleMap类里封装一个通用的地图操作方法，让它接受一个地图属性名的参数，然后通过方括号来访问对应的地图实例：

googleMap = Class.extend({
  map: null,
  miniMap: null,
  isOverlayVisible: false,
  overlay: null,

  // 动态操作地图的方法：传入地图属性名和操作参数
  fitMapBounds: function(targetMapName, bounds) {
    // 先校验目标地图实例是否存在，避免报错
    const targetMap = this[targetMapName];
    if (targetMap) {
      targetMap.fitBounds(bounds);
    } else {
      console.error(`找不到名为'${targetMapName}'的地图实例！`);
    }
  }
});

调用方式 #

之后你就可以在需要的地方，通过传入不同的地图属性名来切换操作对象：

// 操作主地图map
self.fitMapBounds('map', bounds);
// 操作迷你地图miniMap
self.fitMapBounds('miniMap', bounds);

扩展通用操作（可选） #

如果你的地图操作不止fitBounds一种，还可以写一个更通用的方法，支持调用任意地图实例的方法：

googleMap = Class.extend({
  // ... 原有属性 ...

  operateMap: function(targetMapName, methodName, ...args) {
    const targetMap = this[targetMapName];
    if (!targetMap) {
      console.error(`找不到名为'${targetMapName}'的地图实例！`);
      return;
    }
    // 校验要调用的方法是否存在
    if (typeof targetMap[methodName] === 'function') {
      targetMap[methodName](...args);
    } else {
      console.error(`地图实例没有'${methodName}'这个方法！`);
    }
  }
});

调用示例：

// 调用fitBounds方法
self.operateMap('map', 'fitBounds', bounds);
// 调用setCenter方法
self.operateMap('miniMap', 'setCenter', new google.maps.LatLng(37.7749, -122.4194));

注意事项 #

• 传入的targetMapName必须是类中已定义的属性名（比如'map'或'miniMap'），否则会返回undefined，所以一定要加存在性校验。
• 如果你的类是用特定框架（比如Backbone.js的Class.extend）实现的，确保this的指向正确（比如在回调函数里用self保存上下文，就像你原代码里做的那样）。

内容的提问来源于stack exchange，提问作者newpoison