利用jQuery操作對象數組

jQuery對於數組元素操作主要提供了以下工具：

(1)數組和對象的例遍：jQuery.each(obj,callback)

通用例遍方法，可用於例遍對象和數組。回調函數擁有兩個參數：第一個為對象的成員或數組的索引，第二個為對應變量或內容。如果需要退出 each 循環可使回調函數返回 false，其它返回值將被忽略。

（2）數組元素的過濾：jQuery.grep(array,callback,[invert])

使用過濾函數過濾數組元素。此函數至少傳遞兩個參數：待過濾數組和過濾函數。過濾函數必須返回 true 以保留元素或 false 以刪除元素。

（3）數組元素的查找：jQuery.inArray(value,array)

確定第一個參數在數組中的位置(如果沒有找到則返回 -1 )。

（4）刪除重復元素：jQuery.unique(array)

刪除數組中重復元素。

 

下面的實例通過對象數組的過濾來實現獲取或者刪除指定屬性為指定值的數組元素。

<script src="js/jquery.js" ></script>
<script>
/**
* 從對象數組中刪除屬性為objPropery，值為objValue元素的對象
* @param Array arrPerson  數組對象
* @param String objPropery  對象的屬性
* @param String objPropery  對象的值
* @return Array 過濾后數組
*/
function remove(arrPerson,objPropery,objValue)
{
   return $.grep(arrPerson, function(cur,i){
          return cur[objPropery]!=objValue;
       });
}
/**
* 從對象數組中獲取屬性為objPropery，值為objValue元素的對象
* @param Array arrPerson  數組對象
* @param String objPropery  對象的屬性
* @param String objPropery  對象的值
* @return Array 過濾后的數組
*/
function get(arrPerson,objPropery,objValue)
{
   return $.grep(arrPerson, function(cur,i){
          return cur[objPropery]==objValue;
       });
}
/**
* 顯示對象數組信息
* @param String info  提示信息
* @param Array arrPerson  對象數組
*/
function showPersonInfo(info,arrPerson)
{
   $.each(arrPerson, function(index,callback){
         info+="Person id:" + arrPerson[index].id + " name:" +  arrPerson[index].name+ " sex:"+ arrPerson[index].sex+" age:"+  arrPerson[index].age+"/r/t";
    });
    alert(info);
}
//測試數據
var arrPerson=new Array();
var person=new Object();
person.id=1;
person.name="帥哥";
person.sex="男";
person.age=30;
arrPerson.push(person);
 
person=new Object();
person.id=2;
person.name="美眉甲";
person.sex="女";
person.age=28;
arrPerson.push(person);
 
person=new Object();
person.id=3;
person.name="美眉乙";
person.sex="女";
person.age=20;
arrPerson.push(person);
 
//測試刪除
showPersonInfo("原始數組：/r/t",arrPerson);
arrPerson=remove(arrPerson,"id",1);
showPersonInfo("刪除之后：/r/t",arrPerson);
//測試獲取
arrPerson=get(arrPerson,"id",3);
showPersonInfo("只獲取ID為3的元素：/r/t",arrPerson);
 
</script>