2016-09-30 15 views
0

私はreactjsで遊んでいて、オブジェクトの処理に問題があります。次のようにオブジェクトは、次のとおりです。JS - どのようなオブジェクトで、どのようにアクセスできますか?

export default [ 
    { 
    "Type": "Buy", 
    "Price": 0.00226752, 
    "Amount": 55.95995977, 
    "Total": 0.12689032 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226752, 
    "Amount": 146.1, 
    "Total": 0.33128467 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226684, 
    "Amount": 150, 
    "Total": 0.340026 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226684, 
    "Amount": 26.79415765, 
    "Total": 0.06073806 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226684, 
    "Amount": 4.25269162, 
    "Total": 0.00964017 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226659, 
    "Amount": 25.79415765, 
    "Total": 0.05846477 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00225784, 
    "Amount": 4.48789501, 
    "Total": 0.01013294 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226659, 
    "Amount": 1, 
    "Total": 0.00226659 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226663, 
    "Amount": 225, 
    "Total": 0.50999175 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226662, 
    "Amount": 113.4736507, 
    "Total": 0.25720164 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226659, 
    "Amount": 26.79415765, 
    "Total": 0.06073136 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226651, 
    "Amount": 57.98798342, 
    "Total": 0.13143034 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226649, 
    "Amount": 40.19123647, 
    "Total": 0.09109303 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00224958, 
    "Amount": 11.83690383, 
    "Total": 0.02662806 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00241238, 
    "Amount": 838, 
    "Total": 2.02157444 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00231078, 
    "Amount": 9.95795791, 
    "Total": 0.02301064 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.0025, 
    "Amount": 4.1999832, 
    "Total": 0.01049995 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.0025, 
    "Amount": 4.99998, 
    "Total": 0.01249995 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226702, 
    "Amount": 3.63623022, 
    "Total": 0.0082434 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226702, 
    "Amount": 2.14933238, 
    "Total": 0.00487257 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226702, 
    "Amount": 15, 
    "Total": 0.0340053 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00226702, 
    "Amount": 56.80528353, 
    "Total": 0.12877871 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00227634, 
    "Amount": 76.88367619, 
    "Total": 0.17501338 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.0000141, 
    "Amount": 12444, 
    "Total": 0.17546011 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.0000141, 
    "Amount": 12131.09257, 
    "Total": 0.1710484 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00001409, 
    "Amount": 344.0847392, 
    "Total": 0.00484815 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00249461, 
    "Amount": 154.2853438, 
    "Total": 0.38488176 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00249461, 
    "Amount": 33.72938801, 
    "Total": 0.08414166 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00246953, 
    "Amount": 340.8737595, 
    "Total": 0.84179797 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00246953, 
    "Amount": 90.36231511, 
    "Total": 0.22315244 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00246952, 
    "Amount": 55.17093479, 
    "Total": 0.13624572 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00246764, 
    "Amount": 5.75660177, 
    "Total": 0.01420522 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00245929, 
    "Amount": 4.1587629, 
    "Total": 0.0102276 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00252904, 
    "Amount": 37.42985716, 
    "Total": 0.0946616 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00252904, 
    "Amount": 0.59310808, 
    "Total": 0.00149999 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00252904, 
    "Amount": 1.97703476, 
    "Total": 0.00499999 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00252902, 
    "Amount": 446.0229574, 
    "Total": 1.12800097 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00252903, 
    "Amount": 1.97704258, 
    "Total": 0.00499999 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00259459, 
    "Amount": 38.54173491, 
    "Total": 0.09999999 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00259483, 
    "Amount": 105.9381622, 
    "Total": 0.27489152 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00259484, 
    "Amount": 0.03853803, 
    "Total": 0.0001 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00259484, 
    "Amount": 0.03853803, 
    "Total": 0.0001 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00259485, 
    "Amount": 1.91102375, 
    "Total": 0.00495881 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00259459, 
    "Amount": 2, 
    "Total": 0.00518918 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00259464, 
    "Amount": 1.90549392, 
    "Total": 0.00494407 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00259465, 
    "Amount": 28.65568722, 
    "Total": 0.07435147 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.01740491, 
    "Amount": 0.20683711, 
    "Total": 0.00359998 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00238916, 
    "Amount": 79.70696671, 
    "Total": 0.19043269 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00237524, 
    "Amount": 37.90636505, 
    "Total": 0.09003671 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00237524, 
    "Amount": 2.00494017, 
    "Total": 0.00476221 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00237524, 
    "Amount": 18.57724489, 
    "Total": 0.04412541 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00585, 
    "Amount": 56.99961222, 
    "Total": 0.33344773 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00585, 
    "Amount": 0.00007739, 
    "Total": 4.5e-7 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00585, 
    "Amount": 0.00031039, 
    "Total": 0.00000181 
    }, 
    { 
    "Type": "Buy", 
    "Price": 8.6e-7, 
    "Amount": 2070, 
    "Total": 0.0017802 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00187861, 
    "Amount": 65.81153335, 
    "Total": 0.1236342 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00187858, 
    "Amount": 15.66747734, 
    "Total": 0.0294326 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00187857, 
    "Amount": 7.94470487, 
    "Total": 0.01492468 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00187853, 
    "Amount": 0.78814015, 
    "Total": 0.00148054 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00187852, 
    "Amount": 0.78814429, 
    "Total": 0.00148054 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00054142, 
    "Amount": 0.9975, 
    "Total": 0.00054006 
    }, 
    { 
    "Type": "Buy", 
    "Price": 8.6e-7, 
    "Amount": 811.9167491, 
    "Total": 0.00069824 
    }, 
    { 
    "Type": "Buy", 
    "Price": 8.6e-7, 
    "Amount": 338.0832509, 
    "Total": 0.00029075 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00238719, 
    "Amount": 72, 
    "Total": 0.17187768 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00236363, 
    "Amount": 4, 
    "Total": 0.00945452 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00023501, 
    "Amount": 41.1642077, 
    "Total": 0.009674 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00023501, 
    "Amount": 2.7697923, 
    "Total": 0.00065092 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00000105, 
    "Amount": 1270, 
    "Total": 0.0013335 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00281001, 
    "Amount": 360, 
    "Total": 1.0116036 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00280001, 
    "Amount": 3.33990832, 
    "Total": 0.00935177 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.0038, 
    "Amount": 208, 
    "Total": 0.7904 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00356245, 
    "Amount": 1, 
    "Total": 0.00356245 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00370002, 
    "Amount": 0.02702689, 
    "Total": 0.0001 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00370002, 
    "Amount": 15.4008193, 
    "Total": 0.05698333 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00370002, 
    "Amount": 3.09119995, 
    "Total": 0.0114375 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.02315202, 
    "Amount": 6.98549994, 
    "Total": 0.16172843 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.02315202, 
    "Amount": 6e-8, 
    "Total": 0 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00023492, 
    "Amount": 40, 
    "Total": 0.0093968 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00004456, 
    "Amount": 40.3006157, 
    "Total": 0.00179579 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00004461, 
    "Amount": 112.0824927, 
    "Total": 0.00499999 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00004462, 
    "Amount": 33.61721201, 
    "Total": 0.00149999 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00004463, 
    "Amount": 33.60967959, 
    "Total": 0.0015 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.0002817, 
    "Amount": 4, 
    "Total": 0.0011268 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00003965, 
    "Amount": 55.13060038, 
    "Total": 0.00218592 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00003965, 
    "Amount": 104.8693996, 
    "Total": 0.00415807 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00004129, 
    "Amount": 149.625, 
    "Total": 0.00617801 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.02215591, 
    "Amount": 3, 
    "Total": 0.06646773 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00004073, 
    "Amount": 113.3174137, 
    "Total": 0.00461541 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00004072, 
    "Amount": 36.68258634, 
    "Total": 0.00149371 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.0000525, 
    "Amount": 60, 
    "Total": 0.00315 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.01877317, 
    "Amount": 4, 
    "Total": 0.07509268 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00199501, 
    "Amount": 43.10755334, 
    "Total": 0.08599999 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00350201, 
    "Amount": 53.48162609, 
    "Total": 0.18729318 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00350201, 
    "Amount": 132.1260678, 
    "Total": 0.46270681 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.02304826, 
    "Amount": 17.03647964, 
    "Total": 0.39266121 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.02312381, 
    "Amount": 3.52, 
    "Total": 0.08139581 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.02324002, 
    "Amount": 3.39252036, 
    "Total": 0.07884224 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.02459958, 
    "Amount": 7, 
    "Total": 0.17219706 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.01378499, 
    "Amount": 9, 
    "Total": 0.12406491 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00581178, 
    "Amount": 1, 
    "Total": 0.00581178 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.01498881, 
    "Amount": 7, 
    "Total": 0.10492167 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00001717, 
    "Amount": 176.6891735, 
    "Total": 0.00303375 
    }, 
    { 
    "Type": "Sell", 
    "Price": 0.00001718, 
    "Amount": 87.31082654, 
    "Total": 0.00149999 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00001464, 
    "Amount": 182.8870467, 
    "Total": 0.00267746 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00001464, 
    "Amount": 32.11295335, 
    "Total": 0.00047013 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00596086, 
    "Amount": 26, 
    "Total": 0.15498236 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.000017, 
    "Amount": 50, 
    "Total": 0.00085 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.0005388, 
    "Amount": 1, 
    "Total": 0.0005388 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00935588, 
    "Amount": 0.00060288, 
    "Total": 0.00000564 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00935588, 
    "Amount": 0.99939712, 
    "Total": 0.00935023 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.01475001, 
    "Amount": 1, 
    "Total": 0.01475001 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00555, 
    "Amount": 21.28693846, 
    "Total": 0.1181425 
    }, 
    { 
    "Type": "Buy", 
    "Price": 0.00553, 
    "Amount": 9.26025155, 
    "Total": 0.05120919 
    } 
] 

私は値を印刷する方法を示しました:

_renderData(){ 
    const data = this.state.sdc 
    return Object.keys(data).map(function(key,index){ 
     const datum = data[key] 
     return (<div key={datum.id}> 
      <p>Type: {datum.Type}</p> 
      <p>Price: {datum.Price}</p> 
      <p>Amount: {datum.Amount}</p> 
      <p>Total: {datum.Total}</p> 
     </div>) 
    }) 
    } 

は、今私は例えば、それを再生しようとしています:

_extractData() { 
    const data = this.state.sdc 
    return Object.keys(data[0]) 

    } 

が印刷されます4つのヘッダー(タイプ、価格、金額、合計)がありますが、私は実際にはもっと複雑なものをやりたがっています。例えば。

  • 表示タイプのすべてのトランザクション:私はそれらすべてにアクセスする方法を

など、
  • 表示にXより大きい合計値を持つすべてのトランザクションを購入します。あなたは例を挙げてくれますか?

    編集:私は1つの方法は、以下の提案を追加しました - しかし、それは何も表示されません。私は、これは、より一般的なjavascriptの質問のようだと思う

    import React, {Component} from 'react'; 
    import Header from './header/header'; 
    import Body from './body/body'; 
    import sdc from './data'; 
    
    export default class App extends Component { 
        constructor(props) { 
        super(); 
        // Set the initial grid in 
        this.state = { 
         title: "Singularity is nigh!!!", 
         sdc: sdc 
        }; 
    
        } 
    
        _renderData(){ 
        const data = this.state.sdc 
        return Object.keys(data).map(function(key,index){ 
         const datum = data[key] 
         return (<div key={datum.id}> 
          <p>Type: {datum.Type}</p> 
          <p>Price: {datum.Price}</p> 
          <p>Amount: {datum.Amount}</p> 
          <p>Total: {datum.Total}</p> 
         </div>) 
        }) 
        } 
    
    
        _extractData() { 
        const data = this.state.sdc 
        return Object.keys(data[0]) 
    
        } 
    
        _renderBuy() { 
        const data = this.state.sdc 
        data.filter(function(element) { 
         return element.hasOwnProperty("Type") && element.Type == 'Buy'; 
        }); 
    
        } 
    
        render() { 
        const renderedData = this._renderBuy() 
    
    
        return (
         // Add your component markup and other subcomponent references here. 
         <div> 
         <Header title={this.state.title} /> 
         {renderedData}  
         </div> 
    
        ); 
        } 
    } 
    
  • +0

    [アクセス/プロセス(ネストされた)オブジェクト、アレイまたはJSON]の可能な重複(http://stackoverflow.com/questions/11922383/access-process-nested-objects-arrays- or-json) –

    +0

    これはオブジェクトの配列です。 –

    +0

    これはJSONとは関係ありません。 – Wasteland

    答えて

    3

    を。あなたが求めているのは、配列からオブジェクトのリストをフィルタリングすることです。そのためには、配列のfilterメソッドを使用する方法があります。

    // Filter all the transactions of type 'Buy' 
    data.filter(function(element) { 
        return element.hasOwnProperty("Type") && element.Type == 'Buy'; 
    }); 
    
    // Filter all the transactions having a total amount greater than or equal to 0.84 
    data.filter(function(element) { 
        return element.hasOwnProperty("Total") && element.Total >= 0.84; 
    }); 
    

    でそれらをレンダリングするために、あなたはあなたのようなこの新しい返される配列を、横断する必要があるだろうリアクトので、あなたがfilterから取得した出力は、テストに合格する要素を持つオブジェクトのちょうど新しい配列ですあなたの_renderData()インスタンスメソッドで行いました。

    私はあなたの_renderDataメソッドに若干の変更を加えました。オブジェクトの配列である引数を受け付けるので、同じコードを再度実行して「購入」トランザクションをレンダリングする必要はありません。他のフィルタリングされた配列。

    _renderData(data){ 
        return Object.keys(data).map(function(key,index){ 
         const datum = data[key] 
         return (<div key={datum.id}> 
         <p>Type: {datum.Type}</p> 
         <p>Price: {datum.Price}</p> 
         <p>Amount: {datum.Amount}</p> 
         <p>Total: {datum.Total}</p> 
         </div>) 
        }) 
    } 
    
    render() { 
        const renderedData = this._renderData(this._renderBuy()); 
    
        return (
        // Add your component markup and other subcomponent references here. 
        <div> 
         <Header title={this.state.title} /> 
         {renderedData}  
        </div> 
    
    ); 
    }; 
    

    jsBin

    +0

    ありがとうございます。何も表示しない - 上記を参照してください - 最初のメソッドでコードを追加しました。私は間違って何をしていますか? – Wasteland

    +0

    明示していただきありがとうございます - 残念ながら私はまだエラーが発生します:App.js?98ef:18Uncaught TypeError:未定義またはnullをオブジェクトに変換できません – Wasteland

    +0

    私の悪いですが、レンダリング機能の最後に不要な閉じ括弧がありました。私の答えを編集し、それが動作することを確認するためにjsBinリンクを追加しました。 – dzv3

    関連する問題