user3685949
user3685949

Reputation: 111

Errors when using/defining function in JavaScript

I wrote a JS function which parses a JSON response and displays it as a toast message. Everything works fine. I am now adding an additional feature. The JSON response is in this format:

{
  "type": "message",
  "message": "Payment Approved with Order Number: &&Secure.OrderNum&& and Transaction ID: &&Secure.TransactionNum&&"
}

Instead of taking the whole message, I want to extract the variable value of TransactionNum and just display it in the HTML (so not just in the toast).

So this is the JS I wrote to extract the one value in the message object:

_onDataEvent(jsonData) {
  let eventData = JSON.parse(jsonData);

  // Is this a message?
  if (eventData.type === "message") {
    // Yes, show the status
    let message = eventData.message;
    const evt = new ShowToastEvent({
      title: "Payment Status",
      message: message,
      variant: 'info'
    });
    dispatchEvent(evt);
  }

  // Is this a result?
  else if (eventData.type === 'result') {
    // Yes, show the result
    let success = eventData.success;
    let message = eventData.message;

    const evt = new ShowToastEvent({
      title: "Payment Result",
      message: message,
      variant: success ? 'success' : "error",
      url: "www.five9.com"
    });
    transaction(message); //I added this and VS code keeps on putting a red squiggly line on it.
    dispatchEvent(evt);
  }
}

transaction(message) {
  var words = message.split(" ");
  var transactionId = words[-1];
  return transactionId;
}

Right now, I am getting errors on the when I am calling the method. It says

transaction is not defined

When I add function keyword to the method, I then don't get the red squiggly line on the method call, but I get another error saying

Unexpected token: A constructor, expression, accessor or property was expected

I am not sure how to solve this. Have I done something wrong in the method? Is the method written correctly? Do I need to add something or change the order?

Upvotes: 1

Views: 88

Answers (2)

FZs
FZs

Reputation: 18619

Your code is probably inside an object literal, or class declaration.

  • If you omit the function keyword, you define a method on the object (not a global scope function).
  • You can't use the function keyword there, as it isn't allowed.

To solve it, place the function declaration inside the _onDataEvent method, to create it locally:

_onDataEvent(jsonData) {

  function transaction(message) {
    var words = message.split(" ");
    var transactionId = words[-1];
    return transactionId;
  }

  let eventData = JSON.parse(jsonData);

  // Is this a message?
  if (eventData.type === "message") {
    // Yes, show the status
    let message = eventData.message;
    const evt = new ShowToastEvent({
      title: "Payment Status",
      message: message,
      variant: 'info'
    });
    dispatchEvent(evt);
  }

  // Is this a result?
  else if (eventData.type === 'result') {
    // Yes, show the result
    let success = eventData.success;
    let message = eventData.message;

    const evt = new ShowToastEvent({
      title: "Payment Result",
      message: message,
      variant: success ? 'success' : "error",
      url: "www.five9.com"
    });
    transaction(message);
    dispatchEvent(evt);
  }
}

Also, the transaction function does nothing useful in its current form:

  • It does not mutate anything
  • It returns a value, but the caller ignores it
  • You can't access array indexes from backwards using negative numbers, it will access the "-1" property instead (which is usually undefined)

But these are off-topic for this question.

Upvotes: 1

LCPunch
LCPunch

Reputation: 29

It seems that you're using your code wrapped in a class.

In this context, your this is related to the object. So if you don't use 'this' it will search just within the function context, thus giving you the error.

Upvotes: 0

Related Questions