时间戳

首页 > 解决方案 > Javascript - 使用 setter 初始化类，其中 set 方法与字段同名抛出： RangeError：超过最大调用堆栈大小

javascript - Javascript - 使用 setter 初始化类，其中 set 方法与字段同名抛出： RangeError：超过最大调用堆栈大小

问题描述

我有一个组件，我正在初始化一个具有设置器的类。这是组件：

constructor(props) {
    super(props);
    this.errorLoggGateway = new ErrorLoggGateway();
}

这是ErrorLoggGateway类：

import {fetchConvenienceWrapper} from "./fetchTools";

export class ErrorLoggGateway {
  constructor() {
    this.id = null;
  }

  set id(id) {
    this.id = id;
  }

  loggError(error) {
    return fetchConvenienceWrapper('/backend/api/logg', {
      method: 'POST',
      body: JSON.stringify({error, id: this.id})
    });
  }
}

但是，当我拥有它时，我得到一个错误：

RangeError: Maximum call stack size exceeded
ErrorLoggGateway.set id [as id]
C:/Users/myuser/Desktop/Projects/project/frontend/src/logic/ErrorLoggGateway.js:9
   6 | }
   7 | 
   8 | set id(id) {
>  9 |   this.id = id;
     | ^  10 | }
  11 | RangeError: Maximum call stack size exceeded
ErrorLoggGateway.set id [as id]
C:/Users/myuser/Desktop/Projects/project/frontend/src/logic/ErrorLoggGateway.js:9
   6 | }
   7 | 
   8 | set id(id) {
>  9 |   this.id = id;
     | ^  10 | }
  11 | 
  12 | loggError(error) {
  12 | loggError(error) {

如果我更改了 set 方法的名称，那么它可以工作，为什么它相同时会失败？

标签： javascript

解决方案

这是通过set id(id)调用本身this.id=。见console.log()：

class Something{
  set id(id){
    console.log(id);
    this.id=id;
  }
};

new Something().id=10;

解决方案：以其他方式命名“私有”变量，例如this._id.

哦，你要求解释。this.id=简单地调用与调用set id()相同的方式new Something().id=。无论属性是从类的“外部”还是“内部”访问，setter 都是一个 setter。

推荐阅读