0

我是 JavaScript 新手，我正在尝试创建一个 MapManager 类来实例化一些其他管理器，这些管理器将管理 Google 地图的不同方面；例如标记、不同的视图等。

我遇到的问题是，当我尝试将“this”作为参数传递给 MapManager 正在实例化的其他类时，它只传递 MapManager 的一个空实例（JavaScript 控制台显示“MapManager {}”而我调用 MapManager 类中声明的函数时出错。）

var MapManager = function(map) {

    var markerManager = new MarkerManager(this);
    var viewManager = new ViewManager(this);

    var getMarkerManager = function() {
        return markerManager;
    }

    var getViewManager = function() {
        return viewManager;
    }

    var getMap = function() {
         return map;
    } 

    return {
        getMarkerManager: getMarkerManager,
        getViewManager: getViewManager,
        getMap: getMap
    }

}

var MarkerManager = function(mapManager) {

    var map = mapManager.getMap();
    var markers = {};

    var createMarker = function(id, latitude, longitude) {

        var marker = new google.maps.Marker({
        position: new google.maps.LatLng(latitude, longitude),
        map: map,
        animation: google.maps.Animation.DROP
        });

        marker.set("id", id);
        markers[id] = marker;

        var listener = new google.maps.event.addListener(marker, "click", function () {
             mapManager.getViewManager().setZoomToClient(id);
        };
    };

    return {
        createMarker: createMarker
    };
}

var ViewManager = function(mapManager) {

    var map = mapManager.getMap();
    var setBoundView = function() {
    var bounds = new google.maps.LatLngBounds();
    var markers = mapManager.getMarkerManager.getMarkers();
    for(id in markers) {
    bounds.extend(markers[id].getPosition());
    }
    map.fitBounds(bounds);
    };

    return {
    setBoundView: setBoundView
    };
}

我不能在 JavaScript 中传递“this”以进行依赖注入吗？如果您能够比较 JavaScript 中的“this”与另一种语言之间的差异，那么知道我熟悉 PHP、Java 和 Python 可能会很有用。

4

1 回答 1

2

您遇到的问题是您this在构造函数中使用的实际上并不是您最终构建的东西。您正在使用一种特定的 Javascript 模式（您可能已经读过它是实现“私有”成员的好方法），当您尝试使用该语言的某些功能时会导致奇怪的事情发生。[0]

在构造函数执行期间，this实际上指向MapManager. 但是，因为您从构造函数返回一个对象，所以您对MapManager实例的外部引用是对返回对象的引用，这与this您在构造函数中引用的不同。

有几种方法可以解决这个问题：

  1. 如果您只是return { ... };从构造函数中删除 并将您在该对象中所做的分配替换为例如this.functionName = functionName;，您应该没问题。

  2. 如果你想用更标准的 JavaScriptish 方式来做，你可以把你的方法map放在. 这个 SO question解释了如何做到这一点，以及更多关于这两个选项之间的区别。thisMapManager.prototype

此外，如果您对可以更轻松地定义经典 OO 类的轻量级库感兴趣，我建议您看看Classy。

[0]我对这种模式有些固执己见：我认为它是邪恶的、卑鄙的、破碎的，永远不应该使用。它以特别令人沮丧的方式破坏了语言的基本方面（如原型链）。

于 2013-08-27T20:14:38.703 回答