this问题 以及 webstorm 调试界面

this指针问题

1 export class Component {

2  task: Task;

3  test() {
4    _.foreach(this.task.propreties, funtion(property) {
5         const task = this.task;
6    })
  }

}

第5行中报错： this 是 undefined。

原因比较容易判断： 在foreach 中 this 并不是 component

用的是lodash提供的函数

https://www.lodashjs.com/docs...

查看官网之后，并没有提到this的问题。

---

于是查看了Javascript中的foreach 函数

可以看到， Javascript中的foreach函数，有一个可选参数， thisArg

当执行回调函数 callbackFn 时，用作 this 的值。

所以，若我们用的是Javascript中的foreach函数, 就可以使用如下的解决方案：

1 export class Component {
2  task: Task;
3  test() {
4    this.task.propreties.foreach(property => {
5         const task = this.task;
6    }, this)
  }
}

同时，我们也可以让 task 作为 thisAry参数 ， 如第六行。 这是时候 this 就表示 task。

1 export class Component {
2  task: Task;
3  test() {
4    this.task.propreties.foreach(property => {
5         const task = this;
6    }, task)
  }
}

值得注意的是，

如果 thisArg 参数有值，则每次 callbackFn 函数被调用时，this 都会指向 thisArg 参数。如果省略了 thisArg 参数，或者其值为 null 或 undefined，this 则指向全局对象。

所以实际上，在Javascript中，不加这个this, 指的也是全局对象。

回到前面， 由于lodash 提供的 _.foreach()函数， 并没有如同 javascipt 中的 thisArg参数

所以，我们可以自己定义一个this。

const that = this;

之后用到 this 的地方，用 this 替换就可以。

1 export class Component {
2  task: Task;
3  test() {
4     const that = this;
5    _.foreach(that.task.propreties, funtion(property) {
6         const task = that.task;
7    })
  }
}

webstrom 或 idea 调试界面按钮

一、首先说第一组按钮，共8个按钮，从左到右依次如下：

Show Execution Point (Alt + F10)：

如果你的光标在其它行或其它页面，点击这个按钮可跳转到当前代码执行的行。

Step Over (F8)

步过，一行一行地往下走，如果这一行上有方法不会进入方法。

Step Into ( )

步入，如果当前行有方法，可以进入方法内部，一般用于进入自定义方法内，不会进入官方类库的方法。

Force Step Into (Alt + Shift + F7)：

强制步入，能进入任何方法，查看底层源码的时候可以用这个进入官方类库的方法。

Step Out (Shift + F8)：

步出，从步入的方法内退出到方法调用处，此时方法已执行完毕，只是还没有完成赋值。

Drop Frame (默认无)：

回退断点。回到方法的调用处，同时上下文内所有的变量的值也回到那个时候。

该按钮能够点击的前提条件是：当前所处的方法有上级方法，如果你是main方法里，那么按钮就是灰色，无法点击；

Run to Cursor (Alt + F9)：

运行到光标处，你可以将光标定位到你需要查看的那一行，然后使用这个功能，代码会运行至光标行，而不需要打断点。

Evaluate Expression (Alt + F8)：

计算表达式。

二、第二组按钮，共7个按钮，从上到下依次如下：

Rerun 'xxxx'

重新运行程序，会关闭服务后重新启动程序。

Resume Program (F9)：恢复程序，

比如，你在第20行和25行有两个断点，当前运行至第20行，按F9，则运行到下一个断点(即第25行)，再按F9，则运行完整个流程，因为后面已经没有断点了。

Stop 'xxx' (Ctrl + F2)：

连续按两下，关闭程序。有时候你会发现关闭服务再启动时，报端口被占用，这是因为没完全关闭服务的原因，你就需要查杀所有JVM进程了。

View Breakpoints (Ctrl + Shift + F8)：查看所有断点。

7. Mute Breakpoints：

哑的断点，选择这个后，所有断点变为灰色，断点失效，按F9则可以直接运行完程序。再次点击，断点变为红色，有效。如果只想使某一个断点失效，可以在断点上右键取消Enabled。