Jquery 遍历数组的多种方法及$.each()方法的详细介绍

编程跟早晨洗漱差不多重要，只不过处理的方式不同罢了。别担心，就算你只会Ctrl+C和Ctrl+V，也不用怕搞不定jQuery这个JavaScript大神提供的各种便利快捷的方法。今儿个，咱就来瞅瞅jQuery是咋让数组遍历变得既轻松又好玩的！

$.each()方法：数组的舞蹈大师

$.each(arr, function(index, value) {
  // 遍历操作
});

看这里，快来认识一下$.each()大佬，这家伙超级牛，能帮咱们将各种各样的数字集合并搞成NodeList甚至跳起舞蹈~用着可真省心：只要告诉它你想要干啥，以及怎么跳就行。这个函数会带着两个小弟index和value，告诉我们你当下的动作以及正在干啥。比如说，你有一堆五颜六色的积木，那就让$.each()当个放大镜，告诉你每块积木在哪里，是什么颜色。

var arr = ['a', 'b', 'c'];
$.each(arr, function(index, value) {
  console.log('index: ' + index + ', value: ' + value);
});

$.map()方法：数组的艺术画家

index: 0, value: a
index: 1, value: b
index: 2, value: c

然後來到我們的特許變焦項目：$.map()！這位大師可不只是看下數組裡的每個點滴而已，他甚至還能創作出新畫面！假如你手頭有個數組，每個元素都希望變得美麗動人，那麼就該用上$.map()了！他就像是個藝術家，會根據你的需求，將每個元素重新塑造出你喜愛的模樣，最後呈現出一幅全新且獨特的作品。

$.grep()方法：数组的精明筛选者

$.map(arr, function(value, index) {
  // 处理操作
  return value;
});

用上筛选，$.grep()这个“聪明”的图书管理员就像活了过来，只要给定要找的书，立马就能找到。只要指定待筛选的数组和条件，它会一下子生成一个新数组，只包含想要的信息。感觉就像是有了个无敌强大的搜索引擎，数据筛选瞬间变得简单且准确。

var arr = ['a', 'b', 'c'];
var newArr = $.map(arr, function(value, index) {
  return value.toUpperCase();
});
console.log(newArr); // ['A', 'B', 'C']

$.inArray()方法：数组的寻宝地图

不光是找遍数组那么简单，有时候我们也想要知道那个特别的元素藏哪儿了？这个时候，$.inArray()这个强大函数就管用只要告知它宝贝元素和数组信息，立马就能知道元素在哪儿。如果找不到也没关系，直接告诉你就是啦：“不好意思，啥都没找到~”

总结：jQuery，数组遍历的万能钥匙

$.grep(arr, function(value, index) {
  // 筛选条件
  return ...
});

通过刚才的讲解，我们发现jQuery真是厉害！无论你想要查看数组内容，还是要对其进行各种处理和挑选，jQuery都有办法帮你完成得又快又好。这样一来，不仅做事效率提高了，而且编程也变得更加有趣！

哈喽大家好，我来问问你们，最喜欢哪种jQuery数组遍历法呀？理由又是啥？赶快去评论区告诉我们。别忘了给这篇文章点赞分享，让更多朋友知道jQuery到底有多好玩儿~

var arr = [1, 2, 3, 4, 5];
var evens = $.grep(arr, function(value, index) {
  return value % 2 === 0;
});
console.log(evens); // [2, 4]