Javascript 中的索引 getter

Question

我直接使用 Javascript（请不要使用 JQuery 或类似的东西）。我已经实现了一个包装数组的类，因此：

class Ctrls
{
    _items = new Array();
        
    constructor()
    {
        this._items = new Array();
    }   
    
    Add(oCtrl)
    {
        this._items.push( { key:oCtrl.Name, value:oCtrl } );
    }   
    
    Clear()
    {
        this._items = new Array();
    }   
    
    get Count()
    {
        return this._items.length;
    }   
    
    get Item(index)
    {
        // get the index'th item. 
        // If item is numeric, this is an index.
        // If item is a string, this is a control name
        if (Number.isInteger(index))
        {
            return this._items(index).value;
        }
        else
        {
            item = this._items.find(element => (element.value.Name == index));
            return item;
        }
    }   
    
    get Items()
    {
        return this._items; // in case we desperately need to
    }
}

在 get Item(index) 处，我在页面加载时收到错误，这是 Uncaught SyntaxError: Getter 不得有任何形式参数。我来自 C# 世界，正在寻找相当于：

public Ctrl Item(iIndex)
{
    get
    {
        return _items[iIndex];
    }
}

How do I index a getter in Javascript?

---

编辑（1）：我建议将 get Item 转换为函数，但如果我将定义更改为：

    function GetItem(index) // returns Ctrl
    {
        // get the index'th item. 
        // If item is numeric, this is an index.
        // If item is a string, this is a control name
        if (Number.isInteger(index))
        {
            return this._items(index).value;
        }
        else
        {
            item = this._items.find(element => (element.value.Name == index));
            return item;
        }
    }   

我在页面加载时收到此错误：Uncaught SyntaxError：意外的标识符< /code> 在 function GetItem... 行

---

编辑(2)：将上面的内容修改为：

    GetItem(index) // returns Ctrl
    {
        // get the index'th item. 
        // If item is numeric, this is an index.
        // If item is a string, this is a control name
        if (Number.isInteger(index))
        {
            return this._items(index).value;
        }
        else
        {
            item = this._items.find(element => (element.value.Name == index));
            return item;
        }
    }   

因为类内的函数不使用 function 关键字，这很奇怪。现在这有效了。谢谢大家。

Answer 1

“你不能将参数传递给 JS 中的 getter”。理论上：是的，你不能那样做。但实际上：函数是 JS 中的一等公民，因此它们可以是函数的参数或返回值。你可以这样做：

class GetterWithParameter {
  constructor() {
    this.array = ["index 0", "index 1", "index 2"]
  }
  get itemAtIndex() {
    return (idx) => this.array[idx]
  }
}

const getterWithParameter = new GetterWithParameter()

const idx0 = getterWithParameter.itemAtIndex(0)
const idx1 = getterWithParameter.itemAtIndex(1)
const idx2 = getterWithParameter.itemAtIndex(2)

console.log("item at index 0:", idx0)
console.log("item at index 1:", idx1)
console.log("item at index 2:", idx2)

因此，虽然 getter 不能有参数，但您可以返回一个可以接收参数的函数 - 并使用它。

当然，其用法似乎与在需要相同参数的类上定义函数相同 - 但您仍然使用 getter。