jQuery 和 map 提供了奇怪的额外数据答案

【问题标题】：jQuery and map gives weird extra datajQuery 和 map 提供了奇怪的额外数据
【发布时间】：2017-09-02 02:40:35
【问题描述】：

这是我的html：

<!doctype html>
<html lang="en">
 <head>
  <script type="text/javascript" src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
 </head>
 <body>
  <ul>
    <li>one</li>
    <li>two</li>
    <li>three</li>
  </ul>  
 </body>
</html>

我只想获取 li 的文字：

$('li').map((i, x) => $(x).text())
// (3) ["one", "two", "three", prevObject: o.fn.init(3), context: document]

我觉得应该有一个简单的方法来做到这一点，而不会在最后得到所有额外的垃圾。

编辑： 已经修复了关于 li 标签的 html。问题不在于糟糕的 html。

【问题讨论】：

为什么li标签没有关闭？
注释行的来源是什么？那是地图的 console.log() 吗？还应注意<li> 应以</li> 关闭才能成为有效的HTML。
但是文本中有一个换行符和空格——你期望什么？

标签： javascript jquery dictionary

【解决方案1】：

你必须在最后使用get()，否则你最终会得到一个jQuery对象，因为jQuery的$.fn.map是用于映射元素，而不是文本。

var arr = $('li').map((i, x) => $(x).text()).get();

console.log(arr)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul>
  <li>one</li>
  <li>two</li>
  <li>three</li>
</ul>

【讨论】：

添加文档链接以获取更多信息 api.jquery.com/map "由于返回值是一个包含数组的 jQuery 对象，因此在结果上调用 .get() 以使用基本数组是很常见的。”
那行得通。所以没有更干净的方法来写吗？感觉有点啰嗦。
你可以这样做 Array.from($('li').map((i, x) => $(x).text()) 因为 jQuery 是一个类似数组的对象，但这更冗长：P
其实我想出的$('li').get().map(x => $(x).text()) 更好一点。不过看起来还是很笨拙。
也可以，但是你不再使用jQuery的地图，而是原生的Array.map

【解决方案2】：

是因为没有使用</li>

let data = $('li').map((i, x) => $(x).text()).get();
console.log(data);

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<html>
 <body>
  <ul>
    <li>one</li>
    <li>two</li>
    <li>three</li>
  </ul>  
 </body>
</html>

【讨论】：