javascript - 为什么在执行Google Maps Directions服务回调时“此” DomWindow对象

所以我有一个这样定义的对象（简化）：

mapRoute : {
            isInit : false,
            latLang : "",
            directionsService :  null,
            directionsRenderer : null,

            init : function() {
                if(!this.isInit) {
                    this.directionsService = new google.maps.DirectionsService();
                    this.directionsRenderer = new google.maps.DirectionsRenderer();
                    this.directionsRenderer.setPanel(document.getElementById("google_route_results"));
                    this.isInit = true;
                }
            },


            planRoute : function() {
                var from;
                var to;

                from = $('#addressFrom').val();
                to = this.LatLang;

                var directionsRequest = {
                    origin:from,
                    destination:to,
                    travelMode: google.maps.DirectionsTravelMode.DRIVING
                };

                this.directionsService.route(directionsRequest, this.planRouteCallback);
            },

            planRouteCallback : function(result,status){
                if(status == google.maps.DirectionsStatus.OK) {
                    this.directionsRenderer.setDirections(result);
                    this.directionsRenderer.setMap(google_map_object);
                } else {
                    this.handleErrors(status);
                }
            },

            //handleErrors
            handleErrors : function(statusCode) {
                //do stuff
            },


        }//end mapRoute

但是，当我执行planRouteCallback时，出现错误，因为“ this”是指DomWindow对象，而不是mapRoute对象。为什么会这样，我能做些什么？

最佳答案

问题在于函数不是从mapRoute对象的上下文中执行的。因此，例如：

var foo = {bar: 10, fn: function(){ alert(this.bar); }};
foo.fn(); // called within the context of the object foo, so it alerts 10

var noContextFn = foo.fn;
noContextFn(); // uh oh, no context, alerts undefined

现在，当您将回调mapRoute.planRouteCallback传递给其他函数时，它们现在具有对正确函数的引用，但不会像上述一样在mapRoute的上下文中执行该回调。

每次将回调作为参数传递时，您都可以创建一个匿名函数并使用self = this模式，尽管您最好一次又一次地修复函数本身。
您可以绑定功能。构建mapRoute对象之后，可以运行：

mapRoute.planRouteCallback = mapRoute.planRouteCallback.bind(mapRoute);

（请注意，可能并非在所有浏览器中都实现bind()，有关可以使用的实现，请参见MDC）。