web-dev-qa-db-ja.com

JavaScriptマップ配列の最後のアイテム

私はこれを持っています：

map = ranks.map((row, r) => (
  row.map((rank, i) => {
    return [element(r, i, state, rank, toggled, onClick)];
  })
));

2次元配列を通してマッピングします。各行の後に、<div class="clearfix"></div>を挿入します。

どういうわけか各行の最後のインデックスを取得できれば、行マップコールバックで使用できると思います。誰かがそれを行う方法を教えてもらえますか？

javascriptarraysmultidimensional-array
36
cocacrave
const rowLen = row.length;
row.map((rank, i) => {
  if (rowLen === i + 1) {
    // last one
  } else {
    // not last one
  }
})
64
LeoYuan 袁力皓

LeoYuan袁力皓 と答えたので、これは正しい答えですが、少し改善することができます。
mapは、3番目のパラメーター（反復配列自体）を持つ関数を受け入れます。

row.map((rank, i, arr) => {
    if (arr.length - 1 === i) {
        // last one
    } else {
        // not last one
    }
});

arr.lengthの代わりにrow.lengthを使用することは、いくつかの理由でより適切で正しい方法です。

  1. スコープを混在させると、特に記述が不十分なコードで、予期しないバグが発生する可能性があります。一般に、可能であれば、スコープ間での混合を避けるのに常に良い方法です。

  2. 明示的な配列を提供する場合も同様に機能します。例えば。

    [1,2,3,4].map((rank, i, arr) => {
    if (arr.length - 1 === i) {
        // last one
    } else {
        // not last one
    }
});

  3. （主にパフォーマンスを向上させるために）mapスコープの外にコールバックを移動したい場合、row.lengthをスコープ外に使用するのは間違っています。例えば。 OPの場合：

    const mapElement = (rowIndex, state, toggled, onClick) => {
    return (rank, i, arr) => {
        let lastIndex = arr.length - 1;
        return [element(rowIndex, i, state, rank, toggled, onClick, lastIndex)];
    };
};

map = ranks.map((row, r) => row.map(mapElement(r, state, toggled, onClick)));
43
Slavik Meltser

受け入れられた答えのわずかな改善：

const lastIndex = row.length - 1;
row.map((rank, i) => {
  if (i === lastIndex) {
    // last one
  } else {
    // not last one
  }
})

これにより、ループ内から算術演算が削除されます。

3
tpower

配列の長さで最後のインデックスを確認できます。ここにロジックがあります

var randomnumber = Math.floor(Math.random() * (100 - 10 + 1)) + 10

console.log("your last index is dynamic, ehich is ",randomnumber-1);
let arry = [];
for (i=1;i<randomnumber;i++){
    arry.Push(i)
}

    arry.map((data,index)=>{
          if(index == arry.length-1 ){
            console.log("last index data  ",data)
          }
          else{
          console.log("remain data ",data)
          
          }

    })

    console.log("your last index is dynamic, which is ",randomnumber-1);
1
manan5439
const array = ['Apple','orange','banana'];

array.map((element, index) => {
  //Last element
  if (index === array.length - 1) {
    return `${element}.`;
  }
  //Another elements
  return `${element}, `;
})}

Apple, orange, banana.を返します

0
Hadnazzar