JS - 它是什麼類型的對象，我怎樣才能訪問它

Question

我正在玩reactjs並且在處理對象時遇到問題。目的是如下：

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]) 

    } 

將打印四個標題（類型，價格，金額，總計），但我真的想做一些更復雜的事情。例如。

• 顯示一個類型的所有交易：購買
• 顯示所有的交易總價值大於x等

我將如何訪問所有這些。你能舉個例子嗎？

編輯：我添加了一個方法如下建議 - 但它不顯示任何內容：

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> 

    ); 
    } 
} 

Answer 1

我覺得這更像是一個普通的JavaScript的問題。你所要求的是過濾你的數組中的對象列表，所以通過使用數組的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