p5.js NumberDict add() 方法

p5.js 中 p5.NumberDict 的add() 方法将给定值添加到给定键处的值，并将更新后的值存储在同一键处。键值对是一组相互映射的两个值。可以通过使用该对的键部分查询此字典来访问这些值。数字字典可以存储多个键值对，这些键值对可以使用字典的方法进行访问。

句法：

add( Key, Number )

参数：这个函数有两个参数，如上所示，下面讨论：

• 键：这是一个数字，表示将添加值的键。
• 数字：这是一个数字，表示要添加的值。

下面的示例说明了 p5.js 中的add() 方法：

例子：

Javascript

let y = 0;
  
function setup() {
  createCanvas(550, 500);
  textSize(16);
  
  text("Click on the button to create a new " +
       "dictionary and add the given value",
       20, 20);
  
  text("Key:", 20, 260);
  text("Value:", 160, 260);
  
  key_input = createInput();
  key_input.position(70, 250);
  key_input.size(40);
  
  val_input = createInput();
  val_input.position(220, 250);
  val_input.size(40);
  
  setBtn = 
    createButton("Create random dictionary");
  setBtn.position(30, 40);
  setBtn.mouseClicked(createNewDict);
  
  addBtn = 
    createButton("Add given value to key");
  addBtn.position(30, 300);
  addBtn.mouseClicked(addVal);
}
  
function createNewDict() {
  clear();
  
  // Create an object with random values
  let obj = {};
  for (let i = 0; i < 6; i++) {
    let rk = ceil(Math.random() * 100);
    let rn = floor(Math.random() * 100);
    obj[rk] = rn;
  
    text("Key: " + rk + " : Value: " +
         rn, 40, 120 + 20 * i);
  }
  
  // Create a number dict using the above values
  numDict = createNumberDict(obj);
  
  text("New Dictionary created with values",
       20, 80);
  
  text("Click on the button to create a new " +
       "dictionary and add the given value",
       20, 20);
  
  text("Key:", 20, 260);
  text("Value:", 160, 260);
}
  
function addVal() {
  // Get the key and value to be updated
  let keyToChange = int(key_input.value());
  let valToAdd = int(val_input.value());
  
  // Get the previous value in the dictionary
  let prevVal = numDict.get(keyToChange);
  
  // If the key exists in the dictionary
  if (prevVal) {
    numDict.add(keyToChange, valToAdd);
  
    // Get the updated value
    let updatedVal = numDict.get(keyToChange);
    
    text("The value at key: " + keyToChange +
         " was: " + prevVal, 20, 360 + y * 40);
    text("The updated value at key: " +
         keyToChange + " is: " + updatedVal,
         20, 380 + y * 40);
  }
  else {
    text("Please enter a proper key",
         20, 380 + y * 40);
  }
  
  y = y + 1;
  
  text("Click on the button to create a new " +
       "dictionary and add the given value",
       20, 20);
}

输出：

在线编辑器： https://editor.p5js.org/
环境设置： https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
参考： https://p5js.org/reference/#/p5.NumberDict/add