var testArray = ['red','blue','green'];
$('#primary').html(`${testArray.map( item => {
return `${item}`;
}).join('')}`);
如果map函数里面 写成一行因为箭头函数的关系不用return, item => item 直接会return出来, 像上面如果要加大括号的话 里面要用return的方法, 如果return里面要加html的话要用template literal “ 然后用 ${} 形式 加载出来
join()
方法用于将数组的元素连接成一个字符串。在前面提供的代码中,它在 map()
方法之后使用,将由 map()
生成的 HTML 字符串数组转换为单个字符串。
当您在数组上使用 map()
时,它会生成一个包含经过转换的元素的新数组。在您的情况下,它生成了一个包含 HTML 字符串(对于 testArray
中的每个 item
,生成 <span>${item}</span>
)的数组。
然而,要使用 jQuery 的 .html()
方法设置元素的 HTML 内容,您需要一个包含要插入的 HTML 的单个字符串。因此,在 map()
之后使用了 join('')
方法,将所有 HTML 字符串连接在一起,创建一个单个字符串,可以用作 $('#primary')
的 HTML 内容。
join('')
方法中的空字符 ''
表示在数组元素之间没有任何字符连接,有效地产生一个连续的字符串,符合通过 .html()
设置 HTML 内容所需的格式。
所以,总而言之,join('')
方法用于将由 map()
生成的 HTML 字符串数组转换为单个字符串,然后用于设置指定元素的 HTML 内容。