js中对数组进行处理两种函数介绍（filter()函数和indexOf()函数）

1. 去重、过滤。

/*
   * @interface Grid  1.行更新
   * */
  handleGridRowsUpdated = ({fromRow, toRow, updated })=> {
    console.log('1.handleGridRowsUpdated',arguments)
    let rows = this.state.rows;

    for (let i = fromRow; i <= toRow; i++) {
      let rowToUpdate = rows[i];
      let updatedRow = React.addons.update(rowToUpdate, {$merge: updated});
      rows[i] = updatedRow;
    }

    this.setState({ rows });
  };

  /*
   * @interface 2.选中行接口
   * @param {Array} 选中的行
   * */
  onRowsSelected = (rows ) =>{ /*新增选择的行*/
    //进行复选。
    this.setState( {
      selectedIds: this.state.selectedIds.concat( rows.map(r => r.row[this.props.rowKey])),
    });
    this.setState({
      selectedRows: this.state.selectedRows.concat( rows.map(r => r.row)),
    });
    //进行单选
     /* this.setState({
      selectedIds: rows.map(r => r.row[this.props.rowKey]),
    });
    this.setState({
      selectedRows: rows.map(r => r.row),
    });*/

  };

  /*
   * @interface 3.取消选中行接口
   * @param {Array} 取消选中的行
   * */
  onRowsDeselected = (rows /*取消选择的行*/) =>{
    let rowIds = rows.map(r =>  r.row[this.props.rowKey]);
    this.setState({
      selectedIds: this.state.selectedIds.filter(i => rowIds.indexOf(i) === -1 ), //
    });
    this.setState({
      selectedRows: this.state.selectedRows.filter(r => rowIds.indexOf(r[this.props.rowKey]) === -1 )
    });
  };


  /**
   * @interface 4.行选中接口
   * */
  onRowClick = (rowIdx, clickedRow)=>{
    //console.log('选中行', rowIdx,'_行数据 ', clickedRow);
    // case1. 如果是全选操作，跳过会自动调用onRowsSelected方法，如果是单选操作请隐藏全选checkbox视图操作
    if(rowIdx === -1){
      return;
    }
    // case2. 不是全选操作
    const hasSelected =  this.state.selectedRows.some((item)=>{
      return item[this.props.rowKey] === clickedRow[this.props.rowKey]
    });

    if(hasSelected){
      let rowIds = clickedRow[this.props.rowKey];
      //console.log('选中rowIds', rowIds );

      this.setState({
        selectedIds: this.state.selectedIds.filter(i => rowIds.toString().indexOf(i) === -1 )
      });
      this.setState({
        selectedRows: this.state.selectedRows.filter(r => rowIds.toString().indexOf(r[this.props.rowKey]) === -1 )
      });
    }else{
      // case2-case1. 采用赋值，如果是只能选中一行采用赋值，如果是合并选中行，采用concat方法来合并操作
      this.setState({selectedIds: [clickedRow[this.props.rowKey]]});
      this.setState({selectedRows: [clickedRow]});
    }
  };

2. 遍历数组。

{
  title: '类型',
  dataIndex: 'type',
  key: 'type',
  width: 80,
  sortable: false,
  render: (value, record, i)=>{
    //类型模块
    let _arr =[], text='';
    _arr = searchTextByValues('doctor_advice_type');//模块名称---匹配字典表。
    if(_arr.length > 0) {
      _arr.map((item)=> {
        if (value === item.value) {
          text = item.text;
          return
        }
      })
    }
    return (
      <span>{text}</span>
    )
  }
},

<===================== ViewLabProjectModal ==========================================>

/** 2.2 字典表的模块类型  **/
matchDictionaryList = (type, value)=>{
  let moduleType = searchTextByValues(type);  return (
    moduleType instanceof Array ?
      moduleType.map((item)=>{
        if(item.value === value) { //匹配
          return  item.text;
        }
      })
     : ''  )}

使用：

<td><p className={`${inlineTrCls}`}>{ this.matchDictionaryList('project_detail_type', k.type)}</p></td>
<td><p className={`${inlineTrCls}`}>{k.ageMin}- {k.ageMax}</p> </td>
<td><p className={`${inlineTrCls}`}>{ this.matchDictionaryList('sex', k.sex)}</p></td>
<td><p className={`${inlineTrCls}`}>{k.minValue}-{k.maxValue}</p></td>

相关推荐：

JS数组(Array)处理函数整理_基础知识

js如何获取数组并处理php数组

以上就是js中对数组进行处理两种函数介绍（ filter()函数和indexOf()函数）的详细内容，更多请关注Gxl网其它相关文章！