📜  p5.Table getObject() 方法

📅  最后修改于: 2022-05-13 01:58:10.558000             🧑  作者: Mango

p5.Table getObject() 方法

p5.js 中 p5.Table 的getObject() 方法用于将表中的所有数据作为对象检索。可以指定一个可选的列名来存储具有该列名作为属性的表的所有行。

句法:

getObject( [headerColumn] )

参数:此方法接受如上所述和如下所述的单个参数:

  • headerColumn:它是一个字符串,表示应该用作每个行对象的标题的列的名称。

返回值:该方法返回一个包含表中所有数据的对象。

以下示例说明了 p5.js 中的getObject() 方法

示例 1:

Javascript
function setup() {
  createCanvas(600, 300);
  textSize(18);
  
  text("Click on the button to get " +
       "the values of the table as an object",
       20, 20);
  
  setBtn =
    createButton("Get all table values");
  setBtn.position(30, 40);
  setBtn.mouseClicked(showTable);
  
  // Create the table
  table = new p5.Table();
  
  setTableData();
}
  
function setTableData() {
  table.addColumn('Invention');
  table.addColumn('Inventors');
  
  let tableRow = table.addRow();
  tableRow.setString('Invention', 'Telescope');
  tableRow.setString('Inventors', 'Galileo');
  
  tableRow = table.addRow();
  tableRow.setString('Invention', 'Steam Engine');
  tableRow.setString('Inventors', 'James Watt');
  
  tableRow = table.addRow();
  tableRow.setString('Invention', 'Radio');
  tableRow.setString('Inventors', 'Guglielmo Marconi');
}
  
function showTable() {
  clear();
  text("All values retrieved using the " +
       "getObject() method", 20, 20);
  
  // Get all the values in the table as an array
  let tableObject = table.getObject();
  console.log(tableObject);
  
  // Get every row in the table using the length
  // of their keys
  for (let r = 0; r < Object.keys(tableObject).length; r++) {
    
    // Display the row using the JSON format
    text(JSON.stringify(tableObject[r]), 20, 100 + 30 * r);
  }
}


Javascript
function setup() {
  createCanvas(600, 400);
  textSize(18);
  
  text("Click on the button to get the " + 
       "values of the table as an object",
       20, 20);
  
  setBtn =
    createButton("Get all table values");
  setBtn.position(30, 40);
  setBtn.mouseClicked(showTable);
  
  // Create the table
  table = new p5.Table();
  
  setTableData();
}
  
function setTableData() {
  table.addColumn('Invention');
  table.addColumn('Inventors');
  
  let tableRow = table.addRow();
  tableRow.setString('Invention', 'Telescope');
  tableRow.setString('Inventors', 'Galileo');
  
  tableRow = table.addRow();
  tableRow.setString('Invention', 'Steam Engine');
  tableRow.setString('Inventors', 'James Watt');
  
  tableRow = table.addRow();
  tableRow.setString('Invention', 'Radio');
  tableRow.setString('Inventors', 'Guglielmo Marconi');
}
  
function showTable() {
  clear();
  text("All the values are retrieved " +
       "using the getObject() method", 20, 20);
  
  text("Below is the object representation " +
       "of the whole table", 20, 80);
  
  // Get all the values in the table as an object
  // with the header column as "Invention"
  let tableObject = table.getObject("Invention");
  console.log(tableObject);
  
  // Display the object using the JSON format
  text(JSON.stringify(tableObject, null, '\t'), 20, 120);
}


输出:

示例 2:

Javascript

function setup() {
  createCanvas(600, 400);
  textSize(18);
  
  text("Click on the button to get the " + 
       "values of the table as an object",
       20, 20);
  
  setBtn =
    createButton("Get all table values");
  setBtn.position(30, 40);
  setBtn.mouseClicked(showTable);
  
  // Create the table
  table = new p5.Table();
  
  setTableData();
}
  
function setTableData() {
  table.addColumn('Invention');
  table.addColumn('Inventors');
  
  let tableRow = table.addRow();
  tableRow.setString('Invention', 'Telescope');
  tableRow.setString('Inventors', 'Galileo');
  
  tableRow = table.addRow();
  tableRow.setString('Invention', 'Steam Engine');
  tableRow.setString('Inventors', 'James Watt');
  
  tableRow = table.addRow();
  tableRow.setString('Invention', 'Radio');
  tableRow.setString('Inventors', 'Guglielmo Marconi');
}
  
function showTable() {
  clear();
  text("All the values are retrieved " +
       "using the getObject() method", 20, 20);
  
  text("Below is the object representation " +
       "of the whole table", 20, 80);
  
  // Get all the values in the table as an object
  // with the header column as "Invention"
  let tableObject = table.getObject("Invention");
  console.log(tableObject);
  
  // Display the object using the JSON format
  text(JSON.stringify(tableObject, null, '\t'), 20, 120);
}

输出:

在线编辑器: https://editor.p5js.org/

环境设置: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/

参考: https://p5js.org/reference/#/p5.Table/getObject