jquery遍历筛选数组的几种方法和遍历解析json对象

下面我来为你详细讲解一下“jQuery遍历筛选数组的几种方法和遍历解析JSON对象”的攻略。

首先介绍一下遍历和筛选数组的几种方法：

遍历数组

方法一：for循环遍历

使用for循环来遍历数组的元素，可以通过数组下标来获取每一个元素，示例代码如下:

var arr = ['A','B','C','D','E','F'];

for(var i = 0; i < arr.length; i ++ ){
  console.log(arr[i]); // A B C D E F
}

方法二：$.each()方法遍历

使用$.each()方法配合回调函数来遍历数组，可以获取到每一个元素和索引，示例代码如下:

var arr = ['A','B','C','D','E','F'];

$.each(arr, function(index, value){
  console.log(index + ':' + value); // 0:A 1:B 2:C 3:D 4:E 5:F
});

筛选数组

方法一：$.grep()方法

使用$.grep()方法来筛选数组，筛选出符合条件的数组元素组成新的数组返回，示例代码如下：

var arr = [1,2,3,4,5,6,7,8,9,10];

var evenNums = $.grep(arr, function(element, index){
  return (element % 2 == 0);
})

console.log(evenNums); // [2, 4, 6, 8, 10]

方法二：$.map()方法

使用$.map()方法将符合条件的元素通过回调函数返回新的处理后的数组，示例代码如下：

var arr = [1,2,3,4,5,6,7,8,9,10];

var evenNums = $.map(arr, function(element, index){
  if(element % 2 == 0){
    return element*2;
  }else{
    return null;
  }
});

console.log(evenNums); // [4, 8, 12, 16, 20]

接下来介绍一下遍历和解析JSON对象的方法：

遍历JSON对象

方法一：$.each()方法遍历

使用$.each()方法来遍历JSON对象，可以获取到每一个键值对，示例代码如下：

var jsonObj = {"name":"xiaoming", "age":20, "gender":"male"};

$.each(jsonObj, function(key, value){
  console.log(key + ":" + value); // name:xiaoming age:20 gender:male
});

解析JSON对象

方法一：$.parseJSON()方法

使用$.parseJSON()方法将JSON字符串解析为JSON对象，示例代码如下：

var jsonStr = '{"name":"xiaoming", "age":20, "gender":"male"}';

var jsonObj = $.parseJSON(jsonStr);

console.log(jsonObj.name); // xiaoming

方法二：$.getJSON()方法

使用$.getJSON()方法通过URL获取JSON数据并解析为JSON对象，示例代码如下：

$.getJSON('your_url', function(data){
  console.log(data.name); //通过调用属性来访问数据
});

以上就是关于“jQuery遍历筛选数组的几种方法和遍历解析JSON对象”的攻略了。