[置顶] ArrayCollection教程之如何搜索、修改指定元素的数据

ArrayCollection教程之如何搜索、修改指定元素的数据

前言：

由题目就知道啦，这次说的是如何ArrayCollection 的两方面操作：搜索和修改。对于搜索，网上很多这方面的内容（这些内容大多都是对的），所以这里扼要说一下如何搜索指定元素，然后再详细阐述今天的重点：如何修改指定元素的数据。

 

在讨论前，先来 创建一个ArrayCollection 吧 ，类似如下的代码：

 

<fx:Script> <!--[CDATA[ import mx.collections.SortField; import mx.collections.Sort; import mx.collections.ArrayCollection; private var arrc:ArrayCollection= new ArrayCollection([{id:0,userName:"AK0",age:0}, {id:2,userName:"CK2",age:2}, {id:1,userName:"BK1",age:1}, {id:3,userName:"BK3",age:3}]); ]]--> </fx:Script>

 

 好了，开始我们的旅程吧~

1、搜索指定元素

1.1、如果一定要自己实现的话可以这么做，示例如下（以用户名为搜索条件）：

private function checkExistence(userName:String):int { var i:int; var arry:Array = arrc.source; while(i < arry.length) { if(arry[i].userName == userName) { return i; } i++; } return -1; }

 

1.2、 如果想省点力气，可以借助 Sort 对象 （以用户名为搜索条件） 。

Sort 对象提供 findItem  方法用于搜索这个 ArrayCollection  中的所有元素。方法原型如下：
public function findItem(items:Array, values:Object, mode:String,
returnInsertionIndex:Boolean = false, compareFunction:Function = null):int
Value  参数可以是包含属性和所需值的任何对象。Mode  字符串可以是
Sort.ANY_INDEX_MODE ，表示返回任何匹配项索引，Sort.FIRST_INDEX_MODE  表示返回第一个匹配项索引，  Sort.LAST_INDEX_MODE  表示返回最后一个匹配项索引。 returnInsertionIndex  参数表示如果该方法找不到由values  参数标识的项目，并且此参数为 true ，则 findItem()  方法将返回这些值的插入点，也就是排序顺序中应插入此项目的
compareFunction  设置用于查找该项目的比较运算符函数.

使用Sort  对象的 findItem  方法代替上面的方法：

private function checkExistence(userName:String):int { var sort:Sort = new Sort(); return sort.findItem(arrc.source,{userName:userName}, Sort.ANY_INDEX_MODE); }

 

但是很不幸的是，建议还是自己写查找的函数吧。经过测试， findItem 是存在 bug的。你可以根据下面的步骤进行测试。现在以查找用户名为 BK1的元素为例子：

A、当 mode 为 Sort.FIRST_INDEX_MODE 时，即

sort .findItem(arrc.source,{userName: "BK1" },Sort.FIRST_INDEX_MODE)

得到的竟然是用户名为"AK0"的元素的索引。

B、 当mode 为 Sort.ANY_INDEX_MODE 时，即

sort .findItem(arrc.source,{userName: "BK1" },Sort.ANY_INDEX_MODE)

得到的结果却是正确的！

C、 当mode 为 Sort.LAST_INDEX_MODE 时，即

sort .findItem(arrc.source,{userName: "BK1" },Sort.LAST_INDEX_MODE)

得到的结果是用户名为"BK3"  的元素的索引。

 

所以，还是别偷懒了，自己写吧！

 

2、 修改指定元素

好了，到今天的重点了。在网上，修改指定元素的方法大概有两种，以修改age为例子，这两种方法分别是：

方法一：

          var  index:int = checkExistence( "BK1" );

       var   object :Object = arrc.getItemAt(index);

       object [ "age" ] = age;

arrc.itemUpdated( object );

方法二：

       var  index:int = checkExistence( "BK1" );

       var   object :Object = arrc.getItemAt(index);

       object [ "age" ] = age;

       arrc.setItemAt(object,index);

 

  

但是以上两种方法都是有问题的。一旦 ArrayCollection 经过排序或者过滤后，使用以上方法修改元素的时候就极有可能会出错。这是为什么呢？

在这之前，你需要了解 ArrayCollection 的两个属性：source 和 list。 source 存储了 ArrayCollection 的原始数据； list 存储了 ArrayCollection 的视图数据，即操作（排序或过滤） source 后的结果集。

checkExistence （ findItem ）的操作对象是 source存储的原始数据， getItemAt 、 itemUpdated 、 setItemAt的操作对象是 list 存储的视图数据。所以使用以上两种方法来修改指定元素的数据时，极有可能出错，除非 ArrayCollection 未排序或过滤，或者 ArrayCollection 重置数据了。

那么正确的修改方法是什么呢？请看下面示例：

var  index:int = checkExistence( " BK1 " );

arrc .source[index].age = age;

 

 

是不是很简单呢？哈哈 ~~好了，这次的讨论就这么结束了，下次有好野再分享哈 ~

 

下面的是全部的测试代码：

<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"> <s:layout> <s:BasicLayout/> </s:layout> <fx:Script> <!--[CDATA[ import mx.collections.ArrayCollection; import mx.collections.Sort; import mx.collections.SortField; [Bindable] private var arrc:ArrayCollection= new ArrayCollection([{id:0,userName:"AK0",age:0}, {id:2,userName:"CK2",age:2}, {id:1,userName:"BK1",age:1}, {id:3,userName:"BK3",age:3}]); private function sortArrc():void { var sort:Sort=new Sort(); //先按ID升序,再按userName升序 sort.fields = [new SortField("id"),new SortField("userName")]; arrc.sort=sort; arrc.refresh();//更新 } private function checkExistence(userName:String):int { var i:int; var arry:Array = arrc.source; while(i < arry.length) { if(arry[i].userName == userName) { return i; } i++; } return -1; } private function editArrc(userName:String,age:int):void { var index:int = checkExistence(userName); if( -1 != index) { //测试网上的方法--> /* var object:Object = arrc.getItemAt(index); object["age"] = age; arrc.itemUpdated(object); */ //<-- //测试我的方法--> arrc.source[index].age = age; arrc.refresh(); //<-- } } protected function button1_clickHandler(event:MouseEvent):void { // TODO Auto-generated method stub sortArrc(); editArrc("BK1",100); } ]]--> </fx:Script> <fx:Declarations> <!-- 将非可视元素（例如服务、值对象）放在此处 --> </fx:Declarations> <mx:DataGrid dataProvider="{arrc}"> <mx:columns> <mx:DataGridColumn headerText="ID" dataField="id"/> <mx:DataGridColumn headerText="Name" dataField="userName"/> <mx:DataGridColumn headerText="Age" dataField="age"/> </mx:columns> </mx:DataGrid> <s:Button x="10" y="232" label="Test" click="button1_clickHandler(event)"/> </s:Application>

 

 

参考资料：

1、 http://www.code-design.cn/article/20100401/2053.aspx

2、 http://programmer.blogbus.com/logs/48539218.html

3、 http://bbs.9ria.com/viewthread.php?tid=54033