多個條件來生成一個映射函數中的字符串

Question

我存儲陣列看起來像：

let arr = [ 
    { 
    name: "James", 
    age: 24 
    }, 
    name: "Patrick", 
    age: 20 
    }, 
    { 
    name: "John", 
    age: 23 
    } 
]; 

我試圖得到一個字符串，將是這樣的：

Hi James, Patrick and John 
     ^  ^
     |   | 
     Comma  And 

添加,（逗號）在每個名字之後，但不在最後一個之後。以及在最後一個詞之前的And這個詞。我使用的地圖：

arr.map((l,i) => 
    <span key={i}> 
    {i < arr.length - 1 ? `${l.name}, ` : 
    i === arr.length - 1 ? `and ${l.name}.` : ''} 
    </span>) 

我得到：

James, Patrick, and John 
      ^
       | 
     This is Extra 

有一個美麗而簡單的方法來獲得這樣的結果呢？和一個函數將是純粹的，並在數組中的所有數量的名字工作？最好用ES6 ..謝謝！

Answer 1

我認爲不都是一樣的，你正在尋找

const names = arr.map((l,i) => html`<span key="${i}">${l.name}</span`); 
const last = names.pop(); 
return names.length ? names.join(", ") + " and " + last : last; 

不要使用map的部分嘗試項目。

Answer 2

您可以使用reduce()做到這一點

let arr = [{ 
 
    name: "James", 
 
    age: 24 
 
}, { 
 
    name: "Patrick", 
 
    age: 20 
 
}, { 
 
    name: "John", 
 
    age: 23 
 
}]; 
 

 
var result = arr.reduce(function(r, e, i) { 
 
    if ((i + 1) == (arr.length - 1)) { 
 
    r += e.name; 
 
    } else if ((i + 1) != arr.length) { 
 
    r += e.name + ', '; 
 
    } else { 
 
    r += ' and ' + e.name; 
 
    } 
 
    return r; 
 
}, 'Hi '); 
 

 
console.log(result)

Answer 3

你可以做到這一點。

arr.map((l,i) => 
    if (i <arr.length-1) { 
    if(i === arr.length-2) { 
    <span key={i}> 
    {`${l.name} `} 
    </span>) 
    } else { 
    <span key={i}> 
    {`${l.name}, `} 
    </span>)   
    } 
    } else { 
    <span key={i}> 
    `and ${l.name}.` 
    </span>) 
} 

Answer 4

你可以用下面的代碼

arr.map((l,i) => 
    <span key={i}> 
    {i < arr.length - 1 && i !== arr.length - 2 ? `${l.name}, ` : ''} 
    {i === arr.length - 2 ? `${l.name} ` : ''} 
    {i === arr.length - 1 ? `and ${l.name}.` : ''} 
    </span>)