如何在 Google 地图监听器中使用 bool？

Question

我在这个问题上停了 4 小时，if 在调用 Google 地图事件时忽略了我的布尔值。我需要提供参数不同的数据。也许世界上有人知道为什么？

console.log同时点击后抛出：

true before click
stack.html:56[object HTMLDivElement]in listener
stack.html:62[object HTMLDivElement]bunga bunga

破布尔：

this.b = true;
...
console.log(this.b + " beafore click");
this.mapListener = google.maps.event.addListener(map, 'click', function(e) {
    console.log(this.b + "in listener");
    if (this.b==true) {
        console.log(this.b + "true works");
        tools[type](e.latLng, last_marker_origin);
        this.b = false;
    } else {
        console.log(this.b + "bunga bunga");
        //tools[type](e.latLng);
    }
});

this 指的是我的对象中的“属性”，默认设置为 false，但是当我将选项更改为 true。

我现在去睡觉。我会在早上回答。

Answer 1

您的问题是this 不再是对您的properties 的有效引用。处理您的特定问题的最简单方法是更改​​代码：

this.b = true;
var props = this;
console.log(this.b + " beafore click");  //Notice that "this" is still valid here 
this.mapListener = google.maps.event.addListener(map, 'click', function(e) {
    console.log(props.b + "in listener");
    if (props.b == true) {
        console.log(props.b + "true works");
        tools[type](e.latLng, last_marker_origin);
        props.b = false;
    } else {
        console.log(props.b + "bunga bunga");
        //tools[type](e.latLng);
    }
});

根本问题是实际调用回调函数的代码在完全不同的范围内，所以当代码运行时this 的含义发生了变化。设置参考并将其放入代码中将解决您的问题。

Answer 2

这里的问题是this的范围。当您在 click 事件处理函数中时，this 不再引用您的属性对象，而是指向事件处理程序。事件处理程序是所谓的closure。

您的问题有两种可能的解决方案。

1. 为您的值使用局部变量（var b 而不是this.b），局部变量被复制到闭包中，因此可以在闭包内部和外部使用该值：

   var b = true;
   console.log(b + " beafore click");
   this.mapListener = google.maps.event.addListener(map, 'click', function(e) {
       console.log(b + "in listener");
       if (b==true) {
           console.log(b + "true works");
           tools[type](e.latLng, last_marker_origin);
           b = false;
       } else {
           console.log(b + "bunga bunga");
           //tools[type](e.latLng);
       }
   });
   

2. 将this 保存在局部变量中，这是避免范围问题的一种非常常见的技术：

   //save this in a locale variable, now 'me' provides access to this scope
   var me = this;
   me.b = true;
   console.log(me.b + " beafore click");
   this.mapListener = google.maps.event.addListener(map, 'click', function(e) {
       console.log(me.b + "in listener");
       if (me.b==true) {
           console.log(me.b + "true works");
           tools[type](e.latLng, last_marker_origin);
           me.b = false;
       } else {
           console.log(me.b + "bunga bunga");
           //tools[type](e.latLng);
       }
   });