javascript 变量作为数组索引不起作用- React

zzwlnbp8 于 2023-01-19 发布在 Java

关注(0)|答案(3)|浏览(164)

我在使用变量作为数组索引时遇到了一个问题。如果我使用一个数字作为数组索引，它可以工作，但变量不能。变量显示为一个数字。

///the array to access:

    const listaProd = [
      {
        name: 'Água..........',
        price: 2.5,
      },
      {
        name: 'Coca-cola.......',
        price: 6,
      },  
      {
        name: 'Almoço executivo..',
        price: 25.5,
      },
    /////etc....
    ];
    ///////////////etc....

/// these are indexes of listaProd to be listed
const ar = [1, 2];

    {
                          ///ar is set as the array: [1, 2] here.
                          /// this means I wanna get listaProd[1] and listaProd[2]

                          ar.map((p, c) => {
                            console.log('-', p);
                            {
                              /**p is a number, either 1 or 2, checked */
                            }
                            let index = parseInt(p);
                            {
                              /**to be sure it is a number... */
                            }
    
                            return (
                              <div className="pedido_client" key={c}>

                                {/**-----it does work! --------*/}
                                {listaProd[1].name}
    
                                {/**does not work */}
                                {listaProd[p].name}
    
                                {/**does not work */}
                                {listaProd[index].name}
    
                                {/**does not work */}
                                {listaProd.at(index).name}

                              </div>
                            );
                          })
                        }

我得到错误：
错误代码：/〜/src/App. js（144：1）未定义列表产品[p]
所以，在第一种情况下，零可以作为索引，但是p和index都不能作为索引，为什么？
现在所有的事情都在这里（请启用被阻止的Cookie）https://stackblitz.com/edit/react-xek249?file=src%2FApp.js,src%2Fstyle.css
你可以把它分叉然后测试它。

JavaScript

来源：https://stackoverflow.com/questions/75157973/variable-as-array-index-not-working-react

3条答案

按热度按时间

flseospp1#

如控制台中所示，数组中的第二项是undefined，因为连续有两个逗号（，，）。因此，如果删除second comma，数组将不包含undefined，这会导致问题。

const listaProd = [
  {
    name: 'Água..........',
    price: 2.5,
  },,
  {
    name: 'Coca-cola.......',
    price: 6,
  },
  {
    name: 'Almoço executivo..',
    price: 25.5,
  },,
  {
    name: 'Rodízio.........',
    price: 50,
  },
  {
    name: 'Sobremesa.....',
    price: 12.5,
  },
];

console.log(`Second value in the array is: ${listaProd[1]}`);

赞(0）回复(0）举报 2023-01-19

von4xj4u2#

您正在Map此数组const ar = [1, 2];

ar.map((value,index)=>console.log(value)) // it will return 1 , 2

在数组中有索引1但是索引2是未定义的。

{ ar.map((p, c) => {
                    let index = parseInt(p);
                    return (
                      <div className="pedido_client" key={c}>
                        {listaProd[index% ar.length].name }
                      </div>
                    );
                  })

}
{listaProd[index% ar.length].name }允许您保持在数组索引的范围内。建议