Javascript 为什么可以'；t我使用“；这"；rxjs.let（）操作中的关键字？

我正在学习Typescript中的抽象类。

this

关键字在这个类中的每个方法中都非常有效，除了

handlerry

。即使我尝试在该方法的顶部

console.log（this.amiUrl）

，它也会爆炸并告诉我它找不到它

我已经尝试删除受保护的关键字，认为我误解了它的用法。没有变化

角度4.3

Typescript 2.4.1

import { HttpHeaders, HttpClient, HttpErrorResponse } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';

import { ToastsManager } from 'ng2-toastr/ng2-toastr';

import { Store } from '@ngrx/store';
import * as uiActions from '../../core/store/actions/ui.actions';
import * as fromRoot from '../../core/store/reducers';

import { environment } from '../../../environments/environment';

@Injectable()
export abstract class RestService {
  protected amiUrl = environment.api;
  protected maxRetryAttempts = 3;

  constructor (
    private http: HttpClient,
    private store: Store<fromRoot.State>,
    private toastr: ToastsManager ) { }

  private get headers(): HttpHeaders {
    const headers: HttpHeaders = new HttpHeaders();
    headers.set('Authorization', 'Bearer ' + environment.accessToken);
    return headers;
  }

  protected get(url: string) {
    return this.http.get(this.amiUrl + url, { headers: this.headers })
      .let(this.handleRetry);
  }

  protected post(url: string, payload: any) {
    return this.http.post(this.amiUrl + url, payload, { headers: this.headers })
      .let(this.handleRetry);
  }

  protected delete(url: string) {
    return this.http.delete(this.amiUrl + url, { headers: this.headers })
      .let(this.handleRetry);
  } 

  protected handleRetry<T>(source: Observable<T>): Observable<T> { 
    return source.retryWhen(e => 
      e.scan((errorCount, error) => {
        if (errorCount >= this.maxRetryAttempts) {
          this.store.dispatch(new uiActions.ClearRetryNotificationAction);
          throw error;
        } else {
          this.store.dispatch(new uiActions.CreateRetryNotificationAction({ attempt: errorCount + 1, maxAttempts: this.maxRetryAttempts }))
          return errorCount + 1;
        }
      }, 0)
      .delay(2000))
  }

  protected handleError(err: HttpErrorResponse, customMessage?: string) {
    this.store.dispatch(new uiActions.CreateErrorNotificationAction(customMessage));

    console.log(err.error);
    console.log(err.status);
    console.log(err.name);
    console.log(err.message);

    if (!environment.production) {
      this.toastr.error(customMessage);
    }

    return Observable.throw(err.message);
  }
}

从'@angular/common/http'导入{HttpHeaders，HttpClient，HttpErrorResponse}；
从“@angular/core”导入{Injectable}；
从“rxjs/Observable”导入{Observable}；
从“ng2 toastr/ng2 toastr”导入{toastmanager}；
从'@ngrx/Store'导入{Store}；
将*作为uiActions从“../../core/store/actions/ui.actions”导入；
从“../../core/store/reducers”以根目录形式导入*；
从“../../../environments/environment”导入{environment}；
@可注射（）
导出抽象类RestService{
受保护的amiUrl=environment.api；
受保护的最大尝试次数=3；
建造师(
私有http:HttpClient，
私家店，
私人toastr:ToastsManager{}
private get headers（）：HttpHeaders{
const headers:HttpHeaders=新的HttpHeaders（）；
headers.set（'Authorization'、'Bearer'+environment.accessToken）；
返回标题；
}
受保护的get（url:string）{
返回this.http.get（this.amiUrl+url，{headers:this.headers}）
.让（这个手工艺品）；
}
受保护的帖子（url:字符串，有效负载：任意）{
返回this.http.post（this.amiUrl+url，有效负载，{headers:this.headers}）
.让（这个手工艺品）；
}
受保护的删除（url:字符串）{
返回this.http.delete（this.amiUrl+url，{headers:this.headers}）
.让（这个手工艺品）；
} 
受保护的手持设备（来源：可观测）：可观测{
返回source.retryWhen（e=>
e、 扫描（（错误计数，错误）=>{
如果（errorCount>=this.maxRetryAttempts）{
this.store.dispatch（新uiActions.ClearRetryNotificationAction）；
投掷误差；
}否则{
this.store.dispatch（new-uiActions.CreateRetryNotificationAction（{trunt:errorCount+1，maxAttempts:this.maxRetryAttempts}））
返回错误计数+1；
}
}, 0)
（2000年）
}
受保护的句柄错误（错误：HttpErrorResponse，customMessage？：字符串）{
this.store.dispatch（新uiActions.CreateErrorNotificationAction（customMessage））；
console.log（err.error）；
控制台日志（错误状态）；
console.log（错误名称）；
控制台日志（错误消息）；
if（！environment.production）{
此.toastr.error（customMessage）；
}
返回可观察的抛出（错误消息）；
}
}

这是因为您正在将此.Handlery作为回调传递。
调用回调时，作用域会发生更改，

此

不再引用

RestService

的实例

要解决此问题，您有四个选项：

（1） 使用：

（2） 使用一个：

（3） 在ctor中绑定方法：

constructor (
    private http: HttpClient,
    private store: Store<fromRoot.State>,
    private toastr: ToastsManager ) {

    this.handleRetry = this.handleRetry.bind(this);
}

这将在实例中创建一个function类型的属性，因为它是一个arrow函数，所以它被绑定到它。

---

虽然它不是一个方法，但它不会成为原型的一部分，因此如果您扩展该类，它也不会被继承。

这是因为您将

this.handlerry

作为回调传递。
调用回调时，作用域会发生更改，

此

不再引用

RestService

的实例

要解决此问题，您有四个选项：

（1） 使用：

（2） 使用一个：

（3） 在ctor中绑定方法：

constructor (
    private http: HttpClient,
    private store: Store<fromRoot.State>,
    private toastr: ToastsManager ) {

    this.handleRetry = this.handleRetry.bind(this);
}

这将在实例中创建一个function类型的属性，因为它是一个arrow函数，所以它被绑定到它。

---

虽然它不是一个方法，但它不会成为原型的一部分，因此如果您扩展该类，它也不会被继承。

如果我认为我的问题是回调问题，我会知道这是一个重复的问题。我很惊讶我以前没有遇到过这种情况。感谢您对未被继承的函数类型的属性所做的补充评论。这是非常有用的。我选择选项4！如果我认为我的问题是回调问题，我就会知道这是一个重复的问题。我很惊讶我以前没有遇到过这种情况。感谢您对未被继承的函数类型的属性所做的补充评论。这是非常有用的。我选择选项4！

constructor (
    private http: HttpClient,
    private store: Store<fromRoot.State>,
    private toastr: ToastsManager ) {

    this.handleRetry = this.handleRetry.bind(this);
}

handleRetry = <T>(source: Observable<T>): Observable<T> => {
    ...
}