Category: JavaScript

Sometimes, we want to calculate string value in JavaScript without using eval.

In this article, we’ll look at how to calculate string value in JavaScript without using eval.

How to calculate string value in JavaScript without using eval?

To calculate string value in JavaScript without using eval, we can use the Function constructor.

For instance, we write

const evil = (fn) => {
  return new Function("return " + fn)();
};

console.log(evil("(12 / 5) * 9 + 9.4 * 2;"));

to define the evil function.

In it, we create a function from the fn string with the Function constructor.

fn has the function’s code in a string.

Then we call the function and return its return value.

Next, we call evil with the expression we want to evaluate in a string to get the result of the expression.

Conclusion

To calculate string value in JavaScript without using eval, we can use the Function constructor.

Sometimes, we want to access static methods within classes with TypeScript.

In this article, we’ll look at how to access static methods within classes with TypeScript.

How to access static methods within classes with TypeScript?

To access static methods within classes with TypeScript, we access it as a property of the class.

For instance, we write

interface IHasMemberFunction {
  aMemberFunction(): void;
}

class Test {
  public static aStaticFunction(aClass: IHasMemberFunction): void {
    aClass.aMemberFunction();
  }

  private aMemberFunction(): void {
    Test.aStaticFunction(this);
  }
}

class Another {
  private anotherMemberFunction(): void {
    Test.aStaticFunction(new Test());
  }
}

to call the Test.aStaticFunction static method in the Another class’ anotherMemberFunction method and in the Test class’ aMemberFunction method.

We define the static method with the static keyword.

Conclusion

To access static methods within classes with TypeScript, we access it as a property of the class.

Sometimes, we want to make input fields read-only through JavaScript.

In this article, we’ll look at how to make input fields read-only through JavaScript.

How to make input fields read-only through JavaScript?

To make input fields read-only through JavaScript, we use the setAttribute method.

For instance, we write

document.getElementById("myReadonlyInput").setAttribute("readonly", "true");

to select the input with getElementById.

Then we call setAttribute with the attribute name and value to set the readonly attribute of the input to true.

Conclusion

To make input fields read-only through JavaScript, we use the setAttribute method.

Sometimes, we want to allow CORS in JavaScript.

In this article, we’ll look at how to allow CORS in JavaScript.

How to allow CORS in JavaScript?

To allow CORS in JavaScript, we can use the res.header method.

For instance, we write

const app = express();

app.use((req, res, next) => {
  res.header("Access-Control-Allow-Origin", "*");
  res.header(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept"
  );
  next();
});

to call app.use with a callback that sends the headers to enable CORS.

We send the Access-Control-Allow-Origin and Access-Control-Allow-Headers headers to enable CORS.

Conclusion

To allow CORS in JavaScript, we can use the res.header method.

Sometimes, we want to use Async/Await with Axios in React.js.

In this article, we’ll look at how to use Async/Await with Axios in React.js.

How to use Async/Await with Axios in React.js?

To use Async/Await with Axios in React.js, we can use it in a function.

For instance, we write

const axios = require("axios").default;

const sendGetRequest = async () => {
  try {
    const resp = await axios.get("https://jsonplaceholder.typicode.com/posts", {
      headers: {
        authorization: "Bearer YOUR_JWT_TOKEN_HERE",
      },
    });

    console.log(resp.data);
  } catch (err) {
    console.error(err);
  }
};

sendGetRequest();

to define the sendGetRequest function.

In it, we call axios.get to make a get request.

And then we get the response body from resp.data.

We get the error from err.

Conclusion

To use Async/Await with Axios in React.js, we can use it in a function.